view release on metacpan or  search on metacpan

share/public/javascripts/d3-force-network-chart.js  view on Meta::CPAN

        // Hello IE 9 - 11
        if (navigator.appVersion.indexOf("MSIE 9") !== -1 ||
            navigator.appVersion.indexOf("MSIE 10") !== -1 ||
            v.status.userAgent.indexOf("Trident") !== -1 && v.status.userAgent.indexOf("rv:11") !== -1) {
            v.status.userAgentIe9To11 = true;
            v.tools.logError("Houston, we have a problem - user agent is IE 9, 10 or 11 - we have to provide a fix " +
                "for markers: " +
                "http://stackoverflow.com/questions/15588478/internet-explorer-10-not-showing-svg-path-d3-js-graph");
        }

    }; // --> END v.main.setupConfiguration

    /*******************************************************************************************************************
     * MAIN: SETUP DOM
     */
    v.main.setupDom = function() {

        // create reference to body
        v.dom.body = d3.select("body");

        // create DOM container element, if not existing (if we have an APEX context, it is already created from the
        // APEX engine )
        if (document.querySelector("#" + v.dom.containerId) === null) {
            v.dom.container = v.dom.body.append("div")
                .attr("id", v.dom.containerId);
        } else {
            v.dom.container = d3.select("#" + v.dom.containerId);
            d3.selectAll("#" + v.dom.containerId + "_customizing").remove();
            // d3.selectAll("#" + v.dom.containerId + "_tooltip").remove();
        }

        // create SVG element, if not existing (if we have an APEX context, it is already created from the APEX plugin )
        if (document.querySelector("#" + v.dom.containerId + " svg") === null) {
            v.dom.svg = v.dom.container.append("svg");
        } else {
            v.dom.svg = d3.select("#" + v.dom.containerId + " svg");
            d3.selectAll("#" + v.dom.containerId + " svg *").remove();
        }

        v.dom.svgParent = d3.select(v.dom.svg.node().parentNode);
        if (v.conf.setDomParentPaddingToZero) {
            v.dom.svgParent.style("padding", "0");
        }

        // configure SVG element
        v.dom.svg
            .attr("class", "net_gobrechts_d3_force")
            .classed("border", v.conf.showBorder)
            .attr("width", v.conf.width)
            .attr("height", v.conf.height);

        // calculate width of SVG parent
        v.dom.containerWidth = v.tools.getSvgParentInnerWidth();
        if (v.conf.useDomParentWidth) {
            v.dom.svg.attr("width", v.dom.containerWidth);
        }

        // create definitions element inside the SVG element
        v.dom.defs = v.dom.svg.append("defs");

        // create overlay element to fetch events for lasso & zoom
        v.dom.graphOverlay = v.dom.svg.append("g").attr("class", "graphOverlay");

        // create element for resizing the overlay g element
        v.dom.graphOverlaySizeHelper = v.dom.graphOverlay.append("rect").attr("class", "graphOverlaySizeHelper");

        // create graph group element for zoom and pan
        v.dom.graph = v.dom.graphOverlay.append("g").attr("class", "graph");

        // create legend group element
        v.dom.legend = v.dom.svg.append("g").attr("class", "legend");

        // create loading indicator
        v.dom.loading = v.dom.svg.append("svg:g")
            .attr("class", "loading")
            .style("display", "none");
        v.dom.loadingRect = v.dom.loading
            .append("svg:rect")
            .attr("width", v.tools.getGraphWidth())
            .attr("height", v.conf.height);
        v.dom.loadingText = v.dom.loading
            .append("svg:text")
            .attr("x", v.tools.getGraphWidth() / 2)
            .attr("y", v.conf.height / 2)
            .text("Loading...");

        // create marker definitions
        v.dom.defs
            .append("svg:marker")
            .attr("id", v.dom.containerId + "_highlighted")
            .attr("class", "highlighted")
            .attr("viewBox", "0 0 10 10")
            .attr("refX", 10)
            .attr("refY", 5)
            .attr("markerWidth", 5)
            .attr("markerHeight", 5)
            .attr("orient", "auto")
            .attr("markerUnits", "strokeWidth")
            .append("svg:path")
            .attr("d", "M0,0 L10,5 L0,10");

        v.dom.defs
            .append("svg:marker")
            .attr("id", v.dom.containerId + "_normal")
            .attr("class", "normal")
            .attr("viewBox", "0 0 10 10")
            .attr("refX", 10)
            .attr("refY", 5)
            .attr("markerWidth", 5)
            .attr("markerHeight", 5)
            .attr("orient", "auto")
            .attr("markerUnits", "strokeWidth")
            .append("svg:path")
            .attr("d", "M0,0 L10,5 L0,10");

        // create tooltip container
        if (document.querySelector("#" + v.dom.containerId + "_tooltip") === null) {
            v.dom.tooltip = v.dom.body.append("div")
                .attr("id", v.dom.containerId + "_tooltip")
                .attr("class", "net_gobrechts_d3_force_tooltip")
                .style("top", "0px")
                .style("left", "0px");
        } else {
            v.dom.tooltip = d3.select("#" + v.dom.containerId + "_tooltip");