javascript - Weird behaviour of Fisheye Distortion plugin -



javascript - Weird behaviour of Fisheye Distortion plugin -

hi utilize fisheye distortion plugin force-directed graph in d3.js, when want apply plugin, behaviour of graph weird. new in d3.js , not @ computer graphics.

complete sample in jsfiddle

var fisheye = d3.fisheye.circular() .radius(200) .distortion(2); // graph - variable represents whole graph graph.svg.on("mousemove", function() { fisheye.focus(d3.mouse(this)); d3.select("svg").selectall("circle").each(function(d) { d.fisheye = fisheye(d); }) .attr("cx", function(d) { homecoming d.fisheye.x; }) .attr("cy", function(d) { homecoming d.fisheye.y; }) .attr("r", function(d) { homecoming d.fisheye.z * 4.5; }); d3.select("svg").selectall("line").attr("x1", function(d) { homecoming d.source.fisheye.x; }) .attr("y1", function(d) { homecoming d.source.fisheye.y; }) .attr("x2", function(d) { homecoming d.target.fisheye.x; }) .attr("y2", function(d) { homecoming d.target.fisheye.y; }); });

weird behaviour mean nodes of graph disappear (are hidden) after mouseover action.

the problem using code add together cx , cy circles, circles enclosed within nodeelements transformed place.

hence, changing fisheye code next solves problem:

graph.svg.on("mousemove", function() { fisheye.focus(d3.mouse(this)); // alter transform on .node d3.select("svg").selectall(".node") .each(function(d) { d.fisheye = fisheye({ x: graph.x(d.x), y: graph.y(d.y) }); console.log(d.fisheye, d); }) .attr("transform", function (d) { homecoming "translate(" + d.fisheye.x + "," + d.fisheye.y + ")"; }) // alter 'r'adius on circles within // 1 can scale font of text within nodeelements here .select("circle") .attr("r", function(d) { homecoming 15 * graph.nodesizefactor * d.fisheye.z; }); d3.select("svg").selectall("line") .attr("x1", function(d) { homecoming d.source.fisheye.x; }) .attr("y1", function(d) { homecoming d.source.fisheye.y; }) .attr("x2", function(d) { homecoming d.target.fisheye.x; }) .attr("y2", function(d) { homecoming d.target.fisheye.y; }); });

note have applied proper scales graph.x , graph.y transform attribute , 15 * graph.nodesizefactor radius of circles (instead of 4.5).

working demo: http://jsfiddle.net/90u4sjzm/23/

javascript graphics d3.js fisheye

Comments

Post a Comment

Popular posts from this blog

java Multi query from Mysql using netbeans -

java Multi query from Mysql using netbeans - i have java code retrieve info mysql appropriate code in netbeans.the code below. want multi query such illustration finding total number of products , on.could help me please. in advance import java.sql.*; public class javamysqlselectexample { public static void main(string[] args) { seek { string mydriver = "com.mysql.jdbc.driver"; string myurl = "jdbc:mysql://localhost/sample"; class.forname(mydriver); connection conn = drivermanager.getconnection(myurl, "root", "mypasscode1"); string query = "select * products"; statement st = conn.createstatement(); resultset rs = st.executequery(query); while (rs.next()==true) { int code = rs.getint("code"); string productname = rs.getstring("product_name"); string producttype = rs.getstring("product_type"); system.out.format(" %d, %s, %s\n", code, pr
Read more

c# - DotNetZip fails with "stream does not support seek operations" -

c# - DotNetZip fails with "stream does not support seek operations" - i using dotnetzip in c# unzip stream follows: public static void unzipfromstream(stream stream, string outdir) { //omit seek grab block using (zipfile zip = zipfile.read(stream)){ foreach (zipentry e in zip){ e.extract(outdir, extractexistingfileaction.overwritesilently); } } } stream obtained using webclient client = new webclient(); stream fs = client.openread(url); however, got next exception exception during extracting zip stream system.notsupportedexception: stream not back upwards seek operations. @ system.net.connectstream.get_position() @ ionic.zip.zipfile.read(stream zipstream, textwriter statusmessagewriter, encoding encoding, eventhandler`1 readprogress) on server side(asp.net mvc 4), returning filepathresult or filestreamresult both caused exception. should obtain stream differently on client side? or how create server homec
Read more

c++ - StartServiceCtrlDispatcher don't can access 1063 error -

c++ - StartServiceCtrlDispatcher don't can access 1063 error - i write on c++ service , have error, , don't can fixed it. my service main function int main (int argc, tchar *argv[]) {dword f; for(int i=0;i<113;i++) f = getlasterror(); servicepath = lptstr(argv[0]); outputdebugstring(_t("my sample service: main: entry")); //installservice(); service_table_entry servicetable[] = { {service_name, (lpservice_main_function) servicemain}, {null, null} }; // startservice(); if(!startservicectrldispatcher(servicetable)) { f = getlasterror(); //addlogmessage("error: startservicectrldispatcher"); } else if( memcmp(argv[argc-1],"install",7)) { installservice(); } else if( memcmp(argv[argc-1],"remove",6)) { removeservice(); } else if( memcmp(argv[argc-1],"start",5)) { startservice(); } else if( memcmp(argv[argc-1],"stop",4))
Read more