deeplearning4jUiAssets.js.samediff.samediff-graph.js Maven / Gradle / Ivy

Go to download
Show more of this group Show more artifacts with this name
Show all versions of deeplearning4j-vertx Show documentation
The newest version!
/*
 *  ******************************************************************************
 *  *
 *  *
 *  * This program and the accompanying materials are made available under the
 *  * terms of the Apache License, Version 2.0 which is available at
 *  * https://www.apache.org/licenses/LICENSE-2.0.
 *  *
 *  *  See the NOTICE file distributed with this work for additional
 *  *  information regarding copyright ownership.
 *  * Unless required by applicable law or agreed to in writing, software
 *  * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
 *  * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
 *  * License for the specific language governing permissions and limitations
 *  * under the License.
 *  *
 *  * SPDX-License-Identifier: Apache-2.0
 *  *****************************************************************************
 */




function renderSameDiffGraph() {
    document.getElementById("samediffcontent").innerHTML = "";

    if (sdGraphNodes) {

        cy = cytoscape({

            container: document.getElementById('graphdiv'), // container to render in

            layout: {
                name: samediffgraphlayout,
                padding: 10,
                klay : {
                    direction: klaylayout
                }
            },

            elements: {
                nodes: sdGraphNodes,
                edges: sdGraphEdges
            },
            style: fetch('/assets/js/samediff/cytoscape-style.json').then(function(res){
                return res.json();
            }),
            wheelSensitivity: 0.2
        });

        // cy.nodes().on("click", function(e){
        //     var clickedNode = e.target;
        //     console.log("Clicked node: " + clickedNode);
        // });
        // cy.nodes().once('click', function(e){
        //     var ele = e.target;
        //     console.log('clicked ' + ele.id());
        // });
        cy.on('click', 'node', function(e){
            var ele = e.target;
            console.log('clicked ' + ele.id());
            onGraphNodeClick(ele.id());
        });
    }
}



function onGraphNodeClick(/*String*/ node){
    var element = $("#sidebarmid");

    var nodeId = idRestoreSlashes(node);    //"while__Enter" -> "while/Enter"

    //Next, find all inputs and outputs...
    var type = "-";
    var extra = "";
    var name = "";
    if(nodeId.startsWith("var-")){
        name = nodeId.substring(4);
        if(sdGraphVariableMap.has(name)){
            type = "Variable";
            var v = sdGraphVariableMap.get(name);
            type = varTypeToString(v.type());
            var dtype = dataTypeToString(v.datatype());
            var shape = varShapeToString(v);
            extra = "Data type: " + dtype + "
Shape: " + shape;
        }
    } else {
        type = "Op";
        name = nodeId;
        var op = sdGraphOpsMap.get(name);   //Map

        var inVars = [];
        for( var i=0; i";
                post = "";
            } else {
                //Not the output of an op, therefore must be a variable node
                pre = "";
                post = "";
            }
            var dtype = dataTypeToString(inVar.datatype());
            var shape = varShapeToString(inVar);
            inVars.push(pre + inName + " (" + dtype + (shape == null || shape === "" ? "" : "," + shape ) + ")" + post);
        }

        var outVars = [];
        // var outVarsStr = "";
        var inputsForOps = new Set();
        var len = op.outputsLength();
        for( var i=0; i";
            var inputsForLength = outVar.inputsForOpLength();
            for( var j=0; j" + s + "
";
        }

        extra = "Op Name: " + op.opName() + "
" +
        "Input Variables:
" +
        inVars.join("
") + "
" +
        "Output Variables: " + "" + "
" +
        outVars.join("
") + "
" +
        "Inputs For Ops:
" + outOpStr;


    }

    document.getElementById("sidebarmid-content").innerHTML =
        "Name: " + name + "
" +
        "Type: " + type + "
" +
        extra;
}

function onGraphNodeSearch(){
    var value = document.getElementById("findnodetxt").value;

    var results = [];
    if(value != null && value !== ""){
        // for( var v in values ){
        // while(values.hasNe)
        for(var i=0; i" + results[i] + "\n";
    }
    listHtml = listHtml + "";
    document.getElementById("findnoderesults").innerHTML = listHtml;
}

function centerViewOnNode(/*String*/ clicked ){
    //Find the node, and center the view on it
    // var node = cy.$("#" + clicked);  //"The selector `#while/Enter`is invalid"
    var id = idEscapeSlashes(clicked);
    if(sdGraphVariableMap.has(id)){
        id = "var-" + id;
    }
    var node = cy.$('#' + id);
    cy.center(node);
}