d3.js

For loop does not work in D3.js

由 妖精的绣舞 提交于 2021-02-08 07:32:27
问题 I'm new to Javascript and D3.js and trying to change a circle element continuously in a for loop. It's meant to change the radius of the circle every second but it turns out that the radius just jumps to 50, ignoring 26 to 49. Here's my code. <!DOCTYPE html> <meta charset="utf-8"> <style> </style> <body> <script src="//d3js.org/d3.v3.min.js" charset="utf-8"></script> <script src="//d3js.org/topojson.v1.min.js"></script> <script> var width = 960, height = 1160; var svg = d3.select("body")

force directed graph change color of all connected node on mouseover

由 江枫思渺然 提交于 2021-02-08 07:28:29
问题 I have a force directed graph with different nodes, I want to change the color of the selected node and all the connected (neighbour) nodes when user does mouseover to it. I am trying to do this.. function onMouseover(d){ node.style("fill", function(o){ var color = isConnected(d, o) ? 'red' : 'blue'; return color; }) force.resume(); } function isConnected(d, o){ return o.index === d,index || (d.children && d.children.indexOf(o.index) !== -1) || (o.children && o.children.indexOf(d.index) !==

force directed graph change color of all connected node on mouseover

由 房东的猫 提交于 2021-02-08 07:27:32
问题 I have a force directed graph with different nodes, I want to change the color of the selected node and all the connected (neighbour) nodes when user does mouseover to it. I am trying to do this.. function onMouseover(d){ node.style("fill", function(o){ var color = isConnected(d, o) ? 'red' : 'blue'; return color; }) force.resume(); } function isConnected(d, o){ return o.index === d,index || (d.children && d.children.indexOf(o.index) !== -1) || (o.children && o.children.indexOf(d.index) !==

d3 error displaying datetime on x-axis line chart

由 血红的双手。 提交于 2021-02-08 07:20:03
问题 I am implementing a multi-line series chart using d3.js and I am getting an error pointing to my x-axis when trying to plot my dateTime from the data coming in. "Error: attribute d: Expected number, "MNaN,376.88020650…"." Here is my function var data = [{ "Brand": "Toyota", "Count": 1800, "Time": "2017-04-02 16"}, { "Brand": "Toyota", "Count": 1172, "Time": "2017-04-02 17"}, { "Brand": "Toyota", "Count": 2000, "Time": "2017-04-02 18"}, { "Brand": "Honda", "Count": 8765, "Time": "2017-04-02 16

d3 error displaying datetime on x-axis line chart

由 浪尽此生 提交于 2021-02-08 07:17:58
问题 I am implementing a multi-line series chart using d3.js and I am getting an error pointing to my x-axis when trying to plot my dateTime from the data coming in. "Error: attribute d: Expected number, "MNaN,376.88020650…"." Here is my function var data = [{ "Brand": "Toyota", "Count": 1800, "Time": "2017-04-02 16"}, { "Brand": "Toyota", "Count": 1172, "Time": "2017-04-02 17"}, { "Brand": "Toyota", "Count": 2000, "Time": "2017-04-02 18"}, { "Brand": "Honda", "Count": 8765, "Time": "2017-04-02 16

NetworkD3 Sankey Plot in R: How to switch text labels from the right to the left of the inner nodes only

由 坚强是说给别人听的谎言 提交于 2021-02-08 06:52:38
问题 I created a Sankey Plot using the NetworkD3 R package. Below is an example of the output: Sankey Plot Example I used the following code for the Sankey: sankeyNetwork(Links = SankeyLinks, Nodes = SankeyNodes, Source = "source", Target = "target", Value = "value", NodeID = "names", fontSize = 14, nodeWidth = 20,nodePadding = 15,NodeGroup = "nodeColor", colourScale = JS(ColourScale), LinkGroup = "linkColor", sinksRight = T) The network generates text labels to the right of the middle nodes,

NetworkD3 Sankey Plot in R: How to switch text labels from the right to the left of the inner nodes only

由 拜拜、爱过 提交于 2021-02-08 06:52:12
问题 I created a Sankey Plot using the NetworkD3 R package. Below is an example of the output: Sankey Plot Example I used the following code for the Sankey: sankeyNetwork(Links = SankeyLinks, Nodes = SankeyNodes, Source = "source", Target = "target", Value = "value", NodeID = "names", fontSize = 14, nodeWidth = 20,nodePadding = 15,NodeGroup = "nodeColor", colourScale = JS(ColourScale), LinkGroup = "linkColor", sinksRight = T) The network generates text labels to the right of the middle nodes,

Convert d3.csv to promise?

由 泄露秘密 提交于 2021-02-08 06:23:26
问题 Using Angular 5 and I would like to load a CSV file into the async pipe, how do I convert this to a promise? d3.csv(this.csvFile, function(data) { console.log(data); }); 回答1: Starting with d3 version 5, promises are built in. d3.csv("file.csv").then(function(data) { console.log(data); }); If you use async/await you can do this: const data = await d3.csv("file.csv"); console.log(data); 回答2: With enough googling I worked it out... loadCSV(file: string) { return new Promise(function (resolve,

custom html boxes in tree layout with d3.js

由 五迷三道 提交于 2021-02-08 05:33:06
问题 I have a requirement where I have to develop a tree layout similar to what is given by d3.js tree layout. But I want html boxes with custom content rather than just nodes. I have spent lot of time trying to find if its possible with d3.js but I am stuck at this point of time and unable to proceed. The data will be dynamic It does not have to be d3.js if there are any other viable solution/framework available. But the functionality expected is similar to what is provided by d3 ie- expanding,

D3 Loading in CSV file then using only specific columns

由 不打扰是莪最后的温柔 提交于 2021-02-08 03:55:17
问题 I've had a hard time getting two columns from a CSV file with which I am planning on building a basic bar chart. I was planning on getting 2 arrays (one for each column) within one array that I would use as such to build a bar chart. Just getting started with D3, as you can tell. Currently loading the data in gets me an array of objects, which is then a mess to get two columns of key-value pairs. I'm not sure my thinking is correct... I see this similar question: d3 - load two specific
订阅 d3.js