I am using D3, Javascript, HTML and the function d3.scaleTime() What is wrong with the way I input Dates with the scaleTime() function in d3? I am currently trying to make an x-axis with d3, based on time using d3.scaleTime(). However whenever i input the timeData to scaleTime.domain() no data shows on my axi…
Tag: d3.js
React + D3: Data over Y AXIS in scatter plot not appear correctly
I’m newbie with D3 and I trying to create a Scatterplot graphic. When I try to create the points in the graphics this don’t appear correctly. I’ve got 9 points to put in the scatterplot but only appears 5. And all of these are not located correctly in their positions. For example, we’v…
How do I space out and wrap SVG text elements by individual word with d3.js?
I have the following array of words and colors: Using d3.js, I want to: (1) space these words evenly along an x-axis; and (2) wrap the words accordingly to a given width (move words to the next line). I started a jsfiddle here, but the words for now all share x and y coordinates. I’d like it to appear a…
d3 line generator returning null rather than path data string
I’m using d3 v4 to create a line graph. My pathGenerator, using d3’s line() method, is returning null instead of a path data string (eg “M 100 100 L 300 100 L 200 300 z”), and therefore no lines are being drawn. When I add in console.log()s to try to determine where the issue occurs, t…
Create a scale for bands with different width in D3.js
We have projects, which are assigned to different teams. Now I have to create project timelines. For the purposes of this question I have created a dummy in jsfiddle.net. https://jsfiddle.net/cezar77/6u1waqso/2 The “dummy” data look like this: The time is displayed on the x axis and there is a hor…
d3 run animations inside function in order
I am trying to run animations in order. Here is an example. So i want to create a function like this so i can run them in the order rect1(), rect2(), highlightRect() one after another (after each animation ends). I have tried something like this but it gets messy when there are more animations. Might be an ig…
How to load data from a CSV file in D3 v5
I’m trying to load data from a CSV file in D3; I have this code: If I use D3 v4 it works fine, but if I switch to v5 it doesn’t work anymore. Can someone explain to me how to modify the code to make it work with D3 v5? Answer d3 v5 uses the fetch API and returns a
make d3 force static layout more quickly
I am new in d3js. I rendered a graph ~10000 nodes. I used web worker and static force render ( because normal render is costing more than twice than the web worker). When the range was 10000, it will cost almost 20 seconds, you can see it at console, so how to reduce this times? jsfiddle Answer You are lookin…
Do I add eventListener to every SVG element if I follow normal D3 way?
The normal way of handling onclick in d3 is If I do it this way on 1000 svg elements, does it mean I just attached 1000 different listeners. If this is the case, is there event delegation for d3 specifically? Answer @AlexW answer is (partially) correct: there is no event delegation in D3, only event binding. …
Get red color of schemeCategory10
I’m tying to get the red color (or any color) of the schemeCategory10. I tried this: But I always get the same color (orange) when I change the number into the function colors. How can I get red instead of orange ? How does it work? Answer In an ordinal scale, if you don’t set the domain explicitl…