Mixed
Bars and lines on one chart
Revenue and orders
Two scales
Code
<div class="chart" role="img" aria-label="Revenue and orders" style="--chart-h: 320px" data-chart='{"type":"mixed","labels":["Nov","Dec","Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct"],"dualAxis":true,"legend":true,"format":"money","axis2Format":"compact","series":[{"name":"Revenue","type":"bar","data":[40146,41247,49829,51829,55859,60115,65629,60544,66811,75226,69791,72055]},{"name":"Orders","type":"line","data":[429,464,553,590,591,589,717,683,729,707,884,880],"axis":1,"color":"info"}]}'></div>Against target
Code
<div class="chart" role="img" aria-label="Against target" style="--chart-h: 300px" data-chart='{"type":"mixed","labels":["Nov","Dec","Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct"],"legend":true,"series":[{"name":"Sales","type":"bar","data":[271,305,300,363,335,410,350,379,417,416,435,441]},{"name":"Target","type":"line","data":[320,332,344,356,368,380,392,404,416,428,440,452],"color":"warning","dashed":true}]}'></div>With an area
Code
<div class="chart" role="img" aria-label="With an area" style="--chart-h: 300px" data-chart='{"type":"mixed","labels":["Nov","Dec","Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct"],"legend":true,"series":[{"name":"Sign-ups","type":"bar","data":[129,124,147,168,181,167,190,218,222,215,256,244]},{"name":"Active","type":"line","area":true,"data":[893,889,1049,1199,1114,1203,1315,1441,1545,1455,1680,1592],"color":"success","axis":0}]}'></div>