Category "d3.js"

Is it possible to position the leaf nodes one below the other instead of next to each other?

I use d3-org-chart and I wonder if it's possible to position the bottommost elements below each other instead of on the same level: There are some exposed vari

D3.js ResizeObserver rendering issue. Axis not removed after resizing

Been experimenting with ResizeObserver in D3, the issue is that when the axis re-renders it leaves the old render behind, leaving a 'trace' of the previous axis

D3 selection.join() using classes

I'm trying to use the new D3 selection.join() paradigm to draw a randomly positioned circle within every svg. While I can get this to work using ids in the sel

How to remove weekend datetime gaps from x-axis of a financial chart?

I have a use case where I pull and plot Forex data in the form of ask and bid on the graph and this is based on minute, hour or day candlesticks and I am only p

How to plot x axis values over bars?

I changed the attributes of the X axis to plot its values over the bars of the chart. But anywhere I put the code, the values are always plotted before ("behind

How to select individual bars in d3 bar chart and highlight the selected bar?

I'm trying to select each bar in the bar chart by adding a click event, but in my code, highlighted bars are disappearing when selected. Please refer to my link

How to select individual bars in d3 bar chart and highlight the selected bar?

I'm trying to select each bar in the bar chart by adding a click event, but in my code, highlighted bars are disappearing when selected. Please refer to my link

How to display country names on globe d3.js

I'm currently working with d3.js and basically want to display a globe, which when hovering over the individual countries displays the names in a div. But at th

D3 / JavaScript find nearest element from mouse position

I am trying to show the nearest data point and its text when you hover over path element (in pink color in the example) using D3 / Javascript. JS Fiddle: https:

Draw d3-axis without direct DOM manipulation

Is there a way to use d3-axis without directly manipulating the DOM? D3.js complements Vue.js nicely when used for its helper functions (especially d3-scale).

C3.js: Assigning a chart height independently of the legend height

(sorry for double posting, but the issue on github was not answered after one week: https://github.com/c3js/c3/issues/2254) I'm using C3 JS and I have several

Center a specific node into a scene with 3d-force-graph

I am new in d3. I am using 3d-force-graph and I want to find a specific node and get its position ( x, y, z, vx, vy, vz ). My goal is to center a specific node

Handling click/hover events with d3.js in Analytics Dashboard LWC

I am currently trying to build an Analytics Dashboard LWC using the d3 library. I want to be able to listen for certain events on the SVG element, however no ma

Save High Resolution PNG with included Image in Chart Using d3.js on ObservableHQ.com

When creating a chart with D3.js, I can include an external image using : svg.append("svg:image").attr("x", 100).attr("y", 100).attr( "xlink:href", "https://my-

what is the equivalent group code for nest and group functions in D3 V6

I am absolute new to both JavaScript and D3. I have problem to convert below D3 codes from version 3 to 6 . data: d2.csv: city,type,price,id a,c,10,1 a,c,15,2 a

How can I select :last-child in d3.js?

I need to manipulate the text elements of the first and last tick of an axis to bring them more towards the center. I am trying to select them, one at the time

D3.JS time-series line chart with real-time data, panning and zooming

FIDDLE <<<< this has more up to date code than in the question. I am trying to create a real-time (live-updating) time-series chart in d3, that can

How to label one specific scatter point (not all points) using d3 or regular javascript?

The annotation should read “min y-value: ” where is the minimum y. I wrote the following codes which labels the same smallest y value to all points

How does d3.csv() work without non-arrow functions?

I am trying to understand the interchangeability of arrow functions vs ordinary functions for d3.csv() calls and promises. Using d3.csv(), I can successfully re

Coloring Connected Components D3 V3

I am working in D3 version 3, and I have a simple working program that can read a JSON file and convert it into an animated, linked graph. I was wondering if th