How to customize recharts-active-dot?

[15077693d]

I can set display none on .recharts-active-dot nut i cannot set the color or background color.

[ckifer]

Hi - recharts uses SVGs meaning styling is done via svg properties rather than CSS properties - use stroke and fill rather than color and backgroundColor

      <Line
        type="monotone"
        dataKey="pv"
        stroke="#8884d8"
        activeDot={{ r: 8, fill: "#111", stroke: "blue" }}
      />

[ckifer]

If you want to use css classes then

activeDot={{ r: 8, className: "active-dot" }}

.active-dot {
  stroke: red;
  fill: blue;
}