Skip to content

maximzhurkin/jquery-simple-bar-graph

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

jQuery Simple Bar Graph

Very simple plugin for generating bar charts based on key/value data

Examples

Getting Started

Include styles & scripts

<head>
    <link href="jquery.simple-bar-graph.min.css" rel="stylesheet">
    <script src="jquery.min.js"></script>
    <script src="jquery.simple-bar-graph.min.js"></script>
</head>

Add HTML

<div id="graph"></div>

Call plugin

$(document).ready(function() {
    $('#graph').simpleBarGraph({
        data: [
            { key: 'Monday', value: 120 },
            { key: 'Tuesday', value: 96 },
            { key: 'Wednesday', value: 46 },
            { key: 'Thursday', value: 58 },
            { key: 'Friday', value: 64 },
            { key: 'Saturday', value: 108 },
            { key: 'Sunday', value: 91 }
        ]
    });
});

Custom settings

$('#graph').simpleBarGraph({
    data: [],
    rowsCount: 5,
    height: '200px',
    rowCaptionsWidth: '16px',
    barsColor: '#C496CF',
    popups: true,
    delayAnimation: 15 //ms
});

About

Very simple plugin for generating bar charts based on key/value data

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published