exporting.src.js 69 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977
  1. /* *
  2. *
  3. * Exporting module
  4. *
  5. * (c) 2010-2019 Torstein Honsi
  6. *
  7. * License: www.highcharts.com/license
  8. *
  9. * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
  10. *
  11. * */
  12. 'use strict';
  13. import H from '../parts/Globals.js';
  14. /**
  15. * Gets fired after a chart is printed through the context menu item or the
  16. * Chart.print method.
  17. *
  18. * @callback Highcharts.ExportingAfterPrintCallbackFunction
  19. *
  20. * @param {Highcharts.Chart} chart
  21. * The chart on which the event occured.
  22. *
  23. * @param {global.Event} event
  24. * The event that occured.
  25. */
  26. /**
  27. * Gets fired before a chart is printed through the context menu item or the
  28. * Chart.print method.
  29. *
  30. * @callback Highcharts.ExportingBeforePrintCallbackFunction
  31. *
  32. * @param {Highcharts.Chart} chart
  33. * The chart on which the event occured.
  34. *
  35. * @param {global.Event} event
  36. * The event that occured.
  37. */
  38. /**
  39. * Function to call if the offline-exporting module fails to export a chart on
  40. * the client side.
  41. *
  42. * @callback Highcharts.ExportingErrorCallbackFunction
  43. *
  44. * @param {Highcharts.ExportingOptions} options
  45. * The exporting options.
  46. *
  47. * @param {global.Error} err
  48. * The error from the module.
  49. */
  50. /**
  51. * Definition for a menu item in the context menu.
  52. *
  53. * @interface Highcharts.ExportingMenuObject
  54. */ /**
  55. * The text for the menu item.
  56. *
  57. * @name Highcharts.ExportingMenuObject#text
  58. * @type {string|undefined}
  59. */ /**
  60. * If internationalization is required, the key to a language string.
  61. *
  62. * @name Highcharts.ExportingMenuObject#textKey
  63. * @type {string|undefined}
  64. */ /**
  65. * The click handler for the menu item.
  66. *
  67. * @name Highcharts.ExportingMenuObject#onclick
  68. * @type {Highcharts.EventCallbackFunction<Highcharts.Chart>|undefined}
  69. */ /**
  70. * Indicates a separator line instead of an item.
  71. *
  72. * @name Highcharts.ExportingMenuObject#separator
  73. * @type {boolean|undefined}
  74. */
  75. /**
  76. * Possible MIME types for exporting.
  77. *
  78. * @typedef {"image/png"|"image/jpeg"|"application/pdf"|"image/svg+xml"} Highcharts.ExportingMimeTypeValue
  79. */
  80. import U from '../parts/Utilities.js';
  81. var discardElement = U.discardElement, extend = U.extend, isObject = U.isObject, objectEach = U.objectEach, pick = U.pick;
  82. import '../parts/Options.js';
  83. import '../parts/Chart.js';
  84. import chartNavigationMixin from '../mixins/navigation.js';
  85. // create shortcuts
  86. var defaultOptions = H.defaultOptions, doc = H.doc, Chart = H.Chart, addEvent = H.addEvent, removeEvent = H.removeEvent, fireEvent = H.fireEvent, createElement = H.createElement, css = H.css, merge = H.merge, isTouchDevice = H.isTouchDevice, win = H.win, userAgent = win.navigator.userAgent, SVGRenderer = H.SVGRenderer, symbols = H.Renderer.prototype.symbols, isMSBrowser = /Edge\/|Trident\/|MSIE /.test(userAgent), isFirefoxBrowser = /firefox/i.test(userAgent);
  87. // Add language
  88. extend(defaultOptions.lang
  89. /**
  90. * @optionparent lang
  91. */
  92. , {
  93. /**
  94. * Exporting module only. View the chart in full screen.
  95. *
  96. * @since 7.1.0
  97. * @requires modules/exporting
  98. *
  99. * @private
  100. */
  101. viewFullscreen: 'View in full screen',
  102. /**
  103. * Exporting module only. The text for the menu item to print the chart.
  104. *
  105. * @since 3.0.1
  106. * @requires modules/exporting
  107. *
  108. * @private
  109. */
  110. printChart: 'Print chart',
  111. /**
  112. * Exporting module only. The text for the PNG download menu item.
  113. *
  114. * @since 2.0
  115. * @requires modules/exporting
  116. *
  117. * @private
  118. */
  119. downloadPNG: 'Download PNG image',
  120. /**
  121. * Exporting module only. The text for the JPEG download menu item.
  122. *
  123. * @since 2.0
  124. * @requires modules/exporting
  125. *
  126. * @private
  127. */
  128. downloadJPEG: 'Download JPEG image',
  129. /**
  130. * Exporting module only. The text for the PDF download menu item.
  131. *
  132. * @since 2.0
  133. * @requires modules/exporting
  134. *
  135. * @private
  136. */
  137. downloadPDF: 'Download PDF document',
  138. /**
  139. * Exporting module only. The text for the SVG download menu item.
  140. *
  141. * @since 2.0
  142. * @requires modules/exporting
  143. *
  144. * @private
  145. */
  146. downloadSVG: 'Download SVG vector image',
  147. /**
  148. * Exporting module menu. The tooltip title for the context menu holding
  149. * print and export menu items.
  150. *
  151. * @since 3.0
  152. * @requires modules/exporting
  153. *
  154. * @private
  155. */
  156. contextButtonTitle: 'Chart context menu'
  157. });
  158. if (!defaultOptions.navigation) {
  159. // Buttons and menus are collected in a separate config option set called
  160. // 'navigation'. This can be extended later to add control buttons like
  161. // zoom and pan right click menus.
  162. /**
  163. * A collection of options for buttons and menus appearing in the exporting
  164. * module.
  165. *
  166. * @requires modules/exporting
  167. * @optionparent navigation
  168. */
  169. defaultOptions.navigation = {};
  170. }
  171. merge(true, defaultOptions.navigation, {
  172. /**
  173. * @optionparent navigation.buttonOptions
  174. *
  175. * @private
  176. */
  177. buttonOptions: {
  178. theme: {},
  179. /**
  180. * Whether to enable buttons.
  181. *
  182. * @sample highcharts/navigation/buttonoptions-enabled/
  183. * Exporting module loaded but buttons disabled
  184. *
  185. * @type {boolean}
  186. * @default true
  187. * @since 2.0
  188. * @apioption navigation.buttonOptions.enabled
  189. */
  190. /**
  191. * The pixel size of the symbol on the button.
  192. *
  193. * @sample highcharts/navigation/buttonoptions-height/
  194. * Bigger buttons
  195. *
  196. * @since 2.0
  197. */
  198. symbolSize: 14,
  199. /**
  200. * The x position of the center of the symbol inside the button.
  201. *
  202. * @sample highcharts/navigation/buttonoptions-height/
  203. * Bigger buttons
  204. *
  205. * @since 2.0
  206. */
  207. symbolX: 12.5,
  208. /**
  209. * The y position of the center of the symbol inside the button.
  210. *
  211. * @sample highcharts/navigation/buttonoptions-height/
  212. * Bigger buttons
  213. *
  214. * @since 2.0
  215. */
  216. symbolY: 10.5,
  217. /**
  218. * Alignment for the buttons.
  219. *
  220. * @sample highcharts/navigation/buttonoptions-align/
  221. * Center aligned
  222. *
  223. * @type {Highcharts.AlignValue}
  224. * @since 2.0
  225. */
  226. align: 'right',
  227. /**
  228. * The pixel spacing between buttons.
  229. *
  230. * @since 2.0
  231. */
  232. buttonSpacing: 3,
  233. /**
  234. * Pixel height of the buttons.
  235. *
  236. * @sample highcharts/navigation/buttonoptions-height/
  237. * Bigger buttons
  238. *
  239. * @since 2.0
  240. */
  241. height: 22,
  242. /**
  243. * A text string to add to the individual button.
  244. *
  245. * @sample highcharts/exporting/buttons-text/
  246. * Full text button
  247. * @sample highcharts/exporting/buttons-text-symbol/
  248. * Combined symbol and text
  249. *
  250. * @type {string}
  251. * @default null
  252. * @since 3.0
  253. * @apioption navigation.buttonOptions.text
  254. */
  255. /**
  256. * The vertical offset of the button's position relative to its
  257. * `verticalAlign`.
  258. *
  259. * @sample highcharts/navigation/buttonoptions-verticalalign/
  260. * Buttons at lower right
  261. *
  262. * @type {number}
  263. * @default 0
  264. * @since 2.0
  265. * @apioption navigation.buttonOptions.y
  266. */
  267. /**
  268. * The vertical alignment of the buttons. Can be one of `"top"`,
  269. * `"middle"` or `"bottom"`.
  270. *
  271. * @sample highcharts/navigation/buttonoptions-verticalalign/
  272. * Buttons at lower right
  273. *
  274. * @type {Highcharts.VerticalAlignValue}
  275. * @since 2.0
  276. */
  277. verticalAlign: 'top',
  278. /**
  279. * The pixel width of the button.
  280. *
  281. * @sample highcharts/navigation/buttonoptions-height/
  282. * Bigger buttons
  283. *
  284. * @since 2.0
  285. */
  286. width: 24
  287. }
  288. });
  289. // Presentational attributes
  290. merge(true, defaultOptions.navigation
  291. /**
  292. * A collection of options for buttons and menus appearing in the exporting
  293. * module.
  294. *
  295. * @optionparent navigation
  296. */
  297. , {
  298. /**
  299. * CSS styles for the popup menu appearing by default when the export
  300. * icon is clicked. This menu is rendered in HTML.
  301. *
  302. * @see In styled mode, the menu is styled with the `.highcharts-menu`
  303. * class.
  304. *
  305. * @sample highcharts/navigation/menustyle/
  306. * Light gray menu background
  307. *
  308. * @type {Highcharts.CSSObject}
  309. * @default {"border": "1px solid #999999", "background": "#ffffff", "padding": "5px 0"}
  310. * @since 2.0
  311. *
  312. * @private
  313. */
  314. menuStyle: {
  315. /** @ignore-option */
  316. border: '1px solid #999999',
  317. /** @ignore-option */
  318. background: '#ffffff',
  319. /** @ignore-option */
  320. padding: '5px 0'
  321. },
  322. /**
  323. * CSS styles for the individual items within the popup menu appearing
  324. * by default when the export icon is clicked. The menu items are
  325. * rendered in HTML. Font size defaults to `11px` on desktop and `14px`
  326. * on touch devices.
  327. *
  328. * @see In styled mode, the menu items are styled with the
  329. * `.highcharts-menu-item` class.
  330. *
  331. * @sample {highcharts} highcharts/navigation/menuitemstyle/
  332. * Add a grey stripe to the left
  333. *
  334. * @type {Highcharts.CSSObject}
  335. * @default {"padding": "0.5em 1em", "color": "#333333", "background": "none", "fontSize": "11px/14px", "transition": "background 250ms, color 250ms"}
  336. * @since 2.0
  337. *
  338. * @private
  339. */
  340. menuItemStyle: {
  341. /** @ignore-option */
  342. padding: '0.5em 1em',
  343. /** @ignore-option */
  344. color: '#333333',
  345. /** @ignore-option */
  346. background: 'none',
  347. /** @ignore-option */
  348. fontSize: isTouchDevice ? '14px' : '11px',
  349. /** @ignore-option */
  350. transition: 'background 250ms, color 250ms'
  351. },
  352. /**
  353. * CSS styles for the hover state of the individual items within the
  354. * popup menu appearing by default when the export icon is clicked. The
  355. * menu items are rendered in HTML.
  356. *
  357. * @see In styled mode, the menu items are styled with the
  358. * `.highcharts-menu-item` class.
  359. *
  360. * @sample highcharts/navigation/menuitemhoverstyle/
  361. * Bold text on hover
  362. *
  363. * @type {Highcharts.CSSObject}
  364. * @default {"background": "#335cad", "color": "#ffffff"}
  365. * @since 2.0
  366. *
  367. * @private
  368. */
  369. menuItemHoverStyle: {
  370. /** @ignore-option */
  371. background: '#335cad',
  372. /** @ignore-option */
  373. color: '#ffffff'
  374. },
  375. /**
  376. * A collection of options for buttons appearing in the exporting
  377. * module.
  378. *
  379. * In styled mode, the buttons are styled with the
  380. * `.highcharts-contextbutton` and `.highcharts-button-symbol` classes.
  381. *
  382. * @requires modules/exporting
  383. *
  384. * @private
  385. */
  386. buttonOptions: {
  387. /**
  388. * Fill color for the symbol within the button.
  389. *
  390. * @sample highcharts/navigation/buttonoptions-symbolfill/
  391. * Blue symbol stroke for one of the buttons
  392. *
  393. * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
  394. * @since 2.0
  395. */
  396. symbolFill: '#666666',
  397. /**
  398. * The color of the symbol's stroke or line.
  399. *
  400. * @sample highcharts/navigation/buttonoptions-symbolstroke/
  401. * Blue symbol stroke
  402. *
  403. * @type {Highcharts.ColorString}
  404. * @since 2.0
  405. */
  406. symbolStroke: '#666666',
  407. /**
  408. * The pixel stroke width of the symbol on the button.
  409. *
  410. * @sample highcharts/navigation/buttonoptions-height/
  411. * Bigger buttons
  412. *
  413. * @since 2.0
  414. */
  415. symbolStrokeWidth: 3,
  416. /**
  417. * A configuration object for the button theme. The object accepts
  418. * SVG properties like `stroke-width`, `stroke` and `fill`.
  419. * Tri-state button styles are supported by the `states.hover` and
  420. * `states.select` objects.
  421. *
  422. * @sample highcharts/navigation/buttonoptions-theme/
  423. * Theming the buttons
  424. *
  425. * @requires modules/exporting
  426. *
  427. * @since 3.0
  428. */
  429. theme: {
  430. /**
  431. * The default fill exists only to capture hover events.
  432. *
  433. * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
  434. * @default #ffffff
  435. * @apioption navigation.buttonOptions.theme.fill
  436. */
  437. /**
  438. * Default stroke for the buttons.
  439. * @type {Highcharts.ColorString}
  440. * @default none
  441. * @apioption navigation.buttonOptions.theme.stroke
  442. */
  443. /**
  444. * Padding for the button.
  445. */
  446. padding: 5
  447. }
  448. }
  449. });
  450. // Add the export related options
  451. /**
  452. * Options for the exporting module. For an overview on the matter, see
  453. * [the docs](https://www.highcharts.com/docs/export-module/export-module-overview).
  454. *
  455. * @requires modules/exporting
  456. * @optionparent exporting
  457. */
  458. defaultOptions.exporting = {
  459. /**
  460. * Experimental setting to allow HTML inside the chart (added through
  461. * the `useHTML` options), directly in the exported image. This allows
  462. * you to preserve complicated HTML structures like tables or bi-directional
  463. * text in exported charts.
  464. *
  465. * Disclaimer: The HTML is rendered in a `foreignObject` tag in the
  466. * generated SVG. The official export server is based on PhantomJS,
  467. * which supports this, but other SVG clients, like Batik, does not
  468. * support it. This also applies to downloaded SVG that you want to
  469. * open in a desktop client.
  470. *
  471. * @type {boolean}
  472. * @default false
  473. * @since 4.1.8
  474. * @apioption exporting.allowHTML
  475. */
  476. /**
  477. * Additional chart options to be merged into the chart before exporting to
  478. * an image format. This does not apply to printing the chart via the export
  479. * menu.
  480. *
  481. * For example, a common use case is to add data labels to improve
  482. * readability of the exported chart, or to add a printer-friendly color
  483. * scheme to exported PDFs.
  484. *
  485. * @sample {highcharts} highcharts/exporting/chartoptions-data-labels/
  486. * Added data labels
  487. * @sample {highstock} highcharts/exporting/chartoptions-data-labels/
  488. * Added data labels
  489. *
  490. * @type {Highcharts.Options}
  491. * @apioption exporting.chartOptions
  492. */
  493. /**
  494. * Whether to enable the exporting module. Disabling the module will
  495. * hide the context button, but API methods will still be available.
  496. *
  497. * @sample {highcharts} highcharts/exporting/enabled-false/
  498. * Exporting module is loaded but disabled
  499. * @sample {highstock} highcharts/exporting/enabled-false/
  500. * Exporting module is loaded but disabled
  501. *
  502. * @type {boolean}
  503. * @default true
  504. * @since 2.0
  505. * @apioption exporting.enabled
  506. */
  507. /**
  508. * Function to call if the offline-exporting module fails to export
  509. * a chart on the client side, and [fallbackToExportServer](
  510. * #exporting.fallbackToExportServer) is disabled. If left undefined, an
  511. * exception is thrown instead. Receives two parameters, the exporting
  512. * options, and the error from the module.
  513. *
  514. * @see [fallbackToExportServer](#exporting.fallbackToExportServer)
  515. *
  516. * @type {Highcharts.ExportingErrorCallbackFunction}
  517. * @since 5.0.0
  518. * @requires modules/exporting
  519. * @requires modules/offline-exporting
  520. * @apioption exporting.error
  521. */
  522. /**
  523. * Whether or not to fall back to the export server if the offline-exporting
  524. * module is unable to export the chart on the client side. This happens for
  525. * certain browsers, and certain features (e.g.
  526. * [allowHTML](#exporting.allowHTML)), depending on the image type exporting
  527. * to. For very complex charts, it is possible that export can fail in
  528. * browsers that don't support Blob objects, due to data URL length limits.
  529. * It is recommended to define the [exporting.error](#exporting.error)
  530. * handler if disabling fallback, in order to notify users in case export
  531. * fails.
  532. *
  533. * @type {boolean}
  534. * @default true
  535. * @since 4.1.8
  536. * @requires modules/exporting
  537. * @requires modules/offline-exporting
  538. * @apioption exporting.fallbackToExportServer
  539. */
  540. /**
  541. * The filename, without extension, to use for the exported chart.
  542. *
  543. * @sample {highcharts} highcharts/exporting/filename/
  544. * Custom file name
  545. * @sample {highstock} highcharts/exporting/filename/
  546. * Custom file name
  547. *
  548. * @type {string}
  549. * @default chart
  550. * @since 2.0
  551. * @apioption exporting.filename
  552. */
  553. /**
  554. * An object containing additional key value data for the POST form that
  555. * sends the SVG to the export server. For example, a `target` can be set to
  556. * make sure the generated image is received in another frame, or a custom
  557. * `enctype` or `encoding` can be set.
  558. *
  559. * @type {Highcharts.HTMLAttributes}
  560. * @since 3.0.8
  561. * @apioption exporting.formAttributes
  562. */
  563. /**
  564. * Path where Highcharts will look for export module dependencies to
  565. * load on demand if they don't already exist on `window`. Should currently
  566. * point to location of [CanVG](https://github.com/canvg/canvg) library,
  567. * [RGBColor.js](https://github.com/canvg/canvg),
  568. * [jsPDF](https://github.com/yWorks/jsPDF) and
  569. * [svg2pdf.js](https://github.com/yWorks/svg2pdf.js), required for client
  570. * side export in certain browsers.
  571. *
  572. * @type {string}
  573. * @default https://code.highcharts.com/{version}/lib
  574. * @since 5.0.0
  575. * @apioption exporting.libURL
  576. */
  577. /**
  578. * Analogous to [sourceWidth](#exporting.sourceWidth).
  579. *
  580. * @type {number}
  581. * @since 3.0
  582. * @apioption exporting.sourceHeight
  583. */
  584. /**
  585. * The width of the original chart when exported, unless an explicit
  586. * [chart.width](#chart.width) is set, or a pixel width is set on the
  587. * container. The width exported raster image is then multiplied by
  588. * [scale](#exporting.scale).
  589. *
  590. * @sample {highcharts} highcharts/exporting/sourcewidth/
  591. * Source size demo
  592. * @sample {highstock} highcharts/exporting/sourcewidth/
  593. * Source size demo
  594. * @sample {highmaps} maps/exporting/sourcewidth/
  595. * Source size demo
  596. *
  597. * @type {number}
  598. * @since 3.0
  599. * @apioption exporting.sourceWidth
  600. */
  601. /**
  602. * The pixel width of charts exported to PNG or JPG. As of Highcharts
  603. * 3.0, the default pixel width is a function of the [chart.width](
  604. * #chart.width) or [exporting.sourceWidth](#exporting.sourceWidth) and the
  605. * [exporting.scale](#exporting.scale).
  606. *
  607. * @sample {highcharts} highcharts/exporting/width/
  608. * Export to 200px wide images
  609. * @sample {highstock} highcharts/exporting/width/
  610. * Export to 200px wide images
  611. *
  612. * @type {number}
  613. * @since 2.0
  614. * @apioption exporting.width
  615. */
  616. /**
  617. * Default MIME type for exporting if `chart.exportChart()` is called
  618. * without specifying a `type` option. Possible values are `image/png`,
  619. * `image/jpeg`, `application/pdf` and `image/svg+xml`.
  620. *
  621. * @type {Highcharts.ExportingMimeTypeValue}
  622. * @since 2.0
  623. */
  624. type: 'image/png',
  625. /**
  626. * The URL for the server module converting the SVG string to an image
  627. * format. By default this points to Highchart's free web service.
  628. *
  629. * @since 2.0
  630. */
  631. url: 'https://export.highcharts.com/',
  632. /**
  633. * When printing the chart from the menu item in the burger menu, if
  634. * the on-screen chart exceeds this width, it is resized. After printing
  635. * or cancelled, it is restored. The default width makes the chart
  636. * fit into typical paper format. Note that this does not affect the
  637. * chart when printing the web page as a whole.
  638. *
  639. * @since 4.2.5
  640. */
  641. printMaxWidth: 780,
  642. /**
  643. * Defines the scale or zoom factor for the exported image compared
  644. * to the on-screen display. While for instance a 600px wide chart
  645. * may look good on a website, it will look bad in print. The default
  646. * scale of 2 makes this chart export to a 1200px PNG or JPG.
  647. *
  648. * @see [chart.width](#chart.width)
  649. * @see [exporting.sourceWidth](#exporting.sourceWidth)
  650. *
  651. * @sample {highcharts} highcharts/exporting/scale/
  652. * Scale demonstrated
  653. * @sample {highstock} highcharts/exporting/scale/
  654. * Scale demonstrated
  655. * @sample {highmaps} maps/exporting/scale/
  656. * Scale demonstrated
  657. *
  658. * @since 3.0
  659. */
  660. scale: 2,
  661. /**
  662. * Options for the export related buttons, print and export. In addition
  663. * to the default buttons listed here, custom buttons can be added.
  664. * See [navigation.buttonOptions](#navigation.buttonOptions) for general
  665. * options.
  666. *
  667. * @type {Highcharts.Dictionary<*>}
  668. * @requires modules/exporting
  669. */
  670. buttons: {
  671. /**
  672. * Options for the export button.
  673. *
  674. * In styled mode, export button styles can be applied with the
  675. * `.highcharts-contextbutton` class.
  676. *
  677. * @declare Highcharts.ExportingButtonsOptionsObject
  678. * @extends navigation.buttonOptions
  679. * @requires modules/exporting
  680. */
  681. contextButton: {
  682. /**
  683. * A click handler callback to use on the button directly instead of
  684. * the popup menu.
  685. *
  686. * @sample highcharts/exporting/buttons-contextbutton-onclick/
  687. * Skip the menu and export the chart directly
  688. *
  689. * @type {Function}
  690. * @since 2.0
  691. * @apioption exporting.buttons.contextButton.onclick
  692. */
  693. /**
  694. * See [navigation.buttonOptions.symbolFill](
  695. * #navigation.buttonOptions.symbolFill).
  696. *
  697. * @type {Highcharts.ColorString}
  698. * @default #666666
  699. * @since 2.0
  700. * @apioption exporting.buttons.contextButton.symbolFill
  701. */
  702. /**
  703. * The horizontal position of the button relative to the `align`
  704. * option.
  705. *
  706. * @type {number}
  707. * @default -10
  708. * @since 2.0
  709. * @apioption exporting.buttons.contextButton.x
  710. */
  711. /**
  712. * The class name of the context button.
  713. */
  714. className: 'highcharts-contextbutton',
  715. /**
  716. * The class name of the menu appearing from the button.
  717. */
  718. menuClassName: 'highcharts-contextmenu',
  719. /**
  720. * The symbol for the button. Points to a definition function in
  721. * the `Highcharts.Renderer.symbols` collection. The default
  722. * `exportIcon` function is part of the exporting module. Possible
  723. * values are "circle", "square", "diamond", "triangle",
  724. * "triangle-down", "menu", "menuball" or custom shape.
  725. *
  726. * @sample highcharts/exporting/buttons-contextbutton-symbol/
  727. * Use a circle for symbol
  728. * @sample highcharts/exporting/buttons-contextbutton-symbol-custom/
  729. * Custom shape as symbol
  730. *
  731. * @type {Highcharts.SymbolKeyValue|"exportIcon"|"menu"|"menuball"|string}
  732. * @since 2.0
  733. */
  734. symbol: 'menu',
  735. /**
  736. * The key to a [lang](#lang) option setting that is used for the
  737. * button's title tooltip. When the key is `contextButtonTitle`, it
  738. * refers to [lang.contextButtonTitle](#lang.contextButtonTitle)
  739. * that defaults to "Chart context menu".
  740. *
  741. * @since 6.1.4
  742. */
  743. titleKey: 'contextButtonTitle',
  744. /**
  745. * This option is deprecated, use
  746. * [titleKey](#exporting.buttons.contextButton.titleKey) instead.
  747. *
  748. * @deprecated
  749. * @type {string}
  750. * @apioption exporting.buttons.contextButton._titleKey
  751. */
  752. /**
  753. * A collection of strings pointing to config options for the menu
  754. * items. The config options are defined in the
  755. * `menuItemDefinitions` option.
  756. *
  757. * By default, there is the "View in full screen" and "Print" menu
  758. * items, plus one menu item for each of the available export types.
  759. *
  760. * @sample {highcharts} highcharts/exporting/menuitemdefinitions/
  761. * Menu item definitions
  762. * @sample {highstock} highcharts/exporting/menuitemdefinitions/
  763. * Menu item definitions
  764. * @sample {highmaps} highcharts/exporting/menuitemdefinitions/
  765. * Menu item definitions
  766. *
  767. * @type {Array<string>}
  768. * @default ["viewFullscreen", "printChart", "separator", "downloadPNG", "downloadJPEG", "downloadPDF", "downloadSVG"]
  769. * @since 2.0
  770. */
  771. menuItems: [
  772. 'viewFullscreen',
  773. 'printChart',
  774. 'separator',
  775. 'downloadPNG',
  776. 'downloadJPEG',
  777. 'downloadPDF',
  778. 'downloadSVG'
  779. ]
  780. }
  781. },
  782. /**
  783. * An object consisting of definitions for the menu items in the context
  784. * menu. Each key value pair has a `key` that is referenced in the
  785. * [menuItems](#exporting.buttons.contextButton.menuItems) setting,
  786. * and a `value`, which is an object with the following properties:
  787. *
  788. * - **onclick:** The click handler for the menu item
  789. *
  790. * - **text:** The text for the menu item
  791. *
  792. * - **textKey:** If internationalization is required, the key to a language
  793. * string
  794. *
  795. * @sample {highcharts} highcharts/exporting/menuitemdefinitions/
  796. * Menu item definitions
  797. * @sample {highstock} highcharts/exporting/menuitemdefinitions/
  798. * Menu item definitions
  799. * @sample {highmaps} highcharts/exporting/menuitemdefinitions/
  800. * Menu item definitions
  801. *
  802. * @type {Highcharts.Dictionary<Highcharts.ExportingMenuObject>}
  803. * @default {"viewFullscreen": {}, "printChart": {}, "separator": {}, "downloadPNG": {}, "downloadJPEG": {}, "downloadPDF": {}, "downloadSVG": {}}
  804. * @since 5.0.13
  805. */
  806. menuItemDefinitions: {
  807. /**
  808. * @ignore
  809. */
  810. viewFullscreen: {
  811. textKey: 'viewFullscreen',
  812. onclick: function () {
  813. this.fullscreen = new H.FullScreen(this.container);
  814. }
  815. },
  816. /**
  817. * @ignore
  818. */
  819. printChart: {
  820. textKey: 'printChart',
  821. onclick: function () {
  822. this.print();
  823. }
  824. },
  825. /**
  826. * @ignore
  827. */
  828. separator: {
  829. separator: true
  830. },
  831. /**
  832. * @ignore
  833. */
  834. downloadPNG: {
  835. textKey: 'downloadPNG',
  836. onclick: function () {
  837. this.exportChart();
  838. }
  839. },
  840. /**
  841. * @ignore
  842. */
  843. downloadJPEG: {
  844. textKey: 'downloadJPEG',
  845. onclick: function () {
  846. this.exportChart({
  847. type: 'image/jpeg'
  848. });
  849. }
  850. },
  851. /**
  852. * @ignore
  853. */
  854. downloadPDF: {
  855. textKey: 'downloadPDF',
  856. onclick: function () {
  857. this.exportChart({
  858. type: 'application/pdf'
  859. });
  860. }
  861. },
  862. /**
  863. * @ignore
  864. */
  865. downloadSVG: {
  866. textKey: 'downloadSVG',
  867. onclick: function () {
  868. this.exportChart({
  869. type: 'image/svg+xml'
  870. });
  871. }
  872. }
  873. }
  874. };
  875. /**
  876. * Fires after a chart is printed through the context menu item or the
  877. * `Chart.print` method.
  878. *
  879. * @sample highcharts/chart/events-beforeprint-afterprint/
  880. * Rescale the chart to print
  881. *
  882. * @type {Highcharts.ExportingAfterPrintCallbackFunction}
  883. * @since 4.1.0
  884. * @context Highcharts.Chart
  885. * @requires modules/exporting
  886. * @apioption chart.events.afterPrint
  887. */
  888. /**
  889. * Fires before a chart is printed through the context menu item or
  890. * the `Chart.print` method.
  891. *
  892. * @sample highcharts/chart/events-beforeprint-afterprint/
  893. * Rescale the chart to print
  894. *
  895. * @type {Highcharts.ExportingBeforePrintCallbackFunction}
  896. * @since 4.1.0
  897. * @context Highcharts.Chart
  898. * @requires modules/exporting
  899. * @apioption chart.events.beforePrint
  900. */
  901. /**
  902. * The post utility
  903. *
  904. * @private
  905. * @function Highcharts.post
  906. * @param {string} url
  907. * Post URL
  908. * @param {object} data
  909. * Post data
  910. * @param {Highcharts.Dictionary<string>} [formAttributes]
  911. * Additional attributes for the post request
  912. * @return {void}
  913. */
  914. H.post = function (url, data, formAttributes) {
  915. // create the form
  916. var form = createElement('form', merge({
  917. method: 'post',
  918. action: url,
  919. enctype: 'multipart/form-data'
  920. }, formAttributes), {
  921. display: 'none'
  922. }, doc.body);
  923. // add the data
  924. objectEach(data, function (val, name) {
  925. createElement('input', {
  926. type: 'hidden',
  927. name: name,
  928. value: val
  929. }, null, form);
  930. });
  931. // submit
  932. form.submit();
  933. // clean up
  934. discardElement(form);
  935. };
  936. if (H.isSafari) {
  937. H.win.matchMedia('print').addListener(function (mqlEvent) {
  938. if (!H.printingChart) {
  939. return void 0;
  940. }
  941. if (mqlEvent.matches) {
  942. H.printingChart.beforePrint();
  943. }
  944. else {
  945. H.printingChart.afterPrint();
  946. }
  947. });
  948. }
  949. extend(Chart.prototype, /** @lends Highcharts.Chart.prototype */ {
  950. /* eslint-disable no-invalid-this, valid-jsdoc */
  951. /**
  952. * Exporting module only. A collection of fixes on the produced SVG to
  953. * account for expando properties, browser bugs, VML problems and other.
  954. * Returns a cleaned SVG.
  955. *
  956. * @private
  957. * @function Highcharts.Chart#sanitizeSVG
  958. * @param {string} svg
  959. * SVG code to sanitize
  960. * @param {Highcharts.Options} options
  961. * Chart options to apply
  962. * @return {string}
  963. * Sanitized SVG code
  964. * @requires modules/exporting
  965. */
  966. sanitizeSVG: function (svg, options) {
  967. var split = svg.indexOf('</svg>') + 6, html = svg.substr(split);
  968. // Remove any HTML added to the container after the SVG (#894, #9087)
  969. svg = svg.substr(0, split);
  970. // Move HTML into a foreignObject
  971. if (options && options.exporting && options.exporting.allowHTML) {
  972. if (html) {
  973. html = '<foreignObject x="0" y="0" ' +
  974. 'width="' + options.chart.width + '" ' +
  975. 'height="' + options.chart.height + '">' +
  976. '<body xmlns="http://www.w3.org/1999/xhtml">' +
  977. html +
  978. '</body>' +
  979. '</foreignObject>';
  980. svg = svg.replace('</svg>', html + '</svg>');
  981. }
  982. }
  983. svg = svg
  984. .replace(/zIndex="[^"]+"/g, '')
  985. .replace(/symbolName="[^"]+"/g, '')
  986. .replace(/jQuery[0-9]+="[^"]+"/g, '')
  987. .replace(/url\(("|&quot;)(.*?)("|&quot;)\;?\)/g, 'url($2)')
  988. .replace(/url\([^#]+#/g, 'url(#')
  989. .replace(/<svg /, '<svg xmlns:xlink="http://www.w3.org/1999/xlink" ')
  990. .replace(/ (|NS[0-9]+\:)href=/g, ' xlink:href=') // #3567
  991. .replace(/\n/, ' ')
  992. // Batik doesn't support rgba fills and strokes (#3095)
  993. .replace(/(fill|stroke)="rgba\(([ 0-9]+,[ 0-9]+,[ 0-9]+),([ 0-9\.]+)\)"/g, // eslint-disable-line max-len
  994. '$1="rgb($2)" $1-opacity="$3"')
  995. // Replace HTML entities, issue #347
  996. .replace(/&nbsp;/g, '\u00A0') // no-break space
  997. .replace(/&shy;/g, '\u00AD'); // soft hyphen
  998. // Further sanitize for oldIE
  999. if (this.ieSanitizeSVG) {
  1000. svg = this.ieSanitizeSVG(svg);
  1001. }
  1002. return svg;
  1003. },
  1004. /**
  1005. * Return the unfiltered innerHTML of the chart container. Used as hook for
  1006. * plugins. In styled mode, it also takes care of inlining CSS style rules.
  1007. *
  1008. * @see Chart#getSVG
  1009. *
  1010. * @function Highcharts.Chart#getChartHTML
  1011. *
  1012. * @returns {string}
  1013. * The unfiltered SVG of the chart.
  1014. *
  1015. * @requires modules/exporting
  1016. */
  1017. getChartHTML: function () {
  1018. if (this.styledMode) {
  1019. this.inlineStyles();
  1020. }
  1021. return this.container.innerHTML;
  1022. },
  1023. /**
  1024. * Return an SVG representation of the chart.
  1025. *
  1026. * @sample highcharts/members/chart-getsvg/
  1027. * View the SVG from a button
  1028. *
  1029. * @function Highcharts.Chart#getSVG
  1030. *
  1031. * @param {Highcharts.Options} [chartOptions]
  1032. * Additional chart options for the generated SVG representation. For
  1033. * collections like `xAxis`, `yAxis` or `series`, the additional
  1034. * options is either merged in to the original item of the same
  1035. * `id`, or to the first item if a common id is not found.
  1036. *
  1037. * @return {string}
  1038. * The SVG representation of the rendered chart.
  1039. *
  1040. * @fires Highcharts.Chart#event:getSVG
  1041. *
  1042. * @requires modules/exporting
  1043. */
  1044. getSVG: function (chartOptions) {
  1045. var chart = this, chartCopy, sandbox, svg, seriesOptions, sourceWidth, sourceHeight, cssWidth, cssHeight,
  1046. // Copy the options and add extra options
  1047. options = merge(chart.options, chartOptions);
  1048. // Use userOptions to make the options chain in series right (#3881)
  1049. options.plotOptions = merge(chart.userOptions.plotOptions, chartOptions && chartOptions.plotOptions);
  1050. // ... and likewise with time, avoid that undefined time properties are
  1051. // merged over legacy global time options
  1052. options.time = merge(chart.userOptions.time, chartOptions && chartOptions.time);
  1053. // create a sandbox where a new chart will be generated
  1054. sandbox = createElement('div', null, {
  1055. position: 'absolute',
  1056. top: '-9999em',
  1057. width: chart.chartWidth + 'px',
  1058. height: chart.chartHeight + 'px'
  1059. }, doc.body);
  1060. // get the source size
  1061. cssWidth = chart.renderTo.style.width;
  1062. cssHeight = chart.renderTo.style.height;
  1063. sourceWidth = options.exporting.sourceWidth ||
  1064. options.chart.width ||
  1065. (/px$/.test(cssWidth) && parseInt(cssWidth, 10)) ||
  1066. (options.isGantt ? 800 : 600);
  1067. sourceHeight = options.exporting.sourceHeight ||
  1068. options.chart.height ||
  1069. (/px$/.test(cssHeight) && parseInt(cssHeight, 10)) ||
  1070. 400;
  1071. // override some options
  1072. extend(options.chart, {
  1073. animation: false,
  1074. renderTo: sandbox,
  1075. forExport: true,
  1076. renderer: 'SVGRenderer',
  1077. width: sourceWidth,
  1078. height: sourceHeight
  1079. });
  1080. options.exporting.enabled = false; // hide buttons in print
  1081. delete options.data; // #3004
  1082. // prepare for replicating the chart
  1083. options.series = [];
  1084. chart.series.forEach(function (serie) {
  1085. seriesOptions = merge(serie.userOptions, {
  1086. animation: false,
  1087. enableMouseTracking: false,
  1088. showCheckbox: false,
  1089. visible: serie.visible
  1090. });
  1091. // Used for the navigator series that has its own option set
  1092. if (!seriesOptions.isInternal) {
  1093. options.series.push(seriesOptions);
  1094. }
  1095. });
  1096. // Assign an internal key to ensure a one-to-one mapping (#5924)
  1097. chart.axes.forEach(function (axis) {
  1098. if (!axis.userOptions.internalKey) { // #6444
  1099. axis.userOptions.internalKey = H.uniqueKey();
  1100. }
  1101. });
  1102. // generate the chart copy
  1103. chartCopy = new H.Chart(options, chart.callback);
  1104. // Axis options and series options (#2022, #3900, #5982)
  1105. if (chartOptions) {
  1106. ['xAxis', 'yAxis', 'series'].forEach(function (coll) {
  1107. var collOptions = {};
  1108. if (chartOptions[coll]) {
  1109. collOptions[coll] = chartOptions[coll];
  1110. chartCopy.update(collOptions);
  1111. }
  1112. });
  1113. }
  1114. // Reflect axis extremes in the export (#5924)
  1115. chart.axes.forEach(function (axis) {
  1116. var axisCopy = H.find(chartCopy.axes, function (copy) {
  1117. return copy.options.internalKey ===
  1118. axis.userOptions.internalKey;
  1119. }), extremes = axis.getExtremes(), userMin = extremes.userMin, userMax = extremes.userMax;
  1120. if (axisCopy &&
  1121. ((typeof userMin !== 'undefined' &&
  1122. userMin !== axisCopy.min) || (typeof userMax !== 'undefined' &&
  1123. userMax !== axisCopy.max))) {
  1124. axisCopy.setExtremes(userMin, userMax, true, false);
  1125. }
  1126. });
  1127. // Get the SVG from the container's innerHTML
  1128. svg = chartCopy.getChartHTML();
  1129. fireEvent(this, 'getSVG', { chartCopy: chartCopy });
  1130. svg = chart.sanitizeSVG(svg, options);
  1131. // free up memory
  1132. options = null;
  1133. chartCopy.destroy();
  1134. discardElement(sandbox);
  1135. return svg;
  1136. },
  1137. /**
  1138. * @private
  1139. * @function Highcharts.Chart#getSVGForExport
  1140. * @param {Highcharts.ExportingOptions} options
  1141. * @param {Highcharts.Options} chartOptions
  1142. * @return {string}
  1143. * @requires modules/exporting
  1144. */
  1145. getSVGForExport: function (options, chartOptions) {
  1146. var chartExportingOptions = this.options.exporting;
  1147. return this.getSVG(merge({ chart: { borderRadius: 0 } }, chartExportingOptions.chartOptions, chartOptions, {
  1148. exporting: {
  1149. sourceWidth: ((options && options.sourceWidth) ||
  1150. chartExportingOptions.sourceWidth),
  1151. sourceHeight: ((options && options.sourceHeight) ||
  1152. chartExportingOptions.sourceHeight)
  1153. }
  1154. }));
  1155. },
  1156. /**
  1157. * Get the default file name used for exported charts. By default it creates
  1158. * a file name based on the chart title.
  1159. *
  1160. * @function Highcharts.Chart#getFilename
  1161. *
  1162. * @return {string} A file name without extension.
  1163. *
  1164. * @requires modules/exporting
  1165. */
  1166. getFilename: function () {
  1167. var s = this.userOptions.title && this.userOptions.title.text, filename = this.options.exporting.filename;
  1168. if (filename) {
  1169. return filename.replace(/\//g, '-');
  1170. }
  1171. if (typeof s === 'string') {
  1172. filename = s
  1173. .toLowerCase()
  1174. .replace(/<\/?[^>]+(>|$)/g, '') // strip HTML tags
  1175. .replace(/[\s_]+/g, '-')
  1176. .replace(/[^a-z0-9\-]/g, '') // preserve only latin
  1177. .replace(/^[\-]+/g, '') // dashes in the start
  1178. .replace(/[\-]+/g, '-') // dashes in a row
  1179. .substr(0, 24)
  1180. .replace(/[\-]+$/g, ''); // dashes in the end;
  1181. }
  1182. if (!filename || filename.length < 5) {
  1183. filename = 'chart';
  1184. }
  1185. return filename;
  1186. },
  1187. /**
  1188. * Exporting module required. Submit an SVG version of the chart to a server
  1189. * along with some parameters for conversion.
  1190. *
  1191. * @sample highcharts/members/chart-exportchart/
  1192. * Export with no options
  1193. * @sample highcharts/members/chart-exportchart-filename/
  1194. * PDF type and custom filename
  1195. * @sample highcharts/members/chart-exportchart-custom-background/
  1196. * Different chart background in export
  1197. * @sample stock/members/chart-exportchart/
  1198. * Export with Highstock
  1199. *
  1200. * @function Highcharts.Chart#exportChart
  1201. *
  1202. * @param {Highcharts.ExportingOptions} exportingOptions
  1203. * Exporting options in addition to those defined in
  1204. * [exporting](https://api.highcharts.com/highcharts/exporting).
  1205. *
  1206. * @param {Highcharts.Options} chartOptions
  1207. * Additional chart options for the exported chart. For example a
  1208. * different background color can be added here, or `dataLabels` for
  1209. * export only.
  1210. *
  1211. * @return {void}
  1212. *
  1213. * @requires modules/exporting
  1214. */
  1215. exportChart: function (exportingOptions, chartOptions) {
  1216. var svg = this.getSVGForExport(exportingOptions, chartOptions);
  1217. // merge the options
  1218. exportingOptions = merge(this.options.exporting, exportingOptions);
  1219. // do the post
  1220. H.post(exportingOptions.url, {
  1221. filename: exportingOptions.filename ? exportingOptions.filename.replace(/\//g, '-') : this.getFilename(),
  1222. type: exportingOptions.type,
  1223. // IE8 fails to post undefined correctly, so use 0
  1224. width: exportingOptions.width || 0,
  1225. scale: exportingOptions.scale,
  1226. svg: svg
  1227. }, exportingOptions.formAttributes);
  1228. },
  1229. /**
  1230. * Move the chart container(s) to another div.
  1231. *
  1232. * @function Highcharts#moveContainers
  1233. *
  1234. * @private
  1235. *
  1236. * @param {Highcharts.HTMLDOMElement} moveTo
  1237. * Move target
  1238. * @return {void}
  1239. */
  1240. moveContainers: function (moveTo) {
  1241. var chart = this;
  1242. (chart.fixedDiv ? // When scrollablePlotArea is active (#9533)
  1243. [chart.fixedDiv, chart.scrollingContainer] :
  1244. [chart.container]).forEach(function (div) {
  1245. moveTo.appendChild(div);
  1246. });
  1247. },
  1248. /**
  1249. * Prepare chart and document before printing a chart.
  1250. *
  1251. * @function Highcharts#beforePrint
  1252. *
  1253. * @private
  1254. *
  1255. * @return {void}
  1256. *
  1257. * @fires Highcharts.Chart#event:beforePrint
  1258. */
  1259. beforePrint: function () {
  1260. var chart = this, body = doc.body, printMaxWidth = chart.options.exporting.printMaxWidth, printReverseInfo = {
  1261. childNodes: body.childNodes,
  1262. origDisplay: [],
  1263. resetParams: void 0
  1264. };
  1265. var handleMaxWidth;
  1266. chart.isPrinting = true;
  1267. chart.pointer.reset(null, 0);
  1268. fireEvent(chart, 'beforePrint');
  1269. // Handle printMaxWidth
  1270. handleMaxWidth = printMaxWidth && chart.chartWidth > printMaxWidth;
  1271. if (handleMaxWidth) {
  1272. printReverseInfo.resetParams = [
  1273. chart.options.chart.width,
  1274. void 0,
  1275. false
  1276. ];
  1277. chart.setSize(printMaxWidth, void 0, false);
  1278. }
  1279. // hide all body content
  1280. [].forEach.call(printReverseInfo.childNodes, function (node, i) {
  1281. if (node.nodeType === 1) {
  1282. printReverseInfo.origDisplay[i] = node.style.display;
  1283. node.style.display = 'none';
  1284. }
  1285. });
  1286. // pull out the chart
  1287. chart.moveContainers(body);
  1288. // Storage details for undo action after printing
  1289. chart.printReverseInfo = printReverseInfo;
  1290. },
  1291. /**
  1292. * Clena up after printing a chart.
  1293. *
  1294. * @function Highcharts#afterPrint
  1295. *
  1296. * @private
  1297. *
  1298. * @param {Highcharts.Chart} chart
  1299. * Chart that was (or suppose to be) printed
  1300. * @return {void}
  1301. *
  1302. * @fires Highcharts.Chart#event:afterPrint
  1303. */
  1304. afterPrint: function () {
  1305. var chart = this;
  1306. if (!chart.printReverseInfo) {
  1307. return void 0;
  1308. }
  1309. var childNodes = chart.printReverseInfo.childNodes, origDisplay = chart.printReverseInfo.origDisplay, resetParams = chart.printReverseInfo.resetParams;
  1310. // put the chart back in
  1311. chart.moveContainers(chart.renderTo);
  1312. // restore all body content
  1313. [].forEach.call(childNodes, function (node, i) {
  1314. if (node.nodeType === 1) {
  1315. node.style.display = (origDisplay[i] || '');
  1316. }
  1317. });
  1318. chart.isPrinting = false;
  1319. // Reset printMaxWidth
  1320. if (resetParams) {
  1321. chart.setSize.apply(chart, resetParams);
  1322. }
  1323. delete chart.printReverseInfo;
  1324. delete H.printingChart;
  1325. fireEvent(chart, 'afterPrint');
  1326. },
  1327. /**
  1328. * Exporting module required. Clears away other elements in the page and
  1329. * prints the chart as it is displayed. By default, when the exporting
  1330. * module is enabled, a context button with a drop down menu in the upper
  1331. * right corner accesses this function.
  1332. *
  1333. * @sample highcharts/members/chart-print/
  1334. * Print from a HTML button
  1335. *
  1336. * @function Highcharts.Chart#print
  1337. *
  1338. * @return {void}
  1339. *
  1340. * @fires Highcharts.Chart#event:beforePrint
  1341. * @fires Highcharts.Chart#event:afterPrint
  1342. *
  1343. * @requires modules/exporting
  1344. */
  1345. print: function () {
  1346. var chart = this;
  1347. if (chart.isPrinting) { // block the button while in printing mode
  1348. return;
  1349. }
  1350. H.printingChart = chart;
  1351. if (!H.isSafari) {
  1352. chart.beforePrint();
  1353. }
  1354. // Give the browser time to draw WebGL content, an issue that randomly
  1355. // appears (at least) in Chrome ~67 on the Mac (#8708).
  1356. setTimeout(function () {
  1357. win.focus(); // #1510
  1358. win.print();
  1359. // allow the browser to prepare before reverting
  1360. if (!H.isSafari) {
  1361. setTimeout(function () {
  1362. chart.afterPrint();
  1363. }, 1000);
  1364. }
  1365. }, 1);
  1366. },
  1367. /**
  1368. * Display a popup menu for choosing the export type.
  1369. *
  1370. * @private
  1371. * @function Highcharts.Chart#contextMenu
  1372. * @param {string} className
  1373. * An identifier for the menu.
  1374. * @param {Array<string|Highcharts.ExportingMenuObject>} items
  1375. * A collection with text and onclicks for the items.
  1376. * @param {number} x
  1377. * The x position of the opener button
  1378. * @param {number} y
  1379. * The y position of the opener button
  1380. * @param {number} width
  1381. * The width of the opener button
  1382. * @param {number} height
  1383. * The height of the opener button
  1384. * @return {void}
  1385. * @requires modules/exporting
  1386. */
  1387. contextMenu: function (className, items, x, y, width, height, button) {
  1388. var chart = this, navOptions = chart.options.navigation, chartWidth = chart.chartWidth, chartHeight = chart.chartHeight, cacheName = 'cache-' + className, menu = chart[cacheName], menuPadding = Math.max(width, height), // for mouse leave detection
  1389. innerMenu, menuStyle;
  1390. // create the menu only the first time
  1391. if (!menu) {
  1392. // create a HTML element above the SVG
  1393. chart.exportContextMenu = chart[cacheName] = menu =
  1394. createElement('div', {
  1395. className: className
  1396. }, {
  1397. position: 'absolute',
  1398. zIndex: 1000,
  1399. padding: menuPadding + 'px',
  1400. pointerEvents: 'auto'
  1401. }, chart.fixedDiv || chart.container);
  1402. innerMenu = createElement('ul', { className: 'highcharts-menu' }, {
  1403. listStyle: 'none',
  1404. margin: 0,
  1405. padding: 0
  1406. }, menu);
  1407. // Presentational CSS
  1408. if (!chart.styledMode) {
  1409. css(innerMenu, extend({
  1410. MozBoxShadow: '3px 3px 10px #888',
  1411. WebkitBoxShadow: '3px 3px 10px #888',
  1412. boxShadow: '3px 3px 10px #888'
  1413. }, navOptions.menuStyle));
  1414. }
  1415. // hide on mouse out
  1416. menu.hideMenu = function () {
  1417. css(menu, { display: 'none' });
  1418. if (button) {
  1419. button.setState(0);
  1420. }
  1421. chart.openMenu = false;
  1422. css(chart.renderTo, { overflow: 'hidden' }); // #10361
  1423. H.clearTimeout(menu.hideTimer);
  1424. fireEvent(chart, 'exportMenuHidden');
  1425. };
  1426. // Hide the menu some time after mouse leave (#1357)
  1427. chart.exportEvents.push(addEvent(menu, 'mouseleave', function () {
  1428. menu.hideTimer = win.setTimeout(menu.hideMenu, 500);
  1429. }), addEvent(menu, 'mouseenter', function () {
  1430. H.clearTimeout(menu.hideTimer);
  1431. }),
  1432. // Hide it on clicking or touching outside the menu (#2258,
  1433. // #2335, #2407)
  1434. addEvent(doc, 'mouseup', function (e) {
  1435. if (!chart.pointer.inClass(e.target, className)) {
  1436. menu.hideMenu();
  1437. }
  1438. }), addEvent(menu, 'click', function () {
  1439. if (chart.openMenu) {
  1440. menu.hideMenu();
  1441. }
  1442. }));
  1443. // create the items
  1444. items.forEach(function (item) {
  1445. if (typeof item === 'string') {
  1446. item = chart.options.exporting
  1447. .menuItemDefinitions[item];
  1448. }
  1449. if (isObject(item, true)) {
  1450. var element;
  1451. if (item.separator) {
  1452. element = createElement('hr', null, null, innerMenu);
  1453. }
  1454. else {
  1455. element = createElement('li', {
  1456. className: 'highcharts-menu-item',
  1457. onclick: function (e) {
  1458. if (e) { // IE7
  1459. e.stopPropagation();
  1460. }
  1461. menu.hideMenu();
  1462. if (item.onclick) {
  1463. item.onclick
  1464. .apply(chart, arguments);
  1465. }
  1466. },
  1467. innerHTML: (item.text ||
  1468. chart.options.lang[item.textKey])
  1469. }, null, innerMenu);
  1470. if (!chart.styledMode) {
  1471. element.onmouseover = function () {
  1472. css(this, navOptions.menuItemHoverStyle);
  1473. };
  1474. element.onmouseout = function () {
  1475. css(this, navOptions.menuItemStyle);
  1476. };
  1477. css(element, extend({
  1478. cursor: 'pointer'
  1479. }, navOptions.menuItemStyle));
  1480. }
  1481. }
  1482. // Keep references to menu divs to be able to destroy them
  1483. chart.exportDivElements.push(element);
  1484. }
  1485. });
  1486. // Keep references to menu and innerMenu div to be able to destroy
  1487. // them
  1488. chart.exportDivElements.push(innerMenu, menu);
  1489. chart.exportMenuWidth = menu.offsetWidth;
  1490. chart.exportMenuHeight = menu.offsetHeight;
  1491. }
  1492. menuStyle = { display: 'block' };
  1493. // if outside right, right align it
  1494. if (x + chart.exportMenuWidth > chartWidth) {
  1495. menuStyle.right = (chartWidth - x - width - menuPadding) + 'px';
  1496. }
  1497. else {
  1498. menuStyle.left = (x - menuPadding) + 'px';
  1499. }
  1500. // if outside bottom, bottom align it
  1501. if (y + height + chart.exportMenuHeight > chartHeight &&
  1502. button.alignOptions.verticalAlign !== 'top') {
  1503. menuStyle.bottom = (chartHeight - y - menuPadding) + 'px';
  1504. }
  1505. else {
  1506. menuStyle.top = (y + height - menuPadding) + 'px';
  1507. }
  1508. css(menu, menuStyle);
  1509. css(chart.renderTo, { overflow: '' }); // #10361
  1510. chart.openMenu = true;
  1511. fireEvent(chart, 'exportMenuShown');
  1512. },
  1513. /**
  1514. * Add the export button to the chart, with options.
  1515. *
  1516. * @private
  1517. * @function Highcharts.Chart#addButton
  1518. * @param {Highcharts.NavigationButtonOptions} options
  1519. * @return {void}
  1520. * @requires modules/exporting
  1521. */
  1522. addButton: function (options) {
  1523. var chart = this, renderer = chart.renderer, btnOptions = merge(chart.options.navigation.buttonOptions, options), onclick = btnOptions.onclick, menuItems = btnOptions.menuItems, symbol, button, symbolSize = btnOptions.symbolSize || 12;
  1524. if (!chart.btnCount) {
  1525. chart.btnCount = 0;
  1526. }
  1527. // Keeps references to the button elements
  1528. if (!chart.exportDivElements) {
  1529. chart.exportDivElements = [];
  1530. chart.exportSVGElements = [];
  1531. }
  1532. if (btnOptions.enabled === false) {
  1533. return;
  1534. }
  1535. var attr = btnOptions.theme, states = attr.states, hover = states && states.hover, select = states && states.select, callback;
  1536. if (!chart.styledMode) {
  1537. attr.fill = pick(attr.fill, '#ffffff');
  1538. attr.stroke = pick(attr.stroke, 'none');
  1539. }
  1540. delete attr.states;
  1541. if (onclick) {
  1542. callback = function (e) {
  1543. if (e) {
  1544. e.stopPropagation();
  1545. }
  1546. onclick.call(chart, e);
  1547. };
  1548. }
  1549. else if (menuItems) {
  1550. callback = function (e) {
  1551. // consistent with onclick call (#3495)
  1552. if (e) {
  1553. e.stopPropagation();
  1554. }
  1555. chart.contextMenu(button.menuClassName, menuItems, button.translateX, button.translateY, button.width, button.height, button);
  1556. button.setState(2);
  1557. };
  1558. }
  1559. if (btnOptions.text && btnOptions.symbol) {
  1560. attr.paddingLeft = pick(attr.paddingLeft, 25);
  1561. }
  1562. else if (!btnOptions.text) {
  1563. extend(attr, {
  1564. width: btnOptions.width,
  1565. height: btnOptions.height,
  1566. padding: 0
  1567. });
  1568. }
  1569. if (!chart.styledMode) {
  1570. attr['stroke-linecap'] = 'round';
  1571. attr.fill = pick(attr.fill, '#ffffff');
  1572. attr.stroke = pick(attr.stroke, 'none');
  1573. }
  1574. button = renderer
  1575. .button(btnOptions.text, 0, 0, callback, attr, hover, select)
  1576. .addClass(options.className)
  1577. .attr({
  1578. title: pick(chart.options.lang[btnOptions._titleKey || btnOptions.titleKey], '')
  1579. });
  1580. button.menuClassName = (options.menuClassName ||
  1581. 'highcharts-menu-' + chart.btnCount++);
  1582. if (btnOptions.symbol) {
  1583. symbol = renderer
  1584. .symbol(btnOptions.symbol, btnOptions.symbolX - (symbolSize / 2), btnOptions.symbolY - (symbolSize / 2), symbolSize, symbolSize
  1585. // If symbol is an image, scale it (#7957)
  1586. , {
  1587. width: symbolSize,
  1588. height: symbolSize
  1589. })
  1590. .addClass('highcharts-button-symbol')
  1591. .attr({
  1592. zIndex: 1
  1593. })
  1594. .add(button);
  1595. if (!chart.styledMode) {
  1596. symbol.attr({
  1597. stroke: btnOptions.symbolStroke,
  1598. fill: btnOptions.symbolFill,
  1599. 'stroke-width': btnOptions.symbolStrokeWidth || 1
  1600. });
  1601. }
  1602. }
  1603. button
  1604. .add(chart.exportingGroup)
  1605. .align(extend(btnOptions, {
  1606. width: button.width,
  1607. x: pick(btnOptions.x, chart.buttonOffset) // #1654
  1608. }), true, 'spacingBox');
  1609. chart.buttonOffset += ((button.width + btnOptions.buttonSpacing) *
  1610. (btnOptions.align === 'right' ? -1 : 1));
  1611. chart.exportSVGElements.push(button, symbol);
  1612. },
  1613. /**
  1614. * Destroy the export buttons.
  1615. * @private
  1616. * @function Highcharts.Chart#destroyExport
  1617. * @param {global.Event} [e]
  1618. * @return {void}
  1619. * @requires modules/exporting
  1620. */
  1621. destroyExport: function (e) {
  1622. var chart = e ? e.target : this, exportSVGElements = chart.exportSVGElements, exportDivElements = chart.exportDivElements, exportEvents = chart.exportEvents, cacheName;
  1623. // Destroy the extra buttons added
  1624. if (exportSVGElements) {
  1625. exportSVGElements.forEach(function (elem, i) {
  1626. // Destroy and null the svg elements
  1627. if (elem) { // #1822
  1628. elem.onclick = elem.ontouchstart = null;
  1629. cacheName = 'cache-' + elem.menuClassName;
  1630. if (chart[cacheName]) {
  1631. delete chart[cacheName];
  1632. }
  1633. chart.exportSVGElements[i] = elem.destroy();
  1634. }
  1635. });
  1636. exportSVGElements.length = 0;
  1637. }
  1638. // Destroy the exporting group
  1639. if (chart.exportingGroup) {
  1640. chart.exportingGroup.destroy();
  1641. delete chart.exportingGroup;
  1642. }
  1643. // Destroy the divs for the menu
  1644. if (exportDivElements) {
  1645. exportDivElements.forEach(function (elem, i) {
  1646. // Remove the event handler
  1647. H.clearTimeout(elem.hideTimer); // #5427
  1648. removeEvent(elem, 'mouseleave');
  1649. // Remove inline events
  1650. chart.exportDivElements[i] =
  1651. elem.onmouseout =
  1652. elem.onmouseover =
  1653. elem.ontouchstart =
  1654. elem.onclick = null;
  1655. // Destroy the div by moving to garbage bin
  1656. discardElement(elem);
  1657. });
  1658. exportDivElements.length = 0;
  1659. }
  1660. if (exportEvents) {
  1661. exportEvents.forEach(function (unbind) {
  1662. unbind();
  1663. });
  1664. exportEvents.length = 0;
  1665. }
  1666. }
  1667. /* eslint-enable no-invalid-this, valid-jsdoc */
  1668. });
  1669. // These ones are translated to attributes rather than styles
  1670. SVGRenderer.prototype.inlineToAttributes = [
  1671. 'fill',
  1672. 'stroke',
  1673. 'strokeLinecap',
  1674. 'strokeLinejoin',
  1675. 'strokeWidth',
  1676. 'textAnchor',
  1677. 'x',
  1678. 'y'
  1679. ];
  1680. // These CSS properties are not inlined. Remember camelCase.
  1681. SVGRenderer.prototype.inlineBlacklist = [
  1682. /-/,
  1683. /^(clipPath|cssText|d|height|width)$/,
  1684. /^font$/,
  1685. /[lL]ogical(Width|Height)$/,
  1686. /perspective/,
  1687. /TapHighlightColor/,
  1688. /^transition/,
  1689. /^length$/ // #7700
  1690. // /^text (border|color|cursor|height|webkitBorder)/
  1691. ];
  1692. SVGRenderer.prototype.unstyledElements = [
  1693. 'clipPath',
  1694. 'defs',
  1695. 'desc'
  1696. ];
  1697. /**
  1698. * Analyze inherited styles from stylesheets and add them inline
  1699. *
  1700. * @private
  1701. * @function Highcharts.Chart#inlineStyles
  1702. * @return {void}
  1703. *
  1704. * @todo: What are the border styles for text about? In general, text has a lot
  1705. * of properties.
  1706. * @todo: Make it work with IE9 and IE10.
  1707. *
  1708. * @requires modules/exporting
  1709. */
  1710. Chart.prototype.inlineStyles = function () {
  1711. var renderer = this.renderer, inlineToAttributes = renderer.inlineToAttributes, blacklist = renderer.inlineBlacklist, whitelist = renderer.inlineWhitelist, // For IE
  1712. unstyledElements = renderer.unstyledElements, defaultStyles = {}, dummySVG, iframe, iframeDoc;
  1713. // Create an iframe where we read default styles without pollution from this
  1714. // body
  1715. iframe = doc.createElement('iframe');
  1716. css(iframe, {
  1717. width: '1px',
  1718. height: '1px',
  1719. visibility: 'hidden'
  1720. });
  1721. doc.body.appendChild(iframe);
  1722. iframeDoc = iframe.contentWindow.document;
  1723. iframeDoc.open();
  1724. iframeDoc.write('<svg xmlns="http://www.w3.org/2000/svg"></svg>');
  1725. iframeDoc.close();
  1726. /**
  1727. * Make hyphenated property names out of camelCase
  1728. * @private
  1729. * @param {string} prop
  1730. * Property name in camelCase
  1731. * @return {string}
  1732. * Hyphenated property name
  1733. */
  1734. function hyphenate(prop) {
  1735. return prop.replace(/([A-Z])/g, function (a, b) {
  1736. return '-' + b.toLowerCase();
  1737. });
  1738. }
  1739. /**
  1740. * Call this on all elements and recurse to children
  1741. * @private
  1742. * @param {Highcharts.HTMLDOMElement} node
  1743. * Element child
  1744. * @return {void}
  1745. */
  1746. function recurse(node) {
  1747. var styles, parentStyles, cssText = '', dummy, styleAttr, blacklisted, whitelisted, i;
  1748. /**
  1749. * Check computed styles and whether they are in the white/blacklist for
  1750. * styles or atttributes.
  1751. * @private
  1752. * @param {string} val
  1753. * Style value
  1754. * @param {string} prop
  1755. * Style property name
  1756. * @return {void}
  1757. */
  1758. function filterStyles(val, prop) {
  1759. // Check against whitelist & blacklist
  1760. blacklisted = whitelisted = false;
  1761. if (whitelist) {
  1762. // Styled mode in IE has a whitelist instead.
  1763. // Exclude all props not in this list.
  1764. i = whitelist.length;
  1765. while (i-- && !whitelisted) {
  1766. whitelisted = whitelist[i].test(prop);
  1767. }
  1768. blacklisted = !whitelisted;
  1769. }
  1770. // Explicitly remove empty transforms
  1771. if (prop === 'transform' && val === 'none') {
  1772. blacklisted = true;
  1773. }
  1774. i = blacklist.length;
  1775. while (i-- && !blacklisted) {
  1776. blacklisted = (blacklist[i].test(prop) ||
  1777. typeof val === 'function');
  1778. }
  1779. if (!blacklisted) {
  1780. // If parent node has the same style, it gets inherited, no need
  1781. // to inline it. Top-level props should be diffed against parent
  1782. // (#7687).
  1783. if ((parentStyles[prop] !== val || node.nodeName === 'svg') &&
  1784. defaultStyles[node.nodeName][prop] !== val) {
  1785. // Attributes
  1786. if (inlineToAttributes.indexOf(prop) !== -1) {
  1787. node.setAttribute(hyphenate(prop), val);
  1788. // Styles
  1789. }
  1790. else {
  1791. cssText += hyphenate(prop) + ':' + val + ';';
  1792. }
  1793. }
  1794. }
  1795. }
  1796. if (node.nodeType === 1 &&
  1797. unstyledElements.indexOf(node.nodeName) === -1) {
  1798. styles = win.getComputedStyle(node, null);
  1799. parentStyles = node.nodeName === 'svg' ?
  1800. {} :
  1801. win.getComputedStyle(node.parentNode, null);
  1802. // Get default styles from the browser so that we don't have to add
  1803. // these
  1804. if (!defaultStyles[node.nodeName]) {
  1805. /*
  1806. if (!dummySVG) {
  1807. dummySVG = doc.createElementNS(H.SVG_NS, 'svg');
  1808. dummySVG.setAttribute('version', '1.1');
  1809. doc.body.appendChild(dummySVG);
  1810. }
  1811. */
  1812. dummySVG = iframeDoc.getElementsByTagName('svg')[0];
  1813. dummy = iframeDoc.createElementNS(node.namespaceURI, node.nodeName);
  1814. dummySVG.appendChild(dummy);
  1815. // Copy, so we can remove the node
  1816. defaultStyles[node.nodeName] = merge(win.getComputedStyle(dummy, null));
  1817. // Remove default fill, otherwise text disappears when exported
  1818. if (node.nodeName === 'text') {
  1819. delete defaultStyles.text.fill;
  1820. }
  1821. dummySVG.removeChild(dummy);
  1822. }
  1823. // Loop through all styles and add them inline if they are ok
  1824. if (isFirefoxBrowser || isMSBrowser) {
  1825. // Some browsers put lots of styles on the prototype
  1826. for (var p in styles) { // eslint-disable-line guard-for-in
  1827. filterStyles(styles[p], p);
  1828. }
  1829. }
  1830. else {
  1831. objectEach(styles, filterStyles);
  1832. }
  1833. // Apply styles
  1834. if (cssText) {
  1835. styleAttr = node.getAttribute('style');
  1836. node.setAttribute('style', (styleAttr ? styleAttr + ';' : '') + cssText);
  1837. }
  1838. // Set default stroke width (needed at least for IE)
  1839. if (node.nodeName === 'svg') {
  1840. node.setAttribute('stroke-width', '1px');
  1841. }
  1842. if (node.nodeName === 'text') {
  1843. return;
  1844. }
  1845. // Recurse
  1846. [].forEach.call(node.children || node.childNodes, recurse);
  1847. }
  1848. }
  1849. /**
  1850. * Remove the dummy objects used to get defaults
  1851. * @private
  1852. * @return {void}
  1853. */
  1854. function tearDown() {
  1855. dummySVG.parentNode.removeChild(dummySVG);
  1856. }
  1857. recurse(this.container.querySelector('svg'));
  1858. tearDown();
  1859. };
  1860. symbols.menu = function (x, y, width, height) {
  1861. var arr = [
  1862. 'M', x, y + 2.5,
  1863. 'L', x + width, y + 2.5,
  1864. 'M', x, y + height / 2 + 0.5,
  1865. 'L', x + width, y + height / 2 + 0.5,
  1866. 'M', x, y + height - 1.5,
  1867. 'L', x + width, y + height - 1.5
  1868. ];
  1869. return arr;
  1870. };
  1871. symbols.menuball = function (x, y, width, height) {
  1872. var path = [], h = (height / 3) - 2;
  1873. path = path.concat(this.circle(width - h, y, h, h), this.circle(width - h, y + h + 4, h, h), this.circle(width - h, y + 2 * (h + 4), h, h));
  1874. return path;
  1875. };
  1876. /**
  1877. * Add the buttons on chart load
  1878. * @private
  1879. * @function Highcharts.Chart#renderExporting
  1880. * @return {void}
  1881. * @requires modules/exporting
  1882. */
  1883. Chart.prototype.renderExporting = function () {
  1884. var chart = this, exportingOptions = chart.options.exporting, buttons = exportingOptions.buttons, isDirty = chart.isDirtyExporting || !chart.exportSVGElements;
  1885. chart.buttonOffset = 0;
  1886. if (chart.isDirtyExporting) {
  1887. chart.destroyExport();
  1888. }
  1889. if (isDirty && exportingOptions.enabled !== false) {
  1890. chart.exportEvents = [];
  1891. chart.exportingGroup = chart.exportingGroup ||
  1892. chart.renderer.g('exporting-group').attr({
  1893. zIndex: 3 // #4955, // #8392
  1894. }).add();
  1895. objectEach(buttons, function (button) {
  1896. chart.addButton(button);
  1897. });
  1898. chart.isDirtyExporting = false;
  1899. }
  1900. // Destroy the export elements at chart destroy
  1901. addEvent(chart, 'destroy', chart.destroyExport);
  1902. };
  1903. /* eslint-disable no-invalid-this */
  1904. // Add update methods to handle chart.update and chart.exporting.update and
  1905. // chart.navigation.update. These must be added to the chart instance rather
  1906. // than the Chart prototype in order to use the chart instance inside the update
  1907. // function.
  1908. addEvent(Chart, 'init', function () {
  1909. var chart = this;
  1910. /**
  1911. * @private
  1912. * @param {"exporting"|"navigation"} prop
  1913. * Property name in option root
  1914. * @param {Highcharts.ExportingOptions|Highcharts.NavigationOptions} options
  1915. * Options to update
  1916. * @param {boolean} [redraw=true]
  1917. * Whether to redraw
  1918. * @return {void}
  1919. */
  1920. function update(prop, options, redraw) {
  1921. chart.isDirtyExporting = true;
  1922. merge(true, chart.options[prop], options);
  1923. if (pick(redraw, true)) {
  1924. chart.redraw();
  1925. }
  1926. }
  1927. chart.exporting = {
  1928. update: function (options, redraw) {
  1929. update('exporting', options, redraw);
  1930. }
  1931. };
  1932. // Register update() method for navigation. Can not be set the same way as
  1933. // for exporting, because navigation options are shared with bindings which
  1934. // has separate update() logic.
  1935. chartNavigationMixin.addUpdate(function (options, redraw) {
  1936. update('navigation', options, redraw);
  1937. }, chart);
  1938. });
  1939. /* eslint-enable no-invalid-this */
  1940. Chart.prototype.callbacks.push(function (chart) {
  1941. chart.renderExporting();
  1942. addEvent(chart, 'redraw', chart.renderExporting);
  1943. // Uncomment this to see a button directly below the chart, for quick
  1944. // testing of export
  1945. /*
  1946. var button, viewImage, viewSource;
  1947. if (!chart.renderer.forExport) {
  1948. viewImage = function () {
  1949. var div = doc.createElement('div');
  1950. div.innerHTML = chart.getSVGForExport();
  1951. chart.renderTo.parentNode.appendChild(div);
  1952. };
  1953. viewSource = function () {
  1954. var pre = doc.createElement('pre');
  1955. pre.innerHTML = chart.getSVGForExport()
  1956. .replace(/</g, '\n&lt;')
  1957. .replace(/>/g, '&gt;');
  1958. chart.renderTo.parentNode.appendChild(pre);
  1959. };
  1960. viewImage();
  1961. // View SVG Image
  1962. button = doc.createElement('button');
  1963. button.innerHTML = 'View SVG Image';
  1964. chart.renderTo.parentNode.appendChild(button);
  1965. button.onclick = viewImage;
  1966. // View SVG Source
  1967. button = doc.createElement('button');
  1968. button.innerHTML = 'View SVG Source';
  1969. chart.renderTo.parentNode.appendChild(button);
  1970. button.onclick = viewSource;
  1971. }
  1972. //*/
  1973. });