d3.js

问题 I'm building a grouped bar chart by nesting a .csv file. The chart will also be viewable as a line chart, so I want a nesting structure that suits the line object. My original .csv looks like this: Month,Actual,Forecast,Budget Jul-14,200000,-,74073.86651 Aug-14,198426.57,-,155530.2499 Sep-14,290681.62,-,220881.4631 Oct-14,362974.9,-,314506.6437 Nov-14,397662.09,-,382407.67 Dec-14,512434.27,-,442192.1932 Jan-15,511470.25,511470.25,495847.6137 Feb-15,-,536472.5467,520849.9105 Mar-15,-,612579

问题 I'm building a grouped bar chart by nesting a .csv file. The chart will also be viewable as a line chart, so I want a nesting structure that suits the line object. My original .csv looks like this: Month,Actual,Forecast,Budget Jul-14,200000,-,74073.86651 Aug-14,198426.57,-,155530.2499 Sep-14,290681.62,-,220881.4631 Oct-14,362974.9,-,314506.6437 Nov-14,397662.09,-,382407.67 Dec-14,512434.27,-,442192.1932 Jan-15,511470.25,511470.25,495847.6137 Feb-15,-,536472.5467,520849.9105 Mar-15,-,612579

问题 I am trying to create spinning globe with bars like in this example. You can see my example here. And everything goes fine until bars go over horizon. I have no idea how to cut bars from the bottom when they on other side of planet. Anybody can suggest me how to do it? /* * Original code source * http://codepen.io/teetteet/pen/Dgvfw */ var width = 400; var height = 400; var scrollSpeed = 50; var current = 180; var longitudeScale = d3.scale.linear() .domain([0, width]) .range([-180, 180]); var

问题 I am trying to create spinning globe with bars like in this example. You can see my example here. And everything goes fine until bars go over horizon. I have no idea how to cut bars from the bottom when they on other side of planet. Anybody can suggest me how to do it? /* * Original code source * http://codepen.io/teetteet/pen/Dgvfw */ var width = 400; var height = 400; var scrollSpeed = 50; var current = 180; var longitudeScale = d3.scale.linear() .domain([0, width]) .range([-180, 180]); var

问题 I am trying to create spinning globe with bars like in this example. You can see my example here. And everything goes fine until bars go over horizon. I have no idea how to cut bars from the bottom when they on other side of planet. Anybody can suggest me how to do it? /* * Original code source * http://codepen.io/teetteet/pen/Dgvfw */ var width = 400; var height = 400; var scrollSpeed = 50; var current = 180; var longitudeScale = d3.scale.linear() .domain([0, width]) .range([-180, 180]); var

问题 I am trying to create spinning globe with bars like in this example. You can see my example here. And everything goes fine until bars go over horizon. I have no idea how to cut bars from the bottom when they on other side of planet. Anybody can suggest me how to do it? /* * Original code source * http://codepen.io/teetteet/pen/Dgvfw */ var width = 400; var height = 400; var scrollSpeed = 50; var current = 180; var longitudeScale = d3.scale.linear() .domain([0, width]) .range([-180, 180]); var

问题 I have a DataFrame with the following columns and no duplicates: ['region', 'type', 'name', 'value'] that can be seen as a hierarchy as follows grouped = df.groupby(['region','type', 'name']) I would like to serialize this hierarchy as a JSON object. If anyone is interested, the motivation behind this is to eventually put together a visualization like this one which requires a JSON file. To do so, I need to convert grouped into the following: new_data['children'][i]['name'] = region new_data[

问题 I have a DataFrame with the following columns and no duplicates: ['region', 'type', 'name', 'value'] that can be seen as a hierarchy as follows grouped = df.groupby(['region','type', 'name']) I would like to serialize this hierarchy as a JSON object. If anyone is interested, the motivation behind this is to eventually put together a visualization like this one which requires a JSON file. To do so, I need to convert grouped into the following: new_data['children'][i]['name'] = region new_data[

问题 I am not able to understand how d3.call() works and when and where to use that. Here is the tutorial link that I'm trying to complete. Can someone please explain specifically what this piece is doing var xAxis = d3.svg.axis() .scale(xScale) .orient("bottom"); svg.append("g").call(xAxis); 回答1: I think the trick here is to understand that xAxis is a function that generates a bunch of SVG elements. In fact it is the function returned by d3.svg.axis() . The scale and orient functions are just

问题 I have this piece of code in which circles are drawn, I need to put a text inside each circle, I would also like to know how I can put a certain size to each of the elements of the circle. Thank you very much. svg = d3.select(selector) .append('svg') .attr('width', width) .attr('height', height); // Bind nodes data to what will become DOM elements to represent them. bubbles = svg.selectAll('.bubble') .data(nodes, function (d) { return d.id; }); // Create new circle elements each with class