Open orthonym opened 5 years ago
When creating the following area chart
note, use of hide-line has no bearing on the issue, used only to reduce svg output in this example
hide-line
<la-cartesian :data="values"> <la-area hide-line prop="pv"/> </la-cartesian>
Where values is an array of objects:
values
data: () => ({ values: [ { name: 'Page A', pv: 2000 }, { name: 'Page B', pv: 3000 }, { name: 'Page C', pv: 1200 } ] })
The SVG produced contains duplicate Path elements. Specifically, duplicate elements === values.length.
Path
=== values.length
<svg width="600" height="300" viewBox="0 0 600 300"> <g> <defs> <linearGradient id="la-area-2-0"> <stop stop-color="#3fb1e3" stop-opacity="0.5"></stop> </linearGradient> </defs> <g> <path d="M8,165.77..." fill="url(#la-area-2-0)" style="..."></path> <!-- duplicate path elements === values.length --> <path d="M8,165.77..." fill="url(#la-area-2-0)" style="..."></path> <path d="M8,165.77..." fill="url(#la-area-2-0)" style="..."></path> <path d="M8,165.77..." fill="url(#la-area-2-0)" style="..."></path> </g> </g> </svg>
Full sample here https://jsfiddle.net/3dhs87co/
path
opacity
A single path element generated for values.
When creating the following area chart
Where
values
is an array of objects:The SVG produced contains duplicate
Path
elements. Specifically, duplicate elements=== values.length
.Full sample here https://jsfiddle.net/3dhs87co/
path
elements have anopacity
applied to them. Since thepath
elements overlap, the path elements are effectively opaque.Expected Behavior
A single path element generated for
values
.