π Public
Gauge
GGerardoFurtado
Last edited Apr 18, 2019
Created on Apr 18, 2019
This example shows a circular gauge with a colored arc, tick labels, and an animated pointer that moves with an elastic ease. The gauge is driven by random data values, with the pointer rotating via a `transition` on its `transform`. Built with D3 v2, it uses `d3.svg.arc` for the ring, a linear scale for value mapping, and `d3.layout.pie` for tick segments. The pointer rotates through a simple rotational transformation rather than redrawing its path.
AI-generated descriptionforked from <a href='http://bl.ocks.org/msqr/'>msqr</a>'s block: <a href='http://bl.ocks.org/msqr/3202712'>d3 gauge</a>
MIT Licensed
![[07] Gauge Chart - Using React Hooks with D3](/viz/e0f2a7a7844e4592afbe7cf0e192b566/social-image.png?v=b81a150607b54b09bf88b25fe7c5c4b3)

![[Test]](/viz/adb8479bc46043c7a48ab2e004ed2cf6/social-image.png?v=9a178ccd373f4b2b99569949c86287cb)
![Fork of [07] Gauge Chart - Using React Hooks with D3](/viz/35aec61a9a51443ea25bb7bd5b2a3785/social-image.png?v=80843a5167864a6594f3a7a68fc5d8ab)




Comments
Sign in to join the discussion.