Flot charts

Examples

Attractive JavaScript plotting for jQuery. Flot is a pure JavaScript plotting library for jQuery, with a focus on simple usage, attractive looks and interactive features.

Interactive linechart
Realtime chart

Rickshaw charts

Examples

Rickshaw is a JavaScript toolkit for creating interactive time series graphs.

Interactive Real-Time Data (Dig into continuously updating data)
Multiple Renderers (Bars, lines, area, and scatterplot graphs all in one setting)

Knob charts

Examples

Knob charts are a downward compatible, touchable, jQuery dial. Material Admin has added serveral classes for easy styling with theme colors.

Thin knob chart
Thin knob chart with alternative colors
Interactive knob chart
Gauge style knob chart

Sparkline charts

Examples

This jQuery plugin generates sparklines (small inline charts) directly in the browser using data supplied either inline in the HTML, or via javascript.

Lorem ipsum dolor 1,1,2, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna 4,6,7,7,4,3,2,1,4,4. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate 1,4,4,7,5,9,10 cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa 1,4,4,7,5,9,10 qui officia deserunt mollit anim id est laborum.

Curabitur 4,27,34,52,54,59,61,68,78,82,85,87,91,93,100 tincidunt lacus. Nulla gravida orci a odio. Nullam varius, turpis et commodo pharetra, est eros bibendum elit, nec luctus magna felis sollicitudin mauris. Integer in mauris eu nibh euismod gravida. Duis 10,12,12,9,7 ac tellus et risus vulputate vehicula. Donec lobortis risus a elit. 1,1,0,1,-1,-1,1,-1,0,0,1,1 Etiam tempor.

Sparkline work perfectly in large parts of text

With Sparklines you can also create larger charts as you can see below.

Large sparkline
Large sparkline

Morris charts

Area chart

Create an area chart using Morris.Area(options). Area charts take all the same options as line charts, and the following extras: behaveLikeLine

Area chart

Bar charts

Create bar charts using Morris.Bar(options).

Grouped bar chart

Stacked bar charts

Create a stacked bar chart by using stacked:true

Stacked bar chart

Donut chart

This really couldn't be easier. Create a Donut chart using Morris.Donut(options)

Donut chart

Morris Line chart

The public API is terribly simple. It's just one function: Morris.Line(options), where options is an object containing some of the following configuration options.

Chat with Ann Laurens
  • Yes, it is indeed very beautiful. 10:03 pm
  • Did you see the changes? 10:02 pm
  • I just arrived at work, it was quite busy. 06:44pm
    I will take look in a minute. 06:45pm
  • The colors are much better now.
    The colors are brighter than before. I have already sent an example. This will make it look sharper. Mon
  • Are the colors of the logo already adapted? Last week