I need to show a Line Chart with multiple line data in it. One of the line in Line Chart should not be stacked and remaining lines should be stacked.
I could able to achieve it if I set y1 axis(another axis at right side) and point un-stacked line item to it but my requirement is yo have only one X-axis and Y-axis and should point inline all lines to it.
The wrong chart is
when data ponited to Y-Axis it is showing correcly like below
Question here is, how would i show all values only with Y-Axis?
sample code:
{
"backgroundColor": "transparent",
"width": "500",
"format": "svg",
"version": "2",
"chart": "{type:'line',options:{responsive:true,elements:{point:{radius:0}},legend:{display:true,position:'bottom',align:'center',labels:{fontSize:8}},title:{display:true,text:'Chart1',},tooltips:{mode:'index',},hover:{mode:'index',},scales:{xAxes:[{scaleLabel:{display:false,labelString:'',},ticks:{minRotation:90},},],yAxes:[{id:'y',stacked:true,scaleLabel:{display:false,labelString:'',},ticks:{minRotation:90},},{id:'y1',stacked:false,scaleLabel:{display:false,labelString:'',},ticks:{minRotation:90},},]}},data:{labels: ['data 1','data 2','data 3','data 4'], datasets: [{data: [ 10,3,7,4],label:'index1',fill: false,yAxisID:'y1'},{data:[4,5,3,10],label:'index2'},{data:[6,6,5,10],label:'index3'}]}}",
"devicePixelRatio": "1.0",
"height": "300"
}
I would strongly believe that problem is with stacked attribute. If we could add stacked attribute for line item level instead of entire Chart level then it would solve the problem.
Thanks for your time and response in advance and any help in finding root cause is highly appreciate.