Line Chart

An example of a simple line chart with one series.

HTML Code

<span id="sparkline1">1,4,4,7,5,9,10,1,4,4,7,5,9,10</span>

Javascript Code

$('#sparkline1').sparkline('html', {  width: '100%',  height: 70,  lineColor: '#0083CD',  fillColor: false});

Area Chart

An example of a simple line chart with one series.

Option Code

lineColor: '#0083CD',fillColor: 'rgba(0,131,205,0.2)'

Bar Chart

An example of a simple bar chart with one series.

Source Code

$('#sparkline5').sparkline('html', {  type: 'bar',  barWidth: 10,  height: 70,  barColor: '#0083CD',  chartRangeMax: 12});

Stacked Bar Chart

An example of a stacked bar chart with two series.

Source Code

$('#sparkline7').sparkline('html', {  type: 'bar',  barWidth: 10,  height: 70,  barColor: '#0083CD',  chartRangeMax: 12});$('#sparkline7').sparkline([4,5,6,7,4,5,8,7,6,6,4,7,6,4,7], {  composite: true,  type: 'bar',  barWidth: 10,  height: 70,  barColor: '#11546F',  chartRangeMax: 12});

Pie Chart

An example of a pie chart with two series.

Source Code

$('#sparkline9').sparkline('html', {  type: 'pie',  height: 70,  sliceColors: ['#F4C62B', '#F6931E', '#8CC63E']});