Quirk

Elen Adarna

Software Engineer
Address
4975 Cambridge Road Miami Gardens, FL 33056
Contact
  • me@themepixels.com
  • (032) 1234 567
  • +63012 3456 789
General Settings
  • Daily Newsletter
    Get notified when someone else is trying to access your account.
  • Call Phones
    Make calls to friends and family right from your account.
Security Settings
  • Login Notifications
    Get notified when someone else is trying to access your account.
  • Phone Approvals
    Use your phone when login as an extra layer of security.
  1. Home
  2. UI Elements
  3. Graphs & Charts

Flot Charts

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

Simple Chart

Create a placeholder, make sure it has dimensions (so Flot knows at what size to draw the plot), then call the plot function with your data.

Using Other Symbols

For other point types, you can define a callback function to draw the symbol. Some common symbols are available in the symbol plugin.

Tracking With Crosshair

You can add crosshairs that'll track the mouse position, either on both axes or as here on only one.

Real Time Updates

You can update a chart periodically to get a real-time effect by using a timer to insert the new data in the plot and redraw it.

Bar Chart

With the categories plugin you can plot categories/textual data easily.

Pie Chart

Labels can be hidden if the slice is less than a given percentage of the pie.

Morris Charts

Morris chart - good-looking charts shouldn't be difficult.

Line Chart

A line graph is a type of chart which displays information as a series of data points connected by straight line segments.

Area Chart

Area charts are used to represent cumulated totals using numbers or percentages (stacked area charts in this case) over time.

Bar Chart

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

Stacked Chart

The stacked charts are used when data sets have to be broken down into their constituents.

Donut Chart

A donut chart, or doughnut chart, functions precisely like a pie chart. The only difference is that the center is blank.

Donut Chart

A donut chart, or doughnut chart, functions precisely like a pie chart. The only difference is that the center is blank.

Sparkline Charts

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

Total Sales

$630,201

Avg Sales

$106,850

1,5,3,6,8,2
Avg Order

23,001,090

1,5,3,6,8,2
Avg Expenses

$11,090