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.
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.
The Problem is the following code snippet from node_modules\react-easy-chart\modules\legend\index.js
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.