-
Notifications
You must be signed in to change notification settings - Fork 53
Open
Description
Hey there,
first of all thank you for this handy little module!
I'm currently using Bar and Pie Chart. In order to display the respective values I utilized the Legend-Component.
<BarChart //
axes
axisLabels={{ y: 'Amount' }}
yTickNumber={5}
height={200}
width={300}
data={statusData}
/>
<Legend //
data={statusData}
dataId={'y'}
config={statusData.map(d => ({ color: d.color }))}
horizontal
/>
<PieChart //
labels
size={170}
styles={{
'.pie-chart-label': {
fontSize: '1em',
fill: '#ffffff'
}
}}
data={haData}
/>
<Legend //
data={haData}
dataId={'value'}
config={haData.map(d => ({ color: d.color }))}
horizontal
/>
The Problem is the following code snippet from node_modules\react-easy-chart\modules\legend\index.js
createLegend() {
const {
dataId,
data,
tags,
horizontal
} = this.props;
...
data.forEach((item) => {
const index = tags.findIndex((tag) => tag === item[dataId]);
if (index < 0) tags.push(item[dataId]);
});
return (
<ul className="legend">
{tags.map((item, index) => {
...
So.. if there are identical values in the item array, they won't be displayed.
In my case it's the value 0.
This results in:

I was just wondering why this is so restrictive.
Regards
Tim.
Metadata
Metadata
Assignees
Labels
No labels