d3v4

d3.time.format.multi in v4.x

由 纵饮孤独 提交于 2019-12-23 09:37:22
问题 In a previous version of my code I used to set the appropriate locale format like this format = { "decimal": ".", "thousands": "", "grouping": [3], "currency": ["€", ""], "dateTime": "%a %b %e %X %Y", "date": "%d-%m-%Y", "time": "%H:%M:%S", "periods": ["AM", "PM"], "days": ["Domenica", "Lunedi", "Martedi", "Mercoledi", "Giovedi", "Venerdi", "Sabato"], "shortDays": ["Do", "Lu", "Ma", "Me", "Gi", "Ve", "Sa"], "months": ["Gennaio", "Febbraio", "Marzo", "Aprile", "Maggio", "Giugno", "Luglio",

Why does this vanilla js function return different results in d3v3 and d3v4

由 我的未来我决定 提交于 2019-12-11 02:25:41
问题 This is a MWE based on some templates going from v3 to v4 of the amazing d3.js. The data is in csv file, both examples load the same file (its clean): day,movie1,movie2,movie3,movie4,movie5,movie6 1,20,8,3,0,0,0 2,18,5,1,13,0,0 3,14,3,1,10,0,0 4,7,3,0,5,27,15 5,4,3,0,2,20,14 6,3,1,0,0,10,13 7,2,0,0,0,8,12 8,0,0,0,0,6,11 9,0,0,0,0,3,9 10,0,0,0,0,1,8 here is MWE in question: d3.csv("../data/source/movies.csv", function (error, data) { dataViz(data)}); function dataViz(incData) { expData =

Reposition nodes in a multi-foci d3 force layout

由 ╄→гoц情女王★ 提交于 2019-12-07 08:58:17
问题 I have three sets of nodes in a multi-foci force layout. Each node is already rendered in HTML. The only thing that changes is the data bound to each little person. What I'm trying to do is when an event happens (in this situation a dropdown), the nodes reposition themselves to their new cluster. What I mean by that is, if new data calls for only 10 blues on the left and 90 reds on the right and 2 purples in the middle, the blues on the left will change to red and transition to the right

How do I create a tree layout using JSON data in d3.v4 - without stratify()

由 我只是一个虾纸丫 提交于 2019-12-04 18:16:13
问题 I'm trying to update some d3 code from v3 to version 4. I have a tree diagram using JSON data. The d3.v4 examples show how to convert tabular data (e.g. flare.csv) to hierarchical data using stratify() https://bl.ocks.org/mbostock/9d0899acb5d3b8d839d9d613a9e1fe04. But my data is JSON so I don't want or need stratify(). I get this error: undefined is not a function (evaluating 'root.eachBefore') running this code: var height = 200; var width = 500; var xNudge = 50; var yNudge = 20; var tree =

Uncaught TypeError: xScale.rangeBand is not a function in d3.js

由 梦想的初衷 提交于 2019-12-03 16:21:21
问题 Trying to generate bar chart by following Vegibit's tutorial in my fiddle. The d3.min.js reference works good. However when I try to implement downloaded local copy by using: <script type="text/javascript" src="~/Scripts/d3/d3.min.js"></script> The path is auto generated by Visual Studio's ASP.NET project tool d3BarChart({ element: '#bar-chart', dataSource: [10, 20, 220, 240, 270, 300, 330, 370, 410, 30, 40, 50, 60, 70, 80, 90, 100, 110, 120, 135, 150, 165, 180, 200], }); function d3BarChart

How to use json data instead of tsv file in d3 multi line charts?

由 北城余情 提交于 2019-12-02 07:52:30
问题 jsfiddle link https://jsfiddle.net/8vhsLor6/ Basically I want to replace tsv file data with json object. I am getting error. Type error var cities = data.columns.slice(1).map(function(id) { I have data like this var data = [ {date:"1-May-12","New York":"58.13", "San Francisco":"58.13", "Austin": "43"}, {date:"30-Apr-12","New York":"53.98" , "San Francisco":"48.13", "Austin": "53"}, {date:"27-Apr-12","New York":"67.00", "San Francisco":"38.13", "Austin": "63"}, {date:"26-Apr-12","New York":"89

How to use json data instead of tsv file in d3 multi line charts?

由 大城市里の小女人 提交于 2019-12-02 04:09:32
jsfiddle link https://jsfiddle.net/8vhsLor6/ Basically I want to replace tsv file data with json object. I am getting error. Type error var cities = data.columns.slice(1).map(function(id) { I have data like this var data = [ {date:"1-May-12","New York":"58.13", "San Francisco":"58.13", "Austin": "43"}, {date:"30-Apr-12","New York":"53.98" , "San Francisco":"48.13", "Austin": "53"}, {date:"27-Apr-12","New York":"67.00", "San Francisco":"38.13", "Austin": "63"}, {date:"26-Apr-12","New York":"89.70", "San Francisco":"28.13", "Austin": "73"}, {date:"25-Apr-12","New York":"99.00", "San Francisco":

Recreating collapsible force layout using d3 v4

由 蹲街弑〆低调 提交于 2019-12-01 23:13:34
问题 I've been trying to create a Collapsible force layout using d3js v4, similar to this one: https://mbostock.github.io/d3/talk/20111116/force-collapsible.html I've been able to create the layout itself. But not able to update it. Can anyone help? Here's my js code: var width = 960, height = 600; var root = { "name": "server1900", "children": [{ "name": "server913", "_children": null, "children": [{ "name": "server948" }, { "name": "server946" }] }, { "name": "server912", "_children": null,

Recreating collapsible force layout using d3 v4

由 喜欢而已 提交于 2019-12-01 20:49:23
I've been trying to create a Collapsible force layout using d3js v4, similar to this one: https://mbostock.github.io/d3/talk/20111116/force-collapsible.html I've been able to create the layout itself. But not able to update it. Can anyone help? Here's my js code: var width = 960, height = 600; var root = { "name": "server1900", "children": [{ "name": "server913", "_children": null, "children": [{ "name": "server948" }, { "name": "server946" }] }, { "name": "server912", "_children": null, "children": [{ "name": "server984" }, { "name": "server983" }] }, { "name": "server911", "_children": null,

How can I implement an invert function for a point scale?

由 北战南征 提交于 2019-12-01 18:41:34
I am trying to add a tooltip for my dual line chart graph. However, instead of using timeScale or scaleLinear, I used scalePoint to graph my chart. I am trying to achieve the following effect: https://bl.ocks.org/mbostock/3902569 this.x = d3.scalePoint().range([ this.margin.left, this.width - this.margin.right ]); this.xAxis = d3.axisBottom(this.x); this.x.domain( this.dataArray.map(d => { return this.format(d[ 'year' ]); })); Here is my mouseover function, function mousemove() { //d3.mouse(this)[ 0 ] //x.invert var x0 = d3.mouse(this)[ 0 ], i = bisectDate(data, x0, 1), d0 = data[ i - 1 ], d1
订阅 d3v4