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":[40600,49538,50450,47236,56550,53227,65284,61431,65358,70254,73403,84428]},{"name":"Orders","type":"line","data":[500,492,502,552,581,678,631,740,771,840,766,910],"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,291,351,358,355,389,377,410,397,388,489,442]},{"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":[114,123,133,148,179,191,214,198,201,231,233,266]},{"name":"Active","type":"line","area":true,"data":[859,955,951,1052,1148,1294,1238,1446,1374,1521,1605,1452],"color":"success","axis":0}]}'></div>