score:1

Accepted answer

i'm not sure that it's a great idea to use renderarea in a composite chart; as you can see, the colors get muddied together into brown, and it's not really clear what it's supposed to convey.

i think renderarea works better with a stacked chart, where the area that is covered by each color means something.

that said, it's pretty easy to fix the problem you are seeing.

the reason why raising the dots doesn't work is because each child of the composite chart is in its own layer. so raising the dots only puts them at the top of that chart (where they already are).

instead, you can disable mouse interactions for the filled areas:

  path.area {
    pointer-events: none;
  }

since the filled areas weren't interactive before, this shouldn't lose much, but you might want to be more conservative and restrict the rule to the particular chart with the selector #composite-chart path.area


Related Query

More Query from same tag