export default function ClockExample()

in packages/showcase/sunbursts/clock-example.js [33:71]


export default function ClockExample() {
  const [time, setTime] = useState(getSeconds());
  useEffect(() => {
    const handle = setInterval(() => setTime(getSeconds()), 100);
    return () => clearInterval(handle);
  }, []);
  const seconds = time % 60;
  const minutes = (time / 60) % 60;
  const hours = (time / (60 * 24)) % 24;
  return (
    <XYPlot
      xDomain={[-3, 3]}
      yDomain={[-3, 3]}
      width={300}
      getAngle={d => d.time}
      getAngle0={() => 0}
      height={300}
    >
      <ArcSeries
        animation={{
          damping: 9,
          stiffness: 300
        }}
        radiusDomain={[0, 3]}
        data={[
          {time: (seconds / 60) * 2 * PI, radius0: 1, radius: 1.5, color: 0},
          {
            time: (minutes / 60) * 2 * PI,
            radius0: 1.6,
            radius: 2.1,
            color: 1
          },
          {time: (hours / 24) * 2 * PI, radius0: 2.2, radius: 2.7, color: 2}
        ]}
        colorRange={EXTENDED_DISCRETE_COLOR_RANGE}
      />
    </XYPlot>
  );
}