Pie Chart
{"type":"pie","data":{"labels":["Item 01","Item 02","Item 03","Item 04","Item 05"],"datasets":[{"backgroundColor":["#ffb900","#0148f7","#042367","#fb3535","#ff7c42"],"hoverBackgroundColor":["#ffb900","#0148f7","#042367","#fb3535","#ff7c42"],"data":["14","24","24","14","14"],"borderWidth":0,"borderColor":"rgba(0, 0, 0, 0)"}]},"options":{"animation":{"duration":2000},"maintainAspectRatio":true,"cutoutPercentage":0,"tooltips":{"enabled":true,"bodySpacing":8,"titleSpacing":6,"cornerRadius":8,"xPadding":10,"footerFontSize":15,"footerFontColor":"#222222"},"legend":{"display":false,"position":"right","labels":{"usePointStyle":true,"padding":16,"boxWidth":16,"fontSize":15}}}}
Donut Chart
{"type":"pie","data":{"labels":["Item 01","Item 02","Item 03","Item 04","Item 05"],"datasets":[{"backgroundColor":["#ffb900","#0148f7","#042367","#fb3535","#ff7c42"],"hoverBackgroundColor":["#ffb900","#0148f7","#042367","#fb3535","#ff7c42"],"data":["14","24","24","14","14"],"borderWidth":0,"borderColor":"rgba(0, 0, 0, 0)"}]},"options":{"animation":{"duration":2000},"maintainAspectRatio":true,"cutoutPercentage":50,"tooltips":{"enabled":true,"bodySpacing":8,"titleSpacing":6,"cornerRadius":8,"xPadding":10,"footerFontSize":15,"footerFontColor":"#222222"},"legend":{"display":false,"position":"right","labels":{"usePointStyle":true,"padding":16,"boxWidth":16,"fontSize":15}}}}
Default Style
{"type":"line","data":{"labels":["Jul","Aug","Sep","Oct","Nov","Dec"],"datasets":[{"label":"Item 01","fill":false,"backgroundColor":"rgba(105,59,255,0.55)","borderColor":"rgba(105,59,255,0.55)","borderCapStyle":"butt","borderDash":[],"borderDashOffset":0,"borderJoinStyle":"miter","spanGaps":false,"showLine":true,"steppedLine":false,"pointStyle":"circle","pointBorderWidth":1,"pointHoverRadius":5,"pointHoverBorderWidth":1,"hidden":false,"lineTension":0.33299999999999996,"data":["15","10","22","19","23","17"],"borderWidth":2,"pointRadius":4,"pointHitRadius":3},{"label":"Item 02","fill":false,"backgroundColor":"rgba(0,110,253,0.56)","borderColor":"rgba(0,110,253,0.56)","borderCapStyle":"butt","borderDash":[],"borderDashOffset":0,"borderJoinStyle":"miter","spanGaps":false,"showLine":true,"steppedLine":false,"pointStyle":"circle","pointBorderWidth":1,"pointHoverRadius":5,"pointHoverBorderWidth":1,"hidden":false,"lineTension":0.33299999999999996,"data":["34","38","35","33","37","40"],"borderWidth":2,"pointRadius":4,"pointHitRadius":3}]},"options":{"animation":{"duration":2000},"maintainAspectRatio":true,"tooltips":{"enabled":true,"mode":"index","intersect":false,"bodySpacing":8,"titleSpacing":6,"cornerRadius":8,"xPadding":10},"legend":{"display":true,"position":"bottom","labels":{"usePointStyle":false,"padding":20,"boxWidth":16}},"scales":{"yAxes":[{"ticks":{"fontColor":"222","beginAtZero":true},"gridLines":{"color":"rgba(43, 43, 43, 0.2)","zeroLineColor":"rgba(43, 43, 43, 0.6)"}}]}}}
Line Tension
{"type":"line","data":{"labels":["01","02","03","04","05","06","07","08","09","10","11","12"],"datasets":[{"label":"Item 01","fill":false,"backgroundColor":"#e82219","borderColor":"#e82219","borderCapStyle":"butt","borderDash":[],"borderDashOffset":0,"borderJoinStyle":"miter","spanGaps":false,"showLine":true,"steppedLine":false,"pointStyle":"circle","pointBorderWidth":1,"pointHoverRadius":6,"pointHoverBorderWidth":1,"hidden":false,"lineTension":0,"data":["13","15","14","17","19","17","18","12","20","23","24","27"],"borderWidth":3,"pointRadius":5,"pointHitRadius":3}]},"options":{"animation":{"duration":2000},"maintainAspectRatio":true,"tooltips":{"enabled":true,"mode":"index","intersect":false,"bodySpacing":8,"titleSpacing":6,"cornerRadius":8,"xPadding":10},"legend":{"display":true,"position":"bottom","labels":{"usePointStyle":false,"padding":20,"boxWidth":16}},"scales":{"yAxes":[{"ticks":{"fontColor":"222","beginAtZero":true},"gridLines":{"color":"rgba(43, 43, 43, 0.2)","zeroLineColor":"rgba(43, 43, 43, 0.6)"}}]}}}
Fill Style
{"type":"line","data":{"labels":["Jul","Aug","Sep","Oct","Nov","Dec"],"datasets":[{"label":"Item 01","fill":true,"backgroundColor":"rgba(105,59,255,0.55)","borderColor":"rgba(0, 0, 0, 0)","borderCapStyle":"butt","borderDash":[],"borderDashOffset":0,"borderJoinStyle":"miter","spanGaps":false,"showLine":true,"steppedLine":false,"pointStyle":"circle","pointBorderWidth":1,"pointHoverRadius":1,"pointHoverBorderWidth":0,"hidden":false,"lineTension":0.33299999999999996,"data":["15","10","22","19","23","17"],"borderWidth":0,"pointRadius":1,"pointHitRadius":0},{"label":"Item 02","fill":true,"backgroundColor":"rgba(0,110,253,0.56)","borderColor":"rgba(0, 0, 0, 0)","borderCapStyle":"butt","borderDash":[],"borderDashOffset":0,"borderJoinStyle":"miter","spanGaps":false,"showLine":true,"steppedLine":false,"pointStyle":"circle","pointBorderWidth":1,"pointHoverRadius":1,"pointHoverBorderWidth":0,"hidden":false,"lineTension":0.33299999999999996,"data":["34","38","35","33","37","40"],"borderWidth":0,"pointRadius":1,"pointHitRadius":0}]},"options":{"animation":{"duration":2000},"maintainAspectRatio":true,"tooltips":{"enabled":true,"mode":"index","intersect":false,"bodySpacing":8,"titleSpacing":6,"cornerRadius":8,"xPadding":10},"legend":{"display":true,"position":"bottom","labels":{"usePointStyle":false,"padding":20,"boxWidth":16}},"scales":{"yAxes":[{"ticks":{"fontColor":"222","beginAtZero":true},"gridLines":{"color":"rgba(43, 43, 43, 0.2)","zeroLineColor":"rgba(43, 43, 43, 0.6)"}}]}}}
Fill Style
{"type":"line","data":{"labels":["Jul","Aug","Sep","Oct","Nov","Dec"],"datasets":[{"label":"Item 01","fill":true,"backgroundColor":"rgba(105,59,255,0.55)","borderColor":"#693bff","borderCapStyle":"butt","borderDash":[],"borderDashOffset":0,"borderJoinStyle":"miter","spanGaps":false,"showLine":true,"steppedLine":false,"pointStyle":"circle","pointBorderWidth":1,"pointHoverRadius":5,"pointHoverBorderWidth":1,"hidden":false,"lineTension":0.33299999999999996,"data":["15","10","22","19","23","17"],"borderWidth":1,"pointRadius":3,"pointHitRadius":3},{"label":"Item 02","fill":true,"backgroundColor":"rgba(0,110,253,0.56)","borderColor":"#006efd","borderCapStyle":"butt","borderDash":[],"borderDashOffset":0,"borderJoinStyle":"miter","spanGaps":false,"showLine":true,"steppedLine":false,"pointStyle":"circle","pointBorderWidth":1,"pointHoverRadius":5,"pointHoverBorderWidth":1,"hidden":false,"lineTension":0.33299999999999996,"data":["34","38","35","33","37","40"],"borderWidth":1,"pointRadius":3,"pointHitRadius":3}]},"options":{"animation":{"duration":2000},"maintainAspectRatio":true,"tooltips":{"enabled":true,"mode":"index","intersect":false,"bodySpacing":8,"titleSpacing":6,"cornerRadius":8,"xPadding":10},"legend":{"display":true,"position":"bottom","labels":{"usePointStyle":false,"padding":20,"boxWidth":16}},"scales":{"yAxes":[{"ticks":{"fontColor":"222","beginAtZero":true},"gridLines":{"color":"rgba(43, 43, 43, 0.2)","zeroLineColor":"rgba(43, 43, 43, 0.6)"}}]}}}
Point Style
{"type":"line","data":{"labels":["Jul","Aug","Sep","Oct","Nov","Dec"],"datasets":[{"label":"Item 01","fill":false,"backgroundColor":"rgba(105,59,255,0.55)","borderColor":"#693bff","borderCapStyle":"butt","borderDash":[],"borderDashOffset":0,"borderJoinStyle":"miter","spanGaps":false,"showLine":true,"steppedLine":false,"pointStyle":"circle","pointBorderWidth":1,"pointHoverRadius":5,"pointHoverBorderWidth":1,"hidden":false,"lineTension":0.33299999999999996,"data":["15","10","22","19","23","17"],"borderWidth":2,"pointRadius":4,"pointHitRadius":3},{"label":"Item 02","fill":false,"backgroundColor":"rgba(0,110,253,0.56)","borderColor":"#006efd","borderCapStyle":"butt","borderDash":[],"borderDashOffset":0,"borderJoinStyle":"miter","spanGaps":false,"showLine":true,"steppedLine":false,"pointStyle":"rect","pointBorderWidth":1,"pointHoverRadius":5,"pointHoverBorderWidth":1,"hidden":false,"lineTension":0.33299999999999996,"data":["34","38","35","33","37","40"],"borderWidth":2,"pointRadius":4,"pointHitRadius":3},{"label":"Item 03","fill":false,"backgroundColor":"rgba(0,110,253,0.56)","borderColor":"#e82219","borderCapStyle":"butt","borderDash":[],"borderDashOffset":0,"borderJoinStyle":"miter","spanGaps":false,"showLine":true,"steppedLine":false,"pointStyle":"triangle","pointBorderWidth":1,"pointHoverRadius":5,"pointHoverBorderWidth":1,"hidden":false,"lineTension":0.33299999999999996,"data":["23","27","24","26","25","28"],"borderWidth":2,"pointRadius":4,"pointHitRadius":3},{"label":"Item 04","fill":false,"backgroundColor":"rgba(0,110,253,0.56)","borderColor":"#71aefe","borderCapStyle":"butt","borderDash":[],"borderDashOffset":0,"borderJoinStyle":"miter","spanGaps":false,"showLine":true,"steppedLine":false,"pointStyle":"star","pointBorderWidth":1,"pointHoverRadius":5,"pointHoverBorderWidth":1,"hidden":false,"lineTension":0.33299999999999996,"data":["25","31","24","26","30","22"],"borderWidth":2,"pointRadius":4,"pointHitRadius":3}]},"options":{"animation":{"duration":2000},"maintainAspectRatio":true,"tooltips":{"enabled":true,"mode":"index","intersect":false,"bodySpacing":8,"titleSpacing":6,"cornerRadius":8,"xPadding":10},"legend":{"display":true,"position":"bottom","labels":{"usePointStyle":true,"padding":20,"boxWidth":16}},"scales":{"yAxes":[{"ticks":{"fontColor":"222","beginAtZero":true},"gridLines":{"color":"rgba(43, 43, 43, 0.2)","zeroLineColor":"rgba(43, 43, 43, 0.6)"}}]}}}
Line Style
{"type":"line","data":{"labels":["Jul","Aug","Sep","Oct","Nov","Dec"],"datasets":[{"label":"Item 01","fill":false,"backgroundColor":"rgba(105,59,255,0.55)","borderColor":"#693bff","borderCapStyle":"butt","borderDash":[],"borderDashOffset":0,"borderJoinStyle":"miter","spanGaps":false,"showLine":true,"steppedLine":false,"pointStyle":"circle","pointBorderWidth":1,"pointHoverRadius":5,"pointHoverBorderWidth":1,"hidden":false,"lineTension":0.33299999999999996,"data":["15","10","22","19","23","17"],"borderWidth":2,"pointRadius":4,"pointHitRadius":3},{"label":"Item 02","fill":false,"backgroundColor":"rgba(0,110,253,0.56)","borderColor":"#006efd","borderCapStyle":"butt","borderDash":[16,8],"borderDashOffset":0,"borderJoinStyle":"miter","spanGaps":false,"showLine":true,"steppedLine":false,"pointStyle":"circle","pointBorderWidth":1,"pointHoverRadius":5,"pointHoverBorderWidth":1,"hidden":false,"lineTension":0.33299999999999996,"data":["34","38","35","33","37","40"],"borderWidth":2,"pointRadius":4,"pointHitRadius":3},{"label":"Item 02","fill":false,"backgroundColor":"rgba(0,110,253,0.56)","borderColor":"#006efd","borderCapStyle":"butt","borderDash":[3,3],"borderDashOffset":0,"borderJoinStyle":"miter","spanGaps":false,"showLine":true,"steppedLine":false,"pointStyle":"circle","pointBorderWidth":1,"pointHoverRadius":5,"pointHoverBorderWidth":1,"hidden":false,"lineTension":0.33299999999999996,"data":["23","27","24","26","25","28"],"borderWidth":2,"pointRadius":4,"pointHitRadius":3}]},"options":{"animation":{"duration":2000},"maintainAspectRatio":true,"tooltips":{"enabled":true,"mode":"index","intersect":false,"bodySpacing":8,"titleSpacing":6,"cornerRadius":8,"xPadding":10},"legend":{"display":true,"position":"bottom","labels":{"usePointStyle":false,"padding":20,"boxWidth":16}},"scales":{"yAxes":[{"ticks":{"fontColor":"222","beginAtZero":true},"gridLines":{"color":"rgba(43, 43, 43, 0.2)","zeroLineColor":"rgba(43, 43, 43, 0.6)"}}]}}}
Default Style
{"type":"bar","data":{"labels":["Jul","Aug","Sep","Oct","Nov","Dec"],"datasets":[{"label":"Item 01","backgroundColor":"#693bff","borderColor":"#693bff","data":["15","10","22","19","23","17"],"borderWidth":0},{"label":"Item 02","backgroundColor":"#006efd","borderColor":"#006efd","data":["34","38","35","33","37","40"],"borderWidth":0}]},"options":{"animation":{"duration":2000},"maintainAspectRatio":true,"tooltips":{"enabled":true,"mode":"index","intersect":false,"bodySpacing":8,"titleSpacing":6,"cornerRadius":8,"xPadding":10},"legend":{"display":true,"position":"bottom","labels":{"usePointStyle":false,"padding":20,"boxWidth":16}},"scales":{"yAxes":[{"ticks":{"fontColor":"222","beginAtZero":true},"gridLines":{"color":"rgba(43, 43, 43, 0.2)","zeroLineColor":"rgba(43, 43, 43, 0.6)"}}]}}}
With Border
{"type":"bar","data":{"labels":["Jul","Aug","Sep","Oct","Nov","Dec"],"datasets":[{"label":"Item 01","backgroundColor":"rgba(105,59,255,0.8)","borderColor":"#693bff","data":["15","10","22","19","23","17"],"borderWidth":"2"},{"label":"Item 02","backgroundColor":"rgba(0,110,253,0.8)","borderColor":"#006efd","data":["34","38","35","33","37","40"],"borderWidth":"2"}]},"options":{"animation":{"duration":2000},"maintainAspectRatio":true,"tooltips":{"enabled":true,"mode":"index","intersect":false,"bodySpacing":8,"titleSpacing":6,"cornerRadius":8,"xPadding":10},"legend":{"display":true,"position":"bottom","labels":{"usePointStyle":false,"padding":20,"boxWidth":16}},"scales":{"yAxes":[{"ticks":{"fontColor":"222","beginAtZero":true},"gridLines":{"color":"rgba(43, 43, 43, 0.2)","zeroLineColor":"rgba(43, 43, 43, 0.6)"}}]}}}
Horizontal Style
{"type":"horizontalBar","data":{"labels":["Jul","Aug","Sep","Oct","Nov","Dec"],"datasets":[{"label":"Item 01","backgroundColor":"#693bff","borderColor":"#693bff","data":["15","10","22","19","23","17"],"borderWidth":"0"},{"label":"Item 02","backgroundColor":"#006efd","borderColor":"#006efd","data":["34","38","35","33","37","40"],"borderWidth":"0"}]},"options":{"animation":{"duration":2000},"maintainAspectRatio":true,"tooltips":{"enabled":true,"mode":"index","intersect":false,"bodySpacing":8,"titleSpacing":6,"cornerRadius":8,"xPadding":10},"legend":{"display":true,"position":"bottom","labels":{"usePointStyle":false,"padding":20,"boxWidth":16}},"scales":{"yAxes":[{"ticks":{"fontColor":"222","beginAtZero":true},"gridLines":{"color":"rgba(43, 43, 43, 0.2)","zeroLineColor":"rgba(43, 43, 43, 0.6)"}}]}}}
Horizontal Style
{"type":"horizontalBar","data":{"labels":["Jul","Aug","Sep","Oct","Nov","Dec"],"datasets":[{"label":"Item 01","backgroundColor":"rgba(105,59,255,0.8)","borderColor":"#693bff","data":["15","10","22","19","23","17"],"borderWidth":"2"},{"label":"Item 02","backgroundColor":"rgba(0,110,253,0.8)","borderColor":"#006efd","data":["34","38","35","33","37","40"],"borderWidth":"2"}]},"options":{"animation":{"duration":2000},"maintainAspectRatio":true,"tooltips":{"enabled":true,"mode":"index","intersect":false,"bodySpacing":8,"titleSpacing":6,"cornerRadius":8,"xPadding":10},"legend":{"display":true,"position":"bottom","labels":{"usePointStyle":false,"padding":20,"boxWidth":16}},"scales":{"yAxes":[{"ticks":{"fontColor":"222","beginAtZero":true},"gridLines":{"color":"rgba(43, 43, 43, 0.2)","zeroLineColor":"rgba(43, 43, 43, 0.6)"}}]}}}