Skip to content

Connected Scatter Plot

ts
Frame({}, [
    For(drivingShifts, (d) =>
      Ellipse({
        x: v(d.miles),
        y: v(d.gas),
        w: 6,
        h: 6,
        fill: "white",
        stroke: "black",
        strokeWidth: 2,
      }).name(`${d.year}`)
    ),
    ConnectX(
      {
        interpolation: "linear",
        stroke: "black",
        strokeWidth: 2,
        mode: "center-to-center",
      },
      For(drivingShifts, (d) => Ref(`${d.year}`))
    ),
    For(drivingShifts, (d) =>
      Ellipse({
        x: v(d.miles),
        y: v(d.gas),
        w: 6,
        h: 6,
        fill: "white",
        stroke: "black",
        strokeWidth: 2,
      })
    ),
  ]).render(root, { w: 500, h: 300 });