combo.js 2.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. /*=========================================================================================
  2. File Name: combo.js
  3. Description: google combo bar chart
  4. ----------------------------------------------------------------------------------------
  5. Item Name: Robust - Responsive Admin Theme
  6. Version: 1.2
  7. Author: PIXINVENT
  8. Author URL: http://www.themeforest.net/user/pixinvent
  9. ==========================================================================================*/
  10. // Combo chart
  11. // ------------------------------
  12. // Load the Visualization API and the corechart package.
  13. google.load('visualization', '1.0', {'packages':['corechart']});
  14. // Set a callback to run when the Google Visualization API is loaded.
  15. google.setOnLoadCallback(drawCombo);
  16. // Callback that creates and populates a data table, instantiates the pie chart, passes in the data and draws it.
  17. function drawCombo() {
  18. // Create the data table.
  19. var data = google.visualization.arrayToDataTable([
  20. ['Month', 'Bolivia', 'Ecuador', 'Madagascar', 'Papua New Guinea', 'Rwanda', 'Average'],
  21. ['2004/05', 165, 938, 522, 998, 450, 614.6],
  22. ['2005/06', 135, 1120, 599, 1268, 288, 682],
  23. ['2006/07', 157, 1167, 587, 807, 397, 623],
  24. ['2007/08', 139, 1110, 615, 968, 215, 609.4],
  25. ['2008/09', 136, 691, 629, 1026, 366, 569.6]
  26. ]);
  27. // Set chart options
  28. var options_bar = {
  29. title : 'Monthly Coffee Production by Country',
  30. seriesType: 'bars',
  31. series: {5: {type: 'line'}},
  32. colors: ['#99B898','#FECEA8', '#FF847C', '#E84A5F', '#474747'],
  33. height: 450,
  34. fontSize: 12,
  35. chartArea: {
  36. left: '5%',
  37. width: '90%',
  38. height: 350
  39. },
  40. vAxis: {
  41. title: 'Cups',
  42. gridlines:{
  43. color: '#e9e9e9',
  44. count: 5
  45. },
  46. minValue: 0
  47. },
  48. hAxis: {
  49. title: 'Month',
  50. gridlines:{
  51. color: '#e9e9e9',
  52. count: 5
  53. },
  54. minValue: 0
  55. },
  56. legend: {
  57. position: 'top',
  58. alignment: 'center',
  59. textStyle: {
  60. fontSize: 12
  61. }
  62. }
  63. };
  64. // Instantiate and draw our chart, passing in some options.
  65. var bar = new google.visualization.ComboChart(document.getElementById('combo-chart'));
  66. bar.draw(data, options_bar);
  67. }
  68. // Resize chart
  69. // ------------------------------
  70. $(function () {
  71. // Resize chart on menu width change and window resize
  72. $(window).on('resize', resize);
  73. $(".menu-toggle").on('click', resize);
  74. // Resize function
  75. function resize() {
  76. drawCombo();
  77. }
  78. });