skies.js 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
  1. /**
  2. * Skies theme for Highcharts JS
  3. * @author Torstein Hønsi
  4. */
  5. Highcharts.theme = {
  6. colors: ["#514F78", "#42A07B", "#9B5E4A", "#72727F", "#1F949A", "#82914E", "#86777F", "#42A07B"],
  7. chart: {
  8. className: 'skies',
  9. borderWidth: 0,
  10. plotShadow: true,
  11. plotBackgroundImage: 'http://www.highcharts.com/demo/gfx/skies.jpg',
  12. plotBackgroundColor: {
  13. linearGradient: [0, 0, 250, 500],
  14. stops: [
  15. [0, 'rgba(255, 255, 255, 1)'],
  16. [1, 'rgba(255, 255, 255, 0)']
  17. ]
  18. },
  19. plotBorderWidth: 1
  20. },
  21. title: {
  22. style: {
  23. color: '#3E576F',
  24. font: '16px Lucida Grande, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif'
  25. }
  26. },
  27. subtitle: {
  28. style: {
  29. color: '#6D869F',
  30. font: '12px Lucida Grande, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif'
  31. }
  32. },
  33. xAxis: {
  34. gridLineWidth: 0,
  35. lineColor: '#C0D0E0',
  36. tickColor: '#C0D0E0',
  37. labels: {
  38. style: {
  39. color: '#666',
  40. fontWeight: 'bold'
  41. }
  42. },
  43. title: {
  44. style: {
  45. color: '#666',
  46. font: '12px Lucida Grande, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif'
  47. }
  48. }
  49. },
  50. yAxis: {
  51. alternateGridColor: 'rgba(255, 255, 255, .5)',
  52. lineColor: '#C0D0E0',
  53. tickColor: '#C0D0E0',
  54. tickWidth: 1,
  55. labels: {
  56. style: {
  57. color: '#666',
  58. fontWeight: 'bold'
  59. }
  60. },
  61. title: {
  62. style: {
  63. color: '#666',
  64. font: '12px Lucida Grande, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif'
  65. }
  66. }
  67. },
  68. legend: {
  69. itemStyle: {
  70. font: '9pt Trebuchet MS, Verdana, sans-serif',
  71. color: '#3E576F'
  72. },
  73. itemHoverStyle: {
  74. color: 'black'
  75. },
  76. itemHiddenStyle: {
  77. color: 'silver'
  78. }
  79. },
  80. labels: {
  81. style: {
  82. color: '#3E576F'
  83. }
  84. }
  85. };
  86. // Apply the theme
  87. var highchartsOptions = Highcharts.setOptions(Highcharts.theme);