WebGL Support for Big Data #3492
-
|
Can we use webgl with D3.js? Look at this performance test, https://ahoak.github.io/renderer-benchmark/ And this demo https://sanddance.js.org/app/ |
Beta Was this translation helpful? Give feedback.
Replies: 2 comments 8 replies
-
|
You could use D3 to do the data transformations, and use WebGL to do the rendering, for sure. |
Beta Was this translation helpful? Give feedback.
-
|
Thank you, do you know any example? |
Beta Was this translation helpful? Give feedback.
-
|
https://peterbeshai.com/blog/2017-05-26-beautifully-animate-points-with-webgl-and-regl/ |
Beta Was this translation helpful? Give feedback.
-
|
Cool article, thanks. BTW, examples of D3's are much better on bl.ocks.org then Observablehq. https://sanddance.js.org/app/ |
Beta Was this translation helpful? Give feedback.
-
|
see also https://blog.scottlogic.com/2020/05/01/rendering-one-million-points-with-d3.html |
Beta Was this translation helpful? Give feedback.
-
|
have you successfully implemented them in your code? |
Beta Was this translation helpful? Give feedback.
-
|
A little bit off topic but isn't the canvas supposed to be faster than svg?, cuz on my computer, the benchmark says otherwise |
Beta Was this translation helpful? Give feedback.
-
|
Canvas is generally faster than SVG for rending many primitives. What benchmark are you using? |
Beta Was this translation helpful? Give feedback.
-
|
I used the link above |
Beta Was this translation helpful? Give feedback.
-
|
This doesn't seem to be a fair comparison between svg and canvas. The animation is a simple transition, which in svg is likely implemented with native transition (i.e. no JS runs to render the frames), while for canvas each frame needs processing in JS - though I have to say, the difference is a bit surprising, pixi seems to be doing rather poor job with canvas animation. |
Beta Was this translation helpful? Give feedback.
You could use D3 to do the data transformations, and use WebGL to do the rendering, for sure.