DarkBlue.js 6.2 KB

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