d3.js

问题 I've got an old d3v3 bubble chart -- it had some animation aspects -- I am trying to upgrade it to a v4 -- something like this -- http://vallandingham.me/bubble_chart_v4/ and this http://jsfiddle.net/Qh9X5/9515/, https://vallandingham.me/bubble_charts_with_d3v4.html //version 3 https://jsfiddle.net/497tmhu0/ There is always a desire to have some animation for when these bubbles load for the first time. So here - bubbles are created very small and then they expand in size to their resting size

问题 I try to use d3.js in my module. I use Babel 7 for transpiling my code sources. This is my package.json : { "name": "d3_learning", "version": "1.0.0", "description": "", "main": "index.js", "directories": { "test": "test" }, "scripts": { "build": "babel src --out-dir dist --source-maps --minified --no-comments", "build:watch": "npm run build -- -w" }, "babel": { "presets": [ [ "@babel/preset-env", { "useBuiltIns": "entry", "targets": { "firefox": "64", "opera": "57", "chrome": "71", "edge":

问题 I try to use d3.js in my module. I use Babel 7 for transpiling my code sources. This is my package.json : { "name": "d3_learning", "version": "1.0.0", "description": "", "main": "index.js", "directories": { "test": "test" }, "scripts": { "build": "babel src --out-dir dist --source-maps --minified --no-comments", "build:watch": "npm run build -- -w" }, "babel": { "presets": [ [ "@babel/preset-env", { "useBuiltIns": "entry", "targets": { "firefox": "64", "opera": "57", "chrome": "71", "edge":

问题 I 've got a webProject with dc.js (d3.js+crossfilter.js) and ndx.csv file. When i run project into chrome from visual studio, everythings is Ok. Now after build project and copy in other computers, Run that. The problem is here . When i try to run webProject [html file] in other computers with Chrome , this browser has error " XMLHttpRequest cannot load file:///C:/Users/9901/Desktop/WebSite1/ndx.csv. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome

问题 I am using CodeFlower built upon D3.js. I want to show an image as a background instead of arbitrary colors, and i successfully did that using SVG Patterns. DEMO FIDDLE // Enter any new nodes this.node.enter().append('defs') .append('pattern') .attr('id', function(d) { return (d.id+"-icon-img");}) // just create a unique id (id comes from the json) .attr('patternUnits', 'userSpaceOnUse') .attr('width', 80) .attr('height', 80) .append("svg:image") .attr("xlink:xlink:href", function(d) { return

问题 I am using CodeFlower built upon D3.js. I want to show an image as a background instead of arbitrary colors, and i successfully did that using SVG Patterns. DEMO FIDDLE // Enter any new nodes this.node.enter().append('defs') .append('pattern') .attr('id', function(d) { return (d.id+"-icon-img");}) // just create a unique id (id comes from the json) .attr('patternUnits', 'userSpaceOnUse') .attr('width', 80) .attr('height', 80) .append("svg:image") .attr("xlink:xlink:href", function(d) { return

问题 I need to be able to draw links between the circles in a circle pack layout, like {source: i, target: j} . I've seen some questions about how to combine this layout with the force layout that made me think It could be a way to achieve this but I haven't had any luck on that path, also what I need is something completely static. Thank you in advance for any suggestions. 回答1: I finally could draw lines between nodes by appending them to the svg and calculating each line position based on the

问题 I need to be able to draw links between the circles in a circle pack layout, like {source: i, target: j} . I've seen some questions about how to combine this layout with the force layout that made me think It could be a way to achieve this but I haven't had any luck on that path, also what I need is something completely static. Thank you in advance for any suggestions. 回答1: I finally could draw lines between nodes by appending them to the svg and calculating each line position based on the

问题 I have data in the form: data = [..., {id:X,..., turnover:[[2015,2017,2018],[2000000,3000000,2800000]]}, ...]; My goal is to plot the year in the x-axis, against the average turnover for all companies currently selected via crossfilter in the y-axis. The years recorded per company are inconsistent, but there should always be three years. If it would help, I can reorganise the data to be in the form: data = [..., {id:X,..., turnover:{2015:2000000, 2017:3000000, 2018:2800000}}, ...]; Had I been

问题 I currently have a chart with 2 viewing options (regular data and percentages). I also have a tooltip that shows the results for each line that I'm showing When I switch options I want my tooltip to keep showing the info (the lines are getting drawn correctly) but instead what I'm seeing is that I'm creating several tooltip boxes for each time I switch options. My tooltip is an append('g') to my main chart and I'm appending my tooltip box to this tooltip which is appended to my chart which is