https://github.com/fizzygalacticus/gchart
https://github.com/fizzygalacticus/gchart
Last synced: 25 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/fizzygalacticus/gchart
- Owner: FizzyGalacticus
- License: apache-2.0
- Created: 2016-10-06T20:33:18.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2016-12-08T18:49:28.000Z (over 9 years ago)
- Last Synced: 2026-03-06T10:11:22.295Z (4 months ago)
- Language: JavaScript
- Size: 928 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.txt
Awesome Lists containing this project
README
### GChart
This library was written in order to make creating charts using Google Charts more intuitive and to add additional functionality that doesn't currently exist.
For instance, if the data in a chart changes, or the window resizes, I wanted my chart to re-draw with the new data/dimensions. I also wanted to be able to add links to the row titles.
Instead of trying to wrap your head around adding data to a Google Chart, this library makes it much easier with functions like addColumn and addRow, which both take objects with meaningful keys.
For example, here is a basic chart:
```javascript
GChart.onLoad(function() {
var myChart = new GChart('myChart', 'BarChart');
myChart.addColumn({type:'string', title:'Year'});
myChart.addColumn({type:'number', title:'Sales'});
myChart.addColumn({type:'number', title:'Profits'});
myChart.addColumn({type:'number', title:'Losses'});
myChart.addRow({
title:'2010',
values:[600, 700, 300],
titleUrl:'https://www.google.com/search?q=kittens&oq=kittens&aqs=chrome..69i57j0l5.1655j0j7&sourceid=chrome&ie=UTF-8'
});
myChart.addOptions({
animation: {
'duration': 750,
'startup': true,
'easing': 'out'
}
});
myChart.draw();
setTimeout(function() {
myChart.addRow({
title:'2015',
values:[1350, 962, 1034],
titleUrl:'https://www.youtube.com/watch?v=4LZo9ugJTWQ'
});
}, 2000);
});
```
The above code will look something like this:
To use this library, simply include the gchart.min.js script located in the ``dist`` folder of this repo. Everything that I've added uses Vanilla JS, so you shouldn't run into any issues with other libraries (unless Google uses non-vanilla code in the core charts library).