react-vis icon indicating copy to clipboard operation
react-vis copied to clipboard

How to apply stroke only on the top of AreaSeries

Open ankitjangir01 opened this issue 2 years ago • 1 comments

If I enable stroke on AreaSeries, it applies on all sides i.e. just like a regular border in CSS. I want to keep it on the top part only. I didn't find any API reference or prop for that, can you let me know how to achieve that?

ankitjangir01 avatar Sep 29 '23 03:09 ankitjangir01

How i did it is by just adding a LineSeries with the same data so they overlay ontop of each other. Something like below

<LineSeries
    data={comparisonLineSeriesData}
    yBaseValue={0}
    curve="curveBasis"
    color={palette.divider}
/>

<AreaSeries
    data={comparisonLineSeriesData}
    yBaseValue={0}
    curve="curveBasis"
    color={alpha(palette.divider, 0.05)}
/>

Joecey avatar Apr 17 '25 13:04 Joecey