[bracket plus]
Navigation
Information Summary

Memory Usage

##### 32.3%

8,6,5,9,8,4,9,3,5,9

CPU Usage

##### 140.05

4,3,5,7,12,10,4,5,11,7

Disk Usage

##### 82.02%

1,2,1,3,2,10,4,12,7

Daily Traffic

##### 62,201

3,12,7,9,2,3,4,5,2
Online Contacts

Marilyn Tarter

Clemson, CA
1 new

Belinda Connor

Fort Kent, ME

Britanny Cevallos

Shiboygan Falls, WI
3 new

Brandon Lawrence

Snohomish, WA
1 new

Andrew Wiggins

Springfield, MA

Theodore Gristen

Nashville, TN

Deborah Miner

North Shore, CA
Offline Contacts

Marilyn Tarter

Clemson, CA

Belinda Connor

Fort Kent, ME

Britanny Cevallos

Shiboygan Falls, WI

Brandon Lawrence

Snohomish, WA

Andrew Wiggins

Springfield, MA

Theodore Gristen

Nashville, TN

Deborah Miner

North Shore, CA
Recent Attachments

IMG_43445

JPG Image

1.2mb

VID_6543

MP4 Video

24.8mb

Tax_Form

Word Document

5.5mb

Getting_Started

PDF Document

12.7mb

Introduction

PDF Document

7.7mb

IMG_43420

JPG Image

2.2mb

IMG_43447

JPG Image

3.2mb

VID_6545

AVI Video

14.8mb

Secret_Document

Word Document

4.5mb

Time & Date

##

######

Events Calendar
Event Today
+ Add Event
Quick Settings

###### More Settings

Account Settings Privacy Settings

#### Chartist

Highly customizable responsive charts.

###### Simple Line Chart

An example of a simple line chart with three series.

Source Code

    var line2 = new Chartist.Line('#chartLine2', {
      labels: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri'],
      series: [
        [12, 9, 7, 8, 5],
        [2, 1, 5, 7, 3],
        [1, 3, 4, 5, 6]
      ]
    },{
      high: 30,
      axisY: {
        onlyInteger: true
      },
      fullWidth: true,
      chartPadding: {
        bottom: 0,
        left: 0
      }
    });

###### Line Area Chart

This chart uses the showArea option to draw line, dots but also an area shape. Use the low option to specify a fixed lower bound that will make the area expand. You can also use the areaBase property to specify a data value that will be used to determine the area shape base position (this is 0 by default).

Source Code

    showArea: true

###### Bar Chart

A bi-polar bar chart with a range limit set with low and high. There is also an interpolation function used to skip every odd grid line / label.

Source Code

    new Chartist.Bar('#bar', data, option);

###### Horizontal Bar Chart

Guess what! Creating horizontal bar charts is as simple as it can get. There's no new chart type you need to learn, just passing an additional option is enough.

Source Code

    horizontalBars: true

###### Stacked Bar Chart

You can also set your bar chart to stack the series bars on top of each other easily by using the stackBars property in your configuration.

Source Code

    stackedBars: true

###### Pie Chart

A very simple pie chart with label interpolation to show percentage instead of the actual data series value.

Source Code

    var sum = function(a, b) { return a + b };
    var data = {
      series: [5, 3, 4]
    };

    var pie1 = new Chartist.Pie('#chartPie1', data, {
      labelInterpolationFnc: function(value) {
        return Math.round(value / data.series.reduce(sum) * 100) + '%';
      }
    });

###### Donut Chart

This pie chart uses donut, startAngle and total to draw a gauge chart.

Source Code

    new Chartist.Pie('#chartDonut', {
      series: [20, 10, 30]
    }, {
      donut: true,
      donutWidth: 60,
      donutSolid: true,
      startAngle: 270,
      showLabel: true
    });