dark-green.js 6.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261
  1. /**
  2. * (c) 2010-2019 Torstein Honsi
  3. *
  4. * License: www.highcharts.com/license
  5. *
  6. * Dark blue theme for Highcharts JS
  7. * @author Torstein Honsi
  8. */
  9. 'use strict';
  10. import Highcharts from '../parts/Globals.js';
  11. Highcharts.theme = {
  12. colors: ['#DDDF0D', '#55BF3B', '#DF5353', '#7798BF', '#aaeeee',
  13. '#ff0066', '#eeaaee', '#55BF3B', '#DF5353', '#7798BF', '#aaeeee'],
  14. chart: {
  15. backgroundColor: {
  16. linearGradient: [0, 0, 250, 500],
  17. stops: [
  18. [0, 'rgb(48, 96, 48)'],
  19. [1, 'rgb(0, 0, 0)']
  20. ]
  21. },
  22. borderColor: '#000000',
  23. borderWidth: 2,
  24. className: 'dark-container',
  25. plotBackgroundColor: 'rgba(255, 255, 255, .1)',
  26. plotBorderColor: '#CCCCCC',
  27. plotBorderWidth: 1
  28. },
  29. title: {
  30. style: {
  31. color: '#C0C0C0',
  32. font: 'bold 16px "Trebuchet MS", Verdana, sans-serif'
  33. }
  34. },
  35. subtitle: {
  36. style: {
  37. color: '#666666',
  38. font: 'bold 12px "Trebuchet MS", Verdana, sans-serif'
  39. }
  40. },
  41. xAxis: {
  42. gridLineColor: '#333333',
  43. gridLineWidth: 1,
  44. labels: {
  45. style: {
  46. color: '#A0A0A0'
  47. }
  48. },
  49. lineColor: '#A0A0A0',
  50. tickColor: '#A0A0A0',
  51. title: {
  52. style: {
  53. color: '#CCC',
  54. fontWeight: 'bold',
  55. fontSize: '12px',
  56. fontFamily: 'Trebuchet MS, Verdana, sans-serif'
  57. }
  58. }
  59. },
  60. yAxis: {
  61. gridLineColor: '#333333',
  62. labels: {
  63. style: {
  64. color: '#A0A0A0'
  65. }
  66. },
  67. lineColor: '#A0A0A0',
  68. minorTickInterval: null,
  69. tickColor: '#A0A0A0',
  70. tickWidth: 1,
  71. title: {
  72. style: {
  73. color: '#CCC',
  74. fontWeight: 'bold',
  75. fontSize: '12px',
  76. fontFamily: 'Trebuchet MS, Verdana, sans-serif'
  77. }
  78. }
  79. },
  80. tooltip: {
  81. backgroundColor: 'rgba(0, 0, 0, 0.75)',
  82. style: {
  83. color: '#F0F0F0'
  84. }
  85. },
  86. toolbar: {
  87. itemStyle: {
  88. color: 'silver'
  89. }
  90. },
  91. plotOptions: {
  92. line: {
  93. dataLabels: {
  94. color: '#CCC'
  95. },
  96. marker: {
  97. lineColor: '#333'
  98. }
  99. },
  100. spline: {
  101. marker: {
  102. lineColor: '#333'
  103. }
  104. },
  105. scatter: {
  106. marker: {
  107. lineColor: '#333'
  108. }
  109. },
  110. candlestick: {
  111. lineColor: 'white'
  112. }
  113. },
  114. legend: {
  115. itemStyle: {
  116. font: '9pt Trebuchet MS, Verdana, sans-serif',
  117. color: '#A0A0A0'
  118. },
  119. itemHoverStyle: {
  120. color: '#FFF'
  121. },
  122. itemHiddenStyle: {
  123. color: '#444'
  124. }
  125. },
  126. credits: {
  127. style: {
  128. color: '#666'
  129. }
  130. },
  131. labels: {
  132. style: {
  133. color: '#CCC'
  134. }
  135. },
  136. navigation: {
  137. buttonOptions: {
  138. symbolStroke: '#DDDDDD',
  139. hoverSymbolStroke: '#FFFFFF',
  140. theme: {
  141. fill: {
  142. linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
  143. stops: [
  144. [0.4, '#606060'],
  145. [0.6, '#333333']
  146. ]
  147. },
  148. stroke: '#000000'
  149. }
  150. }
  151. },
  152. // scroll charts
  153. rangeSelector: {
  154. buttonTheme: {
  155. fill: {
  156. linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
  157. stops: [
  158. [0.4, '#888'],
  159. [0.6, '#555']
  160. ]
  161. },
  162. stroke: '#000000',
  163. style: {
  164. color: '#CCC',
  165. fontWeight: 'bold'
  166. },
  167. states: {
  168. hover: {
  169. fill: {
  170. linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
  171. stops: [
  172. [0.4, '#BBB'],
  173. [0.6, '#888']
  174. ]
  175. },
  176. stroke: '#000000',
  177. style: {
  178. color: 'white'
  179. }
  180. },
  181. select: {
  182. fill: {
  183. linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
  184. stops: [
  185. [0.1, '#000'],
  186. [0.3, '#333']
  187. ]
  188. },
  189. stroke: '#000000',
  190. style: {
  191. color: 'yellow'
  192. }
  193. }
  194. }
  195. },
  196. inputStyle: {
  197. backgroundColor: '#333',
  198. color: 'silver'
  199. },
  200. labelStyle: {
  201. color: 'silver'
  202. }
  203. },
  204. navigator: {
  205. handles: {
  206. backgroundColor: '#666',
  207. borderColor: '#AAA'
  208. },
  209. outlineColor: '#CCC',
  210. maskFill: 'rgba(16, 16, 16, 0.5)',
  211. series: {
  212. color: '#7798BF',
  213. lineColor: '#A6C7ED'
  214. }
  215. },
  216. scrollbar: {
  217. barBackgroundColor: {
  218. linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
  219. stops: [
  220. [0.4, '#888'],
  221. [0.6, '#555']
  222. ]
  223. },
  224. barBorderColor: '#CCC',
  225. buttonArrowColor: '#CCC',
  226. buttonBackgroundColor: {
  227. linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
  228. stops: [
  229. [0.4, '#888'],
  230. [0.6, '#555']
  231. ]
  232. },
  233. buttonBorderColor: '#CCC',
  234. rifleColor: '#FFF',
  235. trackBackgroundColor: {
  236. linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
  237. stops: [
  238. [0, '#000'],
  239. [1, '#333']
  240. ]
  241. },
  242. trackBorderColor: '#666'
  243. },
  244. // special colors for some of the
  245. legendBackgroundColor: 'rgba(0, 0, 0, 0.5)',
  246. background2: 'rgb(35, 35, 70)',
  247. dataLabelsColor: '#444',
  248. textColor: '#C0C0C0',
  249. maskColor: 'rgba(255,255,255,0.3)'
  250. };
  251. // Apply the theme
  252. Highcharts.setOptions(Highcharts.theme);