Starlight Responsive Bootstrap 4 Admin Template

Rickshaw Charts

A powerful, interactive charting and visualization library for browser.

Bar Chart

A bar chart or bar graph is a chart with rectangular bars with lengths proportional to the values that they represent.

Bar Chart

A bar chart or bar graph is a chart with rectangular bars with lengths proportional to the values that they represent.

Source Code

var bar1 = new Rickshaw.Graph({
  element: document.querySelector('#chartBar1'),
  renderer: 'bar',
  max: 80,
  series: [{
  data: [
    { x: 0, y: 40 },
    { x: 1, y: 49 },
    { x: 2, y: 38 },
    { x: 3, y: 30 },
    { x: 4, y: 32 }
  ],
  color: '#26A2E2'
  }]
});
bar1.render();

Stacked Bar Chart

A stacked bar chart, also known as a stacked bar graph, is a graph that is used to break down and compare parts of a whole.

Stacked Bar Chart

A stacked bar chart, also known as a stacked bar graph, is a graph that is used to break down and compare parts of a whole.

Source Code

series: [{
  data: [
    { x: 0, y: 20 },
    { x: 1, y: 30 },
    { x: 2, y: 10 },
    { x: 3, y: 15 },
    { x: 4, y: 10 }
  ],
  color: '#466C79'
  },
  {
  data: [
    { x: 0, y: 10 },
    { x: 1, y: 10 },
    { x: 2, y: 15 },
    { x: 3, y: 20 },
    { x: 4, y: 12 }
  ],
  color: '#26A2E2'
}

Multiple Bar Chart

A bar chart or bar graph is a chart with rectangular bars with lengths proportional to the values that they represent.

Multiple Bar Chart

A bar chart or bar graph is a chart with rectangular bars with lengths proportional to the values that they represent.

Additional Option Code

stack: false

Line Chart

A line chart or line graph is a type of chart which displays information as a series of data points called markers.

Line Chart

A line chart or line graph is a type of chart which displays information as a series of data points called markers.

Option Code

rendered: 'line'

Area Chart

An area chart or area graph displays graphically quantitative data. It is based on the line chart.

Area Chart

An area chart or area graph displays graphically quantitative data. It is based on the line chart.

Option Code

renderer: 'area'