xxxxxxxxxx<meta charset="utf-8"><style>.node { stroke: #fff; stroke-width: 1.5px;}.link { stroke: #999; stroke-opacity: .6;}</style><body></body><link href="https://rawgithub.com/VisDockHub/NewVisDock/master/master/visdock.css" rel="stylesheet" type="text/css"/><script src="https://d3js.org/d3.v3.min.js"></script><script src="https://rawgithub.com/visdockhub/newvisdock/master/master/visdock.js"></script><script src="https://rawgithub.com/visdockhub/newvisdock/master/master/2d.js"></script><script src="https://rawgithub.com/visdockhub/newvisdock/master/master/intersectionutilities.js"></script><script src="https://rawgithub.com/visdockhub/newvisdock/master/master/visdock.utils.js"></script><script>VisDock.init('body', {width: 1000, height: 800});AnnotatedByData.layerTypes = ["circle"];var viewport = VisDock.getViewport();var width = 960, height = 500;var color = d3.scale.category20();var force = d3.layout.force() .charge(-120) .linkDistance(30) .size([width, height]);/*var svg = d3.select("body").append("svg") .attr("width", width) .attr("height", height);*/var svg = viewport;d3.json("miserables.json", function(error, graph) { force .nodes(graph.nodes) .links(graph.links) .start(); var link = svg.selectAll(".link") .data(graph.links) .enter().append("line") .attr("class", "link") .style("stroke-width", function(d) { return Math.sqrt(d.value); }); var node = svg.selectAll(".node") .data(graph.nodes) .enter().append("circle") .attr("class", "node") .attr("r", 5) .style("fill", function(d) { return color(d.group); }) .call(force.drag); node.append("title") .text(function(d) { return d.name; }); force.on("tick", function() { //VisDock.updateLayers(); for (var i = 0; i < num; i++){ findConvex(QueryManager.layers[i], VisDock.color[i], i); } link.attr("x1", function(d) { return d.source.x; }) .attr("y1", function(d) { return d.source.y; }) .attr("x2", function(d) { return d.target.x; }) .attr("y2", function(d) { return d.target.y; }); node.attr("cx", function(d) { return d.x; }) .attr("cy", function(d) { return d.y; }); });}); VisDock.eventHandler = { getHitsPolygon : function(points, inclusive) { var shapebound = new createPolygon(points); return shapebound.intersectEllipse(d3.selectAll(".node")[0], inclusive) }, getHitsEllipse : function(points, inclusive) { var shapebound = new createEllipse(points); return shapebound.intersectEllipse(d3.selectAll(".node")[0], inclusive) }, getHitsLine : function(points, inclusive) { var shapebound = new createLine(points); return shapebound.intersectEllipse(d3.selectAll(".node")[0], inclusive) }, setColor : function(hits) { //var circleObjects = d3.selectAll("circle")[0]; QueryManager.layers[num - 1] = hits; //for (var i = 0; i < hits.length; i++) { // VisDock.utils.addEllipseLayer(hits[i], null, num - 1); //} findConvex(hits, VisDock.color[num-1], num-1); }, changeColor : function(color, query, index) { }, changeVisibility : function(vis, query, index) { }, removeColor : function(hits, index) { for (var i = 0; i < hits.length; i++) { hits[i].remove(); } }, } function findConvex(hits, color, id){ var theta0 = 0; var done = 0; var index = -1; var xprev; var yprev; var connect = []; var count = 0; var cas = 0; while (done == 0 && count < 1000){ count++; if (index == -1){ var x = 1000000; for (var j = 0; j < hits.length; j++){ if (parseFloat(hits[j].getAttribute("cx")) < x){ x = parseFloat(hits[j].getAttribute("cx")); index = j; } } connect.push(index); xprev = parseFloat(hits[index].getAttribute("cx")); yprev = 1*parseFloat(hits[index].getAttribute("cy")); theta0 = Math.atan((yprev/xprev)); } else if (connect.length == 1){ var theta; var theta_min = 100000000; var dx, dy; for (var j = 0; j < hits.length; j++){ if (j != connect[0]){ dy = 1*(parseFloat(hits[j].getAttribute("cy")) - yprev); dx = (parseFloat(hits[j].getAttribute("cx")) - xprev); theta = Math.atan((dy/dx)); if ((theta) < (theta_min)){ theta_min = theta; index = j; var dx2 = dx; var dy2 = dy; } } } if (dx2 <= 0 && dy2 >= 0){ cas = 1; } else if (dx2 <= 0 && dy2 <= 0){ cas = 2; } else if (dx2 >= 0 && dy2 <= 0){ cas = 3; } else if (dx2 >= 0 && dy2 >= 0){ cas = 4; } theta_n = Math.abs(Math.atan(dy2/dx2)); xprev = parseFloat(hits[index].getAttribute("cx")); yprev = 1*parseFloat(hits[index].getAttribute("cy")); connect.push(index); } else if (connect.length > 1){ var n = connect.length - 1; var theta; //var theta_n = 0; var theta_min = 100000000; var dx, dy; for (var j = 0; j < hits.length; j++){ if (j == connect[0] || connect.indexOf(j) == -1){ if (j != connect[connect.length-2]){ if (j != connect[n]){ dy = 1*(parseFloat(hits[j].getAttribute("cy")) - yprev); dx = (parseFloat(hits[j].getAttribute("cx")) - xprev); theta = Math.atan((dy/dx)); //theta += Math.PI + theta0; if (dx <= 0 && dy >= 0){ // case 1 if (cas == 1){ theta = Math.PI + theta_n - Math.abs(theta); } else if (cas == 2){ theta = Math.PI + theta_n + Math.abs(theta); } else if (cas == 3){ if (Math.abs(theta) > theta_n){ theta = theta_n - Math.abs(theta) + 2*Math.PI; } else{ theta = -1*theta_n + Math.abs(theta) + 2*Math.PI; } } else if (cas == 4){ theta = 2*Math.PI - theta_n - Math.abs(theta); } } else if (dx <= 0 && dy <= 0){ // case 2 if (cas == 1){ theta = Math.PI + theta_n + Math.abs(theta); } else if (cas == 2){ theta = Math.PI - theta_n + Math.abs(theta); } else if (cas == 3){ theta = 2 * Math.PI - Math.abs(theta) - theta_n; } else if (cas == 4){ if (Math.abs(theta) > theta_n){ theta = 2*Math.PI + theta_n - Math.abs(theta); } else { theta = 2*Math.PI - theta_n + Math.abs(theta); } } } else if (dx >= 0 && dy <= 0){ // case 3 if (cas == 1){ if (Math.abs(theta) > theta_n){ theta = 2*Math.PI + theta_n - Math.abs(theta); } else { theta = 2*Math.PI - theta_n + Math.abs(theta); } } else if (cas == 2){ theta = 2*Math.PI - theta_n - Math.abs(theta); } else if (cas == 3){ theta = Math.PI + theta_n - Math.abs(theta); } else if (cas == 4){ theta = Math.PI + theta_n + Math.abs(theta); } } else if (dx >= 0 && dy >= 0){ // case 4 if (cas == 1){ theta = 2*Math.PI - theta_n - Math.abs(theta); } else if (cas == 2){ if (Math.abs(theta) > theta_n){ theta = 2*Math.PI + theta_n - Math.abs(theta); } else { theta = 2*Math.PI - theta_n + Math.abs(theta); } } else if (cas == 3){ theta = Math.abs(theta) + theta_n + Math.PI; } else if (cas == 4){ theta = Math.PI - theta_n + Math.abs(theta); } } if ((theta) < (theta_min)){ theta_min = theta; index = j; var dx2 = dx; var dy2 = dy; } } } } } if (connect.indexOf(index) == -1 || index == connect[0]){ if (connect.length != 2 || connect.indexOf(index) == -1){ connect.push(index); xprev = parseFloat(hits[index].getAttribute("cx")); yprev = parseFloat(hits[index].getAttribute("cy")); theta0 = theta_min; theta_min = 10000000; theta_n = Math.abs(Math.atan(Math.abs(dy2/dx2))); if (dx2 <= 0 && dy2 >= 0){ cas = 1; } else if (dx2 <= 0 && dy2 <= 0){ cas = 2; } else if (dx2 >= 0 && dy2 <= 0){ cas = 3; } else if (dx2 >= 0 && dy2 >= 0){ cas = 4; } } } if (index == connect[0] && connect.length != 2){ done = 1; } } } var points = ""; for (var i = 0; i < connect.length; i++){ var cx = parseFloat(hits[connect[i]].getAttribute("cx")); var cy = parseFloat(hits[connect[i]].getAttribute("cy")); points = points + cx + "," + cy + " "; } if (d3.select("#v" + id)[0][0] == null){ svg.append("polygon") .attr("id", "v" + id) .attr("points", points) .attr("stroke-width", 2) .attr("fill", color) .attr("pointer-events", "none") .attr("opacity", "0.2"); } else { d3.select("#v" + id) .attr("points", points) } var check; } d3.select(self.frameElement).style("height", "800px"); d3.select(self.frameElement).style("width", "1000px"); </script> Modified http://d3js.org/d3.v3.min.js to a secure url
Modified http://rawgithub.com/VisDockHub/NewVisDock/master/master/visdock.js to a secure url
Modified http://rawgithub.com/VisDockHub/NewVisDock/master/master/2D.js to a secure url
Modified http://rawgithub.com/VisDockHub/NewVisDock/master/master/IntersectionUtilities.js to a secure url
Modified http://rawgithub.com/VisDockHub/NewVisDock/master/master/visdock.utils.js to a secure url
https://d3js.org/d3.v3.min.js
https://rawgithub.com/VisDockHub/NewVisDock/master/master/visdock.js
https://rawgithub.com/VisDockHub/NewVisDock/master/master/2D.js
https://rawgithub.com/VisDockHub/NewVisDock/master/master/IntersectionUtilities.js
https://rawgithub.com/VisDockHub/NewVisDock/master/master/visdock.utils.js