Reputation: 1
I'm trying to display three series on the same scale using ApexCharts, but I'm having trouble finding a solution. Here is the code I'm using:
options = {
...
yaxis: [
{
seriesName: "produtividade",
min: 0,
tickAmount: 5,
title: {
text: "Produtividade",
style: {
color: "#CCCCCC",
fontSize: "14px",
fontWeight: 500,
},
},
labels: {
formatter: (value: number) => {
return value;
},
style: {
colors: "#CCCCCC",
fontWeight: "bold",
},
},
forceNiceScale: true,
},
{
seriesName: "target produtividade",
show: false,
},
**{
seriesName: "media horas diretas",
opposite: true,
title: {
text: "Horas diretas",
style: {
color: "#CCCCCC",
fontSize: "14px",
fontWeight: 500,
},
},
tickAmount: 5
xaxis: {
labels: {
format: "mm:ss",
},
},
labels: {
formatter: function (value: string) {
if (!value) {
return undefined;
}
return convertTommss(value);
},
style: {
colors: "#CCCCCC",
fontWeight: "bold",
},
},
forceNiceScale: true,
},
{
seriesName: "target horas diretas",
show: false,
opposite: true,
labels: {
formatter: function (value: string) {
if (!value) {
return undefined;
}
return convertTommss(value);
},
},
},
{
seriesName: "media horas diretas estimadas",
show: false,
opposite: true,
labels: {
formatter: function (value: string) {
if (!value) {
return undefined;
}
return convertTommss(value);
},
},
},**
]
...
},
series: [
...
]
I aim to display the series that are opposite each other on the same scale, but the second series isn't aligning with the scale of the first series.
Here is how the first series, which correctly aligns with the scale, looks: series showing in correct scale
The following series are not aligning correctly with the scale series showing in incorrect scale
I've already tried adding the axisName to each series object, but it didn't work, also removing all properties and just left the show in false, but the same result
Upvotes: 0
Views: 82