oldie.src.js 67 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503
  1. /**
  2. * @license Highcharts JS v9.1.1 (2021-06-04)
  3. *
  4. * Old IE (v6, v7, v8) module for Highcharts v6+.
  5. *
  6. * (c) 2010-2021 Highsoft AS
  7. * Author: Torstein Honsi
  8. *
  9. * License: www.highcharts.com/license
  10. */
  11. 'use strict';
  12. (function (factory) {
  13. if (typeof module === 'object' && module.exports) {
  14. factory['default'] = factory;
  15. module.exports = factory;
  16. } else if (typeof define === 'function' && define.amd) {
  17. define('highcharts/modules/oldie', ['highcharts'], function (Highcharts) {
  18. factory(Highcharts);
  19. factory.Highcharts = Highcharts;
  20. return factory;
  21. });
  22. } else {
  23. factory(typeof Highcharts !== 'undefined' ? Highcharts : undefined);
  24. }
  25. }(function (Highcharts) {
  26. var _modules = Highcharts ? Highcharts._modules : {};
  27. function _registerModule(obj, path, args, fn) {
  28. if (!obj.hasOwnProperty(path)) {
  29. obj[path] = fn.apply(null, args);
  30. }
  31. }
  32. _registerModule(_modules, 'Extensions/Oldie/VMLAxis3D.js', [_modules['Core/Utilities.js']], function (U) {
  33. /* *
  34. *
  35. * (c) 2010-2021 Torstein Honsi
  36. *
  37. * Extension to the VML Renderer
  38. *
  39. * License: www.highcharts.com/license
  40. *
  41. * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
  42. *
  43. * */
  44. var addEvent = U.addEvent;
  45. /* *
  46. *
  47. * Class
  48. *
  49. * */
  50. /* eslint-disable valid-jsdoc */
  51. var VMLAxis3DAdditions = /** @class */ (function () {
  52. /* *
  53. *
  54. * Constructors
  55. *
  56. * */
  57. function VMLAxis3DAdditions(axis) {
  58. this.axis = axis;
  59. }
  60. return VMLAxis3DAdditions;
  61. }());
  62. var VMLAxis3D = /** @class */ (function () {
  63. function VMLAxis3D() {
  64. }
  65. /* *
  66. *
  67. * Static Properties
  68. *
  69. * */
  70. VMLAxis3D.compose = function (AxisClass) {
  71. AxisClass.keepProps.push('vml');
  72. addEvent(AxisClass, 'destroy', VMLAxis3D.onDestroy);
  73. addEvent(AxisClass, 'init', VMLAxis3D.onInit);
  74. addEvent(AxisClass, 'render', VMLAxis3D.onRender);
  75. };
  76. /**
  77. * @private
  78. */
  79. VMLAxis3D.onDestroy = function () {
  80. var axis = this,
  81. vml = axis.vml;
  82. if (vml) {
  83. var el_1;
  84. ['backFrame', 'bottomFrame', 'sideFrame'].forEach(function (prop) {
  85. el_1 = vml[prop];
  86. if (el_1) {
  87. vml[prop] = el_1.destroy();
  88. }
  89. }, this);
  90. }
  91. };
  92. /**
  93. * @private
  94. */
  95. VMLAxis3D.onInit = function () {
  96. var axis = this;
  97. if (!axis.vml) {
  98. axis.vml = new VMLAxis3DAdditions(axis);
  99. }
  100. };
  101. /**
  102. * @private
  103. */
  104. VMLAxis3D.onRender = function () {
  105. var axis = this;
  106. var vml = axis.vml;
  107. // VML doesn't support a negative z-index
  108. if (vml.sideFrame) {
  109. vml.sideFrame.css({ zIndex: 0 });
  110. vml.sideFrame.front.attr({
  111. fill: vml.sideFrame.color
  112. });
  113. }
  114. if (vml.bottomFrame) {
  115. vml.bottomFrame.css({ zIndex: 1 });
  116. vml.bottomFrame.front.attr({
  117. fill: vml.bottomFrame.color
  118. });
  119. }
  120. if (vml.backFrame) {
  121. vml.backFrame.css({ zIndex: 0 });
  122. vml.backFrame.front.attr({
  123. fill: vml.backFrame.color
  124. });
  125. }
  126. };
  127. return VMLAxis3D;
  128. }());
  129. return VMLAxis3D;
  130. });
  131. _registerModule(_modules, 'Extensions/Oldie/VMLRenderer3D.js', [_modules['Core/Axis/Axis.js'], _modules['Core/DefaultOptions.js'], _modules['Extensions/Oldie/VMLAxis3D.js']], function (Axis, D, VMLAxis3D) {
  132. /* *
  133. *
  134. * (c) 2010-2021 Torstein Honsi
  135. *
  136. * Extension to the VML Renderer
  137. *
  138. * License: www.highcharts.com/license
  139. *
  140. * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
  141. *
  142. * */
  143. var setOptions = D.setOptions;
  144. var VMLRenderer3D = /** @class */ (function () {
  145. function VMLRenderer3D() {
  146. }
  147. /* *
  148. *
  149. * Static Properties
  150. *
  151. * */
  152. VMLRenderer3D.compose = function (vmlClass, svgClass) {
  153. var svgProto = svgClass.prototype;
  154. var vmlProto = vmlClass.prototype;
  155. setOptions({ animate: false });
  156. vmlProto.face3d = svgProto.face3d;
  157. vmlProto.polyhedron = svgProto.polyhedron;
  158. vmlProto.elements3d = svgProto.elements3d;
  159. vmlProto.element3d = svgProto.element3d;
  160. vmlProto.cuboid = svgProto.cuboid;
  161. vmlProto.cuboidPath = svgProto.cuboidPath;
  162. vmlProto.toLinePath = svgProto.toLinePath;
  163. vmlProto.toLineSegments = svgProto.toLineSegments;
  164. vmlProto.arc3d = function (shapeArgs) {
  165. var result = svgProto.arc3d.call(this,
  166. shapeArgs);
  167. result.css({ zIndex: result.zIndex });
  168. return result;
  169. };
  170. vmlProto.arc3dPath = svgProto.arc3dPath;
  171. VMLAxis3D.compose(Axis);
  172. };
  173. return VMLRenderer3D;
  174. }());
  175. return VMLRenderer3D;
  176. });
  177. _registerModule(_modules, 'Extensions/Oldie/Oldie.js', [_modules['Core/Chart/Chart.js'], _modules['Core/Color/Color.js'], _modules['Core/Globals.js'], _modules['Core/DefaultOptions.js'], _modules['Core/Color/Palette.js'], _modules['Core/Pointer.js'], _modules['Core/Renderer/RendererRegistry.js'], _modules['Core/Renderer/SVG/SVGElement.js'], _modules['Core/Renderer/SVG/SVGRenderer.js'], _modules['Core/Utilities.js'], _modules['Extensions/Oldie/VMLRenderer3D.js']], function (Chart, Color, H, D, palette, Pointer, RendererRegistry, SVGElement, SVGRenderer, U, VMLRenderer3D) {
  178. /* *
  179. *
  180. * (c) 2010-2021 Torstein Honsi
  181. *
  182. * License: www.highcharts.com/license
  183. *
  184. * Support for old IE browsers (6, 7 and 8) in Highcharts v6+.
  185. *
  186. * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
  187. *
  188. * */
  189. var color = Color.parse;
  190. var deg2rad = H.deg2rad,
  191. doc = H.doc,
  192. noop = H.noop,
  193. svg = H.svg,
  194. win = H.win;
  195. var getOptions = D.getOptions;
  196. var addEvent = U.addEvent,
  197. createElement = U.createElement,
  198. css = U.css,
  199. defined = U.defined,
  200. discardElement = U.discardElement,
  201. erase = U.erase,
  202. extend = U.extend,
  203. extendClass = U.extendClass,
  204. isArray = U.isArray,
  205. isNumber = U.isNumber,
  206. isObject = U.isObject,
  207. pick = U.pick,
  208. pInt = U.pInt,
  209. uniqueKey = U.uniqueKey;
  210. var VMLRenderer,
  211. VMLElement;
  212. /**
  213. * Path to the pattern image required by VML browsers in order to
  214. * draw radial gradients.
  215. *
  216. * @type {string}
  217. * @default http://code.highcharts.com/{version}/gfx/vml-radial-gradient.png
  218. * @since 2.3.0
  219. * @requires modules/oldie
  220. * @apioption global.VMLRadialGradientURL
  221. */
  222. getOptions().global.VMLRadialGradientURL =
  223. 'http://code.highcharts.com/9.1.1/gfx/vml-radial-gradient.png';
  224. // Utilites
  225. if (doc && !doc.defaultView) {
  226. H.getStyle = U.getStyle = function getStyle(el, prop) {
  227. var val,
  228. alias = {
  229. width: 'clientWidth',
  230. height: 'clientHeight'
  231. }[prop];
  232. if (el.style[prop]) {
  233. return pInt(el.style[prop]);
  234. }
  235. if (prop === 'opacity') {
  236. prop = 'filter';
  237. }
  238. // Getting the rendered width and height
  239. if (alias) {
  240. el.style.zoom = 1;
  241. return Math.max(el[alias] - 2 * getStyle(el, 'padding'), 0);
  242. }
  243. val = el.currentStyle[prop.replace(/\-(\w)/g, function (a, b) {
  244. return b.toUpperCase();
  245. })];
  246. if (prop === 'filter') {
  247. val = val.replace(/alpha\(opacity=([0-9]+)\)/, function (a, b) {
  248. return (b / 100);
  249. });
  250. }
  251. return val === '' ? 1 : pInt(val);
  252. };
  253. }
  254. /* eslint-disable no-invalid-this, valid-jsdoc */
  255. if (!svg) {
  256. // Prevent wrapping from creating false offsetWidths in export in legacy IE.
  257. // This applies only to charts for export, where IE runs the SVGRenderer
  258. // instead of the VMLRenderer
  259. // (#1079, #1063)
  260. addEvent(SVGElement, 'afterInit', function () {
  261. if (this.element.nodeName === 'text') {
  262. this.css({
  263. position: 'absolute'
  264. });
  265. }
  266. });
  267. /**
  268. * Old IE override for pointer normalize, adds chartX and chartY to event
  269. * arguments.
  270. *
  271. * @ignore
  272. * @function Highcharts.Pointer#normalize
  273. * @param {global.PointerEvent} e
  274. * @param {boolean} [chartPosition=false]
  275. * @return {Highcharts.PointerEventObject}
  276. */
  277. Pointer.prototype.normalize = function (e, chartPosition) {
  278. e = e || win.event;
  279. if (!e.target) {
  280. e.target = e.srcElement;
  281. }
  282. // Get mouse position
  283. if (!chartPosition) {
  284. this.chartPosition = chartPosition = this.getChartPosition();
  285. }
  286. return extend(e, {
  287. // #2005, #2129: the second case is for IE10 quirks mode within
  288. // framesets
  289. chartX: Math.round(Math.max(e.x, e.clientX - chartPosition.left)),
  290. chartY: Math.round(e.y)
  291. });
  292. };
  293. /**
  294. * Further sanitize the mock-SVG that is generated when exporting charts in
  295. * oldIE.
  296. *
  297. * @private
  298. * @function Highcharts.Chart#ieSanitizeSVG
  299. */
  300. Chart.prototype.ieSanitizeSVG = function (svg) {
  301. svg = svg
  302. .replace(/<IMG /g, '<image ')
  303. .replace(/<(\/?)TITLE>/g, '<$1title>')
  304. .replace(/height=([^" ]+)/g, 'height="$1"')
  305. .replace(/width=([^" ]+)/g, 'width="$1"')
  306. .replace(/hc-svg-href="([^"]+)">/g, 'xlink:href="$1"/>')
  307. .replace(/ id=([^" >]+)/g, ' id="$1"') // #4003
  308. .replace(/class=([^" >]+)/g, 'class="$1"')
  309. .replace(/ transform /g, ' ')
  310. .replace(/:(path|rect)/g, '$1')
  311. .replace(/style="([^"]+)"/g, function (s) {
  312. return s.toLowerCase();
  313. });
  314. return svg;
  315. };
  316. /**
  317. * VML namespaces can't be added until after complete. Listening
  318. * for Perini's doScroll hack is not enough.
  319. *
  320. * @private
  321. * @function Highcharts.Chart#isReadyToRender
  322. */
  323. Chart.prototype.isReadyToRender = function () {
  324. var chart = this;
  325. // Note: win == win.top is required
  326. if (!svg &&
  327. (win == win.top && // eslint-disable-line eqeqeq
  328. doc.readyState !== 'complete')) {
  329. doc.attachEvent('onreadystatechange', function () {
  330. doc.detachEvent('onreadystatechange', chart.firstRender);
  331. if (doc.readyState === 'complete') {
  332. chart.firstRender();
  333. }
  334. });
  335. return false;
  336. }
  337. return true;
  338. };
  339. // IE compatibility hack for generating SVG content that it doesn't really
  340. // understand. Used by the exporting module.
  341. if (!doc.createElementNS) {
  342. doc.createElementNS = function (ns, tagName) {
  343. return doc.createElement(tagName);
  344. };
  345. }
  346. /**
  347. * Old IE polyfill for addEventListener, called from inside the addEvent
  348. * function.
  349. *
  350. * @private
  351. * @function Highcharts.addEventListenerPolyfill<T>
  352. * @param {string} type
  353. * @param {Highcharts.EventCallbackFunction<T>} fn
  354. * @return {void}
  355. */
  356. H.addEventListenerPolyfill = function (type, fn) {
  357. var el = this;
  358. /**
  359. * @private
  360. */
  361. function wrappedFn(e) {
  362. e.target = e.srcElement || win; // #2820
  363. fn.call(el, e);
  364. }
  365. if (el.attachEvent) {
  366. if (!el.hcEventsIE) {
  367. el.hcEventsIE = {};
  368. }
  369. // unique function string (#6746)
  370. if (!fn.hcKey) {
  371. fn.hcKey = uniqueKey();
  372. }
  373. // Link wrapped fn with original fn, so we can get this in
  374. // removeEvent
  375. el.hcEventsIE[fn.hcKey] = wrappedFn;
  376. el.attachEvent('on' + type, wrappedFn);
  377. }
  378. };
  379. /**
  380. * @private
  381. * @function Highcharts.removeEventListenerPolyfill<T>
  382. * @param {string} type
  383. * @param {Highcharts.EventCallbackFunction<T>} fn
  384. * @return {void}
  385. */
  386. H.removeEventListenerPolyfill = function (type, fn) {
  387. if (this.detachEvent) {
  388. fn = this.hcEventsIE[fn.hcKey];
  389. this.detachEvent('on' + type, fn);
  390. }
  391. };
  392. /**
  393. * The VML element wrapper.
  394. *
  395. * @private
  396. * @class
  397. * @name Highcharts.VMLElement
  398. *
  399. * @augments Highcharts.SVGElement
  400. */
  401. VMLElement = {
  402. docMode8: doc && doc.documentMode === 8,
  403. /**
  404. * Initialize a new VML element wrapper. It builds the markup as a
  405. * string to minimize DOM traffic.
  406. *
  407. * @function Highcharts.VMLElement#init
  408. * @param {Highcharts.VMLRenderer} renderer
  409. * @param {string} nodeName
  410. */
  411. init: function (renderer, nodeName) {
  412. var wrapper = this, markup = ['<', nodeName, ' filled="f" stroked="f"'], style = ['position: ', 'absolute', ';'], isDiv = nodeName === 'div';
  413. // divs and shapes need size
  414. if (nodeName === 'shape' || isDiv) {
  415. style.push('left:0;top:0;width:1px;height:1px;');
  416. }
  417. style.push('visibility: ', isDiv ? 'hidden' : 'visible');
  418. markup.push(' style="', style.join(''), '"/>');
  419. // create element with default attributes and style
  420. if (nodeName) {
  421. markup = isDiv || nodeName === 'span' || nodeName === 'img' ?
  422. markup.join('') :
  423. renderer.prepVML(markup);
  424. wrapper.element = createElement(markup);
  425. }
  426. wrapper.renderer = renderer;
  427. },
  428. /**
  429. * Add the node to the given parent
  430. *
  431. * @function Highcharts.VMLElement
  432. * @param {Highcharts.VMLElement} parent
  433. * @return {Highcharts.VMLElement}
  434. */
  435. add: function (parent) {
  436. var wrapper = this,
  437. renderer = wrapper.renderer,
  438. element = wrapper.element,
  439. box = renderer.box,
  440. inverted = parent && parent.inverted,
  441. // get the parent node
  442. parentNode = parent ?
  443. parent.element || parent :
  444. box;
  445. if (parent) {
  446. this.parentGroup = parent;
  447. }
  448. // if the parent group is inverted, apply inversion on all children
  449. if (inverted) { // only on groups
  450. renderer.invertChild(element, parentNode);
  451. }
  452. // append it
  453. parentNode.appendChild(element);
  454. // align text after adding to be able to read offset
  455. wrapper.added = true;
  456. if (wrapper.alignOnAdd && !wrapper.deferUpdateTransform) {
  457. wrapper.updateTransform();
  458. }
  459. // fire an event for internal hooks
  460. if (wrapper.onAdd) {
  461. wrapper.onAdd();
  462. }
  463. // IE8 Standards can't set the class name before the element is
  464. // appended
  465. if (this.className) {
  466. this.attr('class', this.className);
  467. }
  468. return wrapper;
  469. },
  470. /**
  471. * VML always uses htmlUpdateTransform
  472. *
  473. * @function Highcharts.VMLElement#updateTransform
  474. */
  475. updateTransform: SVGElement.prototype.htmlUpdateTransform,
  476. /**
  477. * Set the rotation of a span with oldIE's filter
  478. *
  479. * @function Highcharts.VMLElement#setSpanRotation
  480. * @return {void}
  481. */
  482. setSpanRotation: function () {
  483. // Adjust for alignment and rotation. Rotation of useHTML content is
  484. // not yet implemented but it can probably be implemented for
  485. // Firefox 3.5+ on user request. FF3.5+ has support for CSS3
  486. // transform. The getBBox method also needs to be updated to
  487. // compensate for the rotation, like it currently does for SVG.
  488. // Test case: https://jsfiddle.net/highcharts/Ybt44/
  489. var rotation = this.rotation,
  490. costheta = Math.cos(rotation * deg2rad),
  491. sintheta = Math.sin(rotation * deg2rad);
  492. css(this.element, {
  493. filter: rotation ? [
  494. 'progid:DXImageTransform.Microsoft.Matrix(M11=', costheta,
  495. ', M12=', -sintheta, ', M21=', sintheta, ', M22=', costheta,
  496. ', sizingMethod=\'auto expand\')'
  497. ].join('') : 'none'
  498. });
  499. },
  500. /**
  501. * Get the positioning correction for the span after rotating.
  502. *
  503. * @function Highcharts.VMLElement#getSpanCorrection
  504. */
  505. getSpanCorrection: function (width, baseline, alignCorrection, rotation, align) {
  506. var costheta = rotation ? Math.cos(rotation * deg2rad) : 1,
  507. sintheta = rotation ? Math.sin(rotation * deg2rad) : 0,
  508. height = pick(this.elemHeight,
  509. this.element.offsetHeight),
  510. quad,
  511. nonLeft = align && align !== 'left';
  512. // correct x and y
  513. this.xCorr = (costheta < 0 && -width);
  514. this.yCorr = (sintheta < 0 && -height);
  515. // correct for baseline and corners spilling out after rotation
  516. quad = costheta * sintheta < 0;
  517. this.xCorr += (sintheta *
  518. baseline *
  519. (quad ? 1 - alignCorrection : alignCorrection));
  520. this.yCorr -= (costheta *
  521. baseline *
  522. (rotation ? (quad ? alignCorrection : 1 - alignCorrection) : 1));
  523. // correct for the length/height of the text
  524. if (nonLeft) {
  525. this.xCorr -=
  526. width * alignCorrection * (costheta < 0 ? -1 : 1);
  527. if (rotation) {
  528. this.yCorr -= (height *
  529. alignCorrection *
  530. (sintheta < 0 ? -1 : 1));
  531. }
  532. css(this.element, {
  533. textAlign: align
  534. });
  535. }
  536. },
  537. /**
  538. * Converts a subset of an SVG path definition to its VML counterpart.
  539. * Takes an array as the parameter and returns a string.
  540. *
  541. * @function Highcharts.VMLElement#pathToVML
  542. */
  543. pathToVML: function (value) {
  544. // convert paths
  545. var i = value.length,
  546. path = [];
  547. while (i--) {
  548. // Multiply by 10 to allow subpixel precision.
  549. // Substracting half a pixel seems to make the coordinates
  550. // align with SVG, but this hasn't been tested thoroughly
  551. if (isNumber(value[i])) {
  552. path[i] = Math.round(value[i] * 10) - 5;
  553. }
  554. else if (value[i] === 'Z') { // close the path
  555. path[i] = 'x';
  556. }
  557. else {
  558. path[i] = value[i];
  559. // When the start X and end X coordinates of an arc are too
  560. // close, they are rounded to the same value above. In this
  561. // case, substract or add 1 from the end X and Y positions.
  562. // #186, #760, #1371, #1410.
  563. if (value.isArc &&
  564. (value[i] === 'wa' || value[i] === 'at')) {
  565. // Start and end X
  566. if (path[i + 5] === path[i + 7]) {
  567. path[i + 7] +=
  568. value[i + 7] > value[i + 5] ? 1 : -1;
  569. }
  570. // Start and end Y
  571. if (path[i + 6] === path[i + 8]) {
  572. path[i + 8] +=
  573. value[i + 8] > value[i + 6] ? 1 : -1;
  574. }
  575. }
  576. }
  577. }
  578. return path.join(' ') || 'x';
  579. },
  580. /**
  581. * Set the element's clipping to a predefined rectangle
  582. *
  583. * @function Highcharts.VMLElement#clip
  584. * @param {Highcharts.VMLClipRectObject} clipRect
  585. * @return {Highcharts.VMLElement}
  586. */
  587. clip: function (clipRect) {
  588. var wrapper = this,
  589. clipMembers,
  590. cssRet;
  591. if (clipRect) {
  592. clipMembers = clipRect.members;
  593. // Ensure unique list of elements (#1258)
  594. erase(clipMembers, wrapper);
  595. clipMembers.push(wrapper);
  596. wrapper.destroyClip = function () {
  597. erase(clipMembers, wrapper);
  598. };
  599. cssRet = clipRect.getCSS(wrapper);
  600. }
  601. else {
  602. if (wrapper.destroyClip) {
  603. wrapper.destroyClip();
  604. }
  605. cssRet = {
  606. clip: wrapper.docMode8 ? 'inherit' : 'rect(auto)'
  607. }; // #1214
  608. }
  609. return wrapper.css(cssRet);
  610. },
  611. /**
  612. * Set styles for the element
  613. *
  614. * @function Highcharts.VMLElement#css
  615. * @param {Highcharts.CSSObject} styles
  616. * @return {Highcharts.VMLElement}
  617. */
  618. css: SVGElement.prototype.htmlCss,
  619. /**
  620. * Removes a child either by removeChild or move to garbageBin.
  621. * Issue 490; in VML removeChild results in Orphaned nodes according to
  622. * sIEve, discardElement does not.
  623. *
  624. * @function Highcharts.VMLElement#safeRemoveChild
  625. * @param {Highcharts.HTMLDOMElement} element
  626. * @return {void}
  627. */
  628. safeRemoveChild: function (element) {
  629. // discardElement will detach the node from its parent before
  630. // attaching it to the garbage bin. Therefore it is important that
  631. // the node is attached and have parent.
  632. if (element.parentNode) {
  633. discardElement(element);
  634. }
  635. },
  636. /**
  637. * Extend element.destroy by removing it from the clip members array
  638. *
  639. * @function Highcharts.VMLElement#destroy
  640. */
  641. destroy: function () {
  642. if (this.destroyClip) {
  643. this.destroyClip();
  644. }
  645. return SVGElement.prototype.destroy.apply(this);
  646. },
  647. /**
  648. * Add an event listener. VML override for normalizing event parameters.
  649. *
  650. * @function Highcharts.VMLElement#on
  651. * @param {string} eventType
  652. * @param {Function} handler
  653. * @return {Highcharts.VMLElement}
  654. */
  655. on: function (eventType, handler) {
  656. // simplest possible event model for internal use
  657. this.element['on' + eventType] = function () {
  658. var e = win.event;
  659. e.target = e.srcElement;
  660. handler(e);
  661. };
  662. return this;
  663. },
  664. /**
  665. * In stacked columns, cut off the shadows so that they don't overlap
  666. *
  667. * @function Highcharts.VMLElement#cutOffPath
  668. * @param {string} path
  669. * @param {number} length
  670. * @return {string}
  671. */
  672. cutOffPath: function (path, length) {
  673. var len;
  674. // The extra comma tricks the trailing comma remover in
  675. // "gulp scripts" task
  676. path = path.split(/[ ,]/);
  677. len = path.length;
  678. if (len === 9 || len === 11) {
  679. path[len - 4] = path[len - 2] =
  680. pInt(path[len - 2]) - 10 * length;
  681. }
  682. return path.join(' ');
  683. },
  684. /**
  685. * Apply a drop shadow by copying elements and giving them different
  686. * strokes.
  687. *
  688. * @function Highcharts.VMLElement#shadow
  689. * @param {Highcharts.ShadowOptionsObject} shadowOptions
  690. * @param {Highcharts.VMLElement} group
  691. * @param {boolean} cutOff
  692. * @return {Highcharts.VMLElement}
  693. */
  694. shadow: function (shadowOptions, group, cutOff) {
  695. var shadows = [],
  696. i,
  697. element = this.element,
  698. renderer = this.renderer,
  699. shadow,
  700. elemStyle = element.style,
  701. markup,
  702. path = element.path,
  703. strokeWidth,
  704. modifiedPath,
  705. shadowWidth,
  706. shadowElementOpacity;
  707. // some times empty paths are not strings
  708. if (path && typeof path.value !== 'string') {
  709. path = 'x';
  710. }
  711. modifiedPath = path;
  712. if (shadowOptions) {
  713. shadowWidth = pick(shadowOptions.width, 3);
  714. shadowElementOpacity =
  715. (shadowOptions.opacity || 0.15) / shadowWidth;
  716. for (i = 1; i <= 3; i++) {
  717. strokeWidth = (shadowWidth * 2) + 1 - (2 * i);
  718. // Cut off shadows for stacked column items
  719. if (cutOff) {
  720. modifiedPath = this.cutOffPath(path.value, strokeWidth + 0.5);
  721. }
  722. markup = [
  723. '<shape isShadow="true" strokeweight="', strokeWidth,
  724. '" filled="false" path="', modifiedPath,
  725. '" coordsize="10 10" style="', element.style.cssText,
  726. '" />'
  727. ];
  728. shadow = createElement(renderer.prepVML(markup), null, {
  729. left: (pInt(elemStyle.left) +
  730. pick(shadowOptions.offsetX, 1)) + 'px',
  731. top: (pInt(elemStyle.top) +
  732. pick(shadowOptions.offsetY, 1)) + 'px'
  733. });
  734. if (cutOff) {
  735. shadow.cutOff = strokeWidth + 1;
  736. }
  737. // apply the opacity
  738. markup = [
  739. '<stroke color="',
  740. shadowOptions.color || palette.neutralColor100,
  741. '" opacity="', shadowElementOpacity * i, '"/>'
  742. ];
  743. createElement(renderer.prepVML(markup), null, null, shadow);
  744. // insert it
  745. if (group) {
  746. group.element.appendChild(shadow);
  747. }
  748. else {
  749. element.parentNode
  750. .insertBefore(shadow, element);
  751. }
  752. // record it
  753. shadows.push(shadow);
  754. }
  755. this.shadows = shadows;
  756. }
  757. return this;
  758. },
  759. updateShadows: noop,
  760. setAttr: function (key, value) {
  761. if (this.docMode8) { // IE8 setAttribute bug
  762. this.element[key] = value;
  763. }
  764. else {
  765. this.element.setAttribute(key, value);
  766. }
  767. },
  768. getAttr: function (key) {
  769. if (this.docMode8) { // IE8 setAttribute bug
  770. return this.element[key];
  771. }
  772. return this.element.getAttribute(key);
  773. },
  774. classSetter: function (value) {
  775. // IE8 Standards mode has problems retrieving the className unless
  776. // set like this. IE8 Standards can't set the class name before the
  777. // element is appended.
  778. (this.added ? this.element : this).className = value;
  779. },
  780. dashstyleSetter: function (value, key, element) {
  781. var strokeElem = element.getElementsByTagName('stroke')[0] ||
  782. createElement(this.renderer.prepVML(['<stroke/>']),
  783. null,
  784. null,
  785. element);
  786. strokeElem[key] = value || 'solid';
  787. // Because changing stroke-width will change the dash length and
  788. // cause an epileptic effect
  789. this[key] = value;
  790. },
  791. dSetter: function (value, key, element) {
  792. var i,
  793. shadows = this.shadows;
  794. value = value || [];
  795. // Used in getter for animation
  796. this.d = value.join && value.join(' ');
  797. element.path = value = this.pathToVML(value);
  798. // update shadows
  799. if (shadows) {
  800. i = shadows.length;
  801. while (i--) {
  802. shadows[i].path = shadows[i].cutOff ?
  803. this.cutOffPath(value, shadows[i].cutOff) :
  804. value;
  805. }
  806. }
  807. this.setAttr(key, value);
  808. },
  809. fillSetter: function (value, key, element) {
  810. var nodeName = element.nodeName;
  811. if (nodeName === 'SPAN') { // text color
  812. element.style.color = value;
  813. }
  814. else if (nodeName !== 'IMG') { // #1336
  815. element.filled = value !== 'none';
  816. this.setAttr('fillcolor', this.renderer.color(value, element, key, this));
  817. }
  818. },
  819. 'fill-opacitySetter': function (value, key, element) {
  820. createElement(this.renderer.prepVML(['<', key.split('-')[0], ' opacity="', value, '"/>']), null, null, element);
  821. },
  822. // Don't bother - animation is too slow and filters introduce artifacts
  823. opacitySetter: noop,
  824. rotationSetter: function (value, key, element) {
  825. var style = element.style;
  826. // style is for #1873:
  827. this[key] = style[key] = value;
  828. // Correction for the 1x1 size of the shape container. Used in gauge
  829. // needles.
  830. style.left =
  831. -Math.round(Math.sin(value * deg2rad) + 1) + 'px';
  832. style.top =
  833. Math.round(Math.cos(value * deg2rad)) + 'px';
  834. },
  835. strokeSetter: function (value, key, element) {
  836. this.setAttr('strokecolor', this.renderer.color(value, element, key, this));
  837. },
  838. 'stroke-widthSetter': function (value, key, element) {
  839. element.stroked = !!value; // VML "stroked" attribute
  840. this[key] = value; // used in getter, issue #113
  841. if (isNumber(value)) {
  842. value += 'px';
  843. }
  844. this.setAttr('strokeweight', value);
  845. },
  846. titleSetter: function (value, key) {
  847. this.setAttr(key, value);
  848. },
  849. visibilitySetter: function (value, key, element) {
  850. // Handle inherited visibility
  851. if (value === 'inherit') {
  852. value = 'visible';
  853. }
  854. // Let the shadow follow the main element
  855. if (this.shadows) {
  856. this.shadows.forEach(function (shadow) {
  857. shadow.style[key] = value;
  858. });
  859. }
  860. // Instead of toggling the visibility CSS property, move the div out
  861. // of the viewport. This works around #61 and #586
  862. if (element.nodeName === 'DIV') {
  863. value = value === 'hidden' ? '-999em' : 0;
  864. // In order to redraw, IE7 needs the div to be visible when
  865. // tucked away outside the viewport. So the visibility is
  866. // actually opposite of the expected value. This applies to the
  867. // tooltip only.
  868. if (!this.docMode8) {
  869. element.style[key] = value ? 'visible' : 'hidden';
  870. }
  871. key = 'top';
  872. }
  873. element.style[key] = value;
  874. },
  875. xSetter: function (value, key, element) {
  876. this[key] = value; // used in getter
  877. if (key === 'x') {
  878. key = 'left';
  879. }
  880. else if (key === 'y') {
  881. key = 'top';
  882. }
  883. // clipping rectangle special
  884. if (this.updateClipping) {
  885. // the key is now 'left' or 'top' for 'x' and 'y'
  886. this[key] = value;
  887. this.updateClipping();
  888. }
  889. else {
  890. // normal
  891. element.style[key] = value;
  892. }
  893. },
  894. zIndexSetter: function (value, key, element) {
  895. element.style[key] = value;
  896. },
  897. fillGetter: function () {
  898. return this.getAttr('fillcolor') || '';
  899. },
  900. strokeGetter: function () {
  901. return this.getAttr('strokecolor') || '';
  902. },
  903. // #7850
  904. classGetter: function () {
  905. return this.getAttr('className') || '';
  906. }
  907. };
  908. VMLElement['stroke-opacitySetter'] =
  909. VMLElement['fill-opacitySetter'];
  910. H.VMLElement = VMLElement = extendClass(SVGElement, VMLElement);
  911. // Some shared setters
  912. VMLElement.prototype.ySetter =
  913. VMLElement.prototype.widthSetter =
  914. VMLElement.prototype.heightSetter =
  915. VMLElement.prototype.xSetter;
  916. /**
  917. * The VML renderer
  918. *
  919. * @private
  920. * @class
  921. * @name Highcharts.VMLRenderer
  922. *
  923. * @augments Highcharts.SVGRenderer
  924. */
  925. var VMLRendererExtension = {
  926. Element: VMLElement,
  927. isIE8: win.navigator.userAgent.indexOf('MSIE 8.0') > -1,
  928. /**
  929. * Initialize the VMLRenderer.
  930. *
  931. * @function Highcharts.VMLRenderer#init
  932. * @param {Highcharts.HTMLDOMElement} container
  933. * @param {number} width
  934. * @param {number} height
  935. * @return {void}
  936. */
  937. init: function (container,
  938. width,
  939. height) {
  940. var renderer = this,
  941. boxWrapper,
  942. box,
  943. css;
  944. // Extended SVGRenderer member
  945. this.crispPolyLine = SVGRenderer.prototype.crispPolyLine;
  946. renderer.alignedObjects = [];
  947. boxWrapper = renderer.createElement('div')
  948. .css({ position: 'relative' });
  949. box = boxWrapper.element;
  950. container.appendChild(boxWrapper.element);
  951. // generate the containing box
  952. renderer.isVML = true;
  953. renderer.box = box;
  954. renderer.boxWrapper = boxWrapper;
  955. renderer.gradients = {};
  956. renderer.cache = {}; // Cache for numerical bounding boxes
  957. renderer.cacheKeys = [];
  958. renderer.imgCount = 0;
  959. renderer.setSize(width, height, false);
  960. // The only way to make IE6 and IE7 print is to use a global
  961. // namespace. However, with IE8 the only way to make the dynamic
  962. // shapes visible in screen and print mode seems to be to add the
  963. // xmlns attribute and the behaviour style inline.
  964. if (!doc.namespaces.hcv) {
  965. doc.namespaces.add('hcv', 'urn:schemas-microsoft-com:vml');
  966. // Setup default CSS (#2153, #2368, #2384)
  967. css = 'hcv\\:fill, hcv\\:path, hcv\\:shape, hcv\\:stroke' +
  968. '{ behavior:url(#default#VML); display: inline-block; } ';
  969. try {
  970. doc.createStyleSheet().cssText = css;
  971. }
  972. catch (e) {
  973. doc.styleSheets[0].cssText += css;
  974. }
  975. }
  976. },
  977. /**
  978. * Detect whether the renderer is hidden. This happens when one of the
  979. * parent elements has display: none
  980. *
  981. * @function Highcharts.VMLRenderer#isHidden
  982. */
  983. isHidden: function () {
  984. return !this.box.offsetWidth;
  985. },
  986. /**
  987. * Define a clipping rectangle. In VML it is accomplished by storing the
  988. * values for setting the CSS style to all associated members.
  989. *
  990. * @function Highcharts.VMLRenderer#clipRect
  991. * @param {number|Highcharts.SizeObject} x
  992. * @param {number} y
  993. * @param {number} width
  994. * @param {number} height
  995. * @return {Highcharts.VMLElement}
  996. */
  997. clipRect: function (x, y, width, height) {
  998. // create a dummy element
  999. var clipRect = this.createElement(),
  1000. isObj = isObject(x);
  1001. // mimic a rectangle with its style object for automatic updating in
  1002. // attr
  1003. return extend(clipRect, {
  1004. members: [],
  1005. count: 0,
  1006. left: (isObj ? x.x : x) + 1,
  1007. top: (isObj ? x.y : y) + 1,
  1008. width: (isObj ? x.width : width) - 1,
  1009. height: (isObj ? x.height : height) - 1,
  1010. getCSS: function (wrapper) {
  1011. var element = wrapper.element, nodeName = element.nodeName, isShape = nodeName === 'shape', inverted = wrapper.inverted, rect = this, top = rect.top - (isShape ? element.offsetTop : 0), left = rect.left, right = left + rect.width, bottom = top + rect.height, ret = {
  1012. clip: 'rect(' +
  1013. Math.round(inverted ? left : top) + 'px,' +
  1014. Math.round(inverted ? bottom : right) + 'px,' +
  1015. Math.round(inverted ? right : bottom) + 'px,' +
  1016. Math.round(inverted ? top : left) + 'px)'
  1017. };
  1018. // issue 74 workaround
  1019. if (!inverted && wrapper.docMode8 && nodeName === 'DIV') {
  1020. extend(ret, {
  1021. width: right + 'px',
  1022. height: bottom + 'px'
  1023. });
  1024. }
  1025. return ret;
  1026. },
  1027. // used in attr and animation to update the clipping of all
  1028. // members
  1029. updateClipping: function () {
  1030. clipRect.members.forEach(function (member) {
  1031. // Member.element is falsy on deleted series, like in
  1032. // stock/members/series-remove demo. Should be removed
  1033. // from members, but this will do.
  1034. if (member.element) {
  1035. member.css(clipRect.getCSS(member));
  1036. }
  1037. });
  1038. }
  1039. });
  1040. },
  1041. /**
  1042. * Take a color and return it if it's a string, make it a gradient if
  1043. * it's a gradient configuration object, and apply opacity.
  1044. *
  1045. * @function Highcharts.VMLRenderer#color<T>
  1046. *
  1047. * @param {T} color
  1048. * The color or config object
  1049. *
  1050. * @return {T}
  1051. */
  1052. color: function (colorOption, elem, prop, wrapper) {
  1053. var renderer = this,
  1054. colorObject,
  1055. regexRgba = /^rgba/,
  1056. markup,
  1057. fillType,
  1058. ret = 'none';
  1059. // Check for linear or radial gradient
  1060. if (colorOption &&
  1061. colorOption.linearGradient) {
  1062. fillType = 'gradient';
  1063. }
  1064. else if (colorOption &&
  1065. colorOption.radialGradient) {
  1066. fillType = 'pattern';
  1067. }
  1068. if (fillType) {
  1069. var stopColor_1, stopOpacity_1, gradient = (colorOption.linearGradient ||
  1070. colorOption.radialGradient), x1 = void 0, y1 = void 0, x2 = void 0, y2 = void 0, opacity1_1, opacity2_1, color1_1, color2_1, fillAttr_1 = '', stops = colorOption.stops, firstStop = void 0, lastStop = void 0, colors_1 = [], addFillNode_1 = function () {
  1071. // Add the fill subnode. When colors attribute is used,
  1072. // the meanings of opacity and o:opacity2 are reversed.
  1073. markup = ['<fill colors="' + colors_1.join(',') +
  1074. '" opacity="', opacity2_1, '" o:opacity2="',
  1075. opacity1_1, '" type="', fillType, '" ', fillAttr_1,
  1076. 'focus="100%" method="any" />'];
  1077. createElement(renderer.prepVML(markup), null, null, elem);
  1078. };
  1079. // Extend from 0 to 1
  1080. firstStop = stops[0];
  1081. lastStop = stops[stops.length - 1];
  1082. if (firstStop[0] > 0) {
  1083. stops.unshift([
  1084. 0,
  1085. firstStop[1]
  1086. ]);
  1087. }
  1088. if (lastStop[0] < 1) {
  1089. stops.push([
  1090. 1,
  1091. lastStop[1]
  1092. ]);
  1093. }
  1094. // Compute the stops
  1095. stops.forEach(function (stop, i) {
  1096. if (regexRgba.test(stop[1])) {
  1097. colorObject = color(stop[1]);
  1098. stopColor_1 = colorObject.get('rgb');
  1099. stopOpacity_1 = colorObject.get('a');
  1100. }
  1101. else {
  1102. stopColor_1 = stop[1];
  1103. stopOpacity_1 = 1;
  1104. }
  1105. // Build the color attribute
  1106. colors_1.push((stop[0] * 100) + '% ' + stopColor_1);
  1107. // Only start and end opacities are allowed, so we use the
  1108. // first and the last
  1109. if (!i) {
  1110. opacity1_1 = stopOpacity_1;
  1111. color2_1 = stopColor_1;
  1112. }
  1113. else {
  1114. opacity2_1 = stopOpacity_1;
  1115. color1_1 = stopColor_1;
  1116. }
  1117. });
  1118. // Apply the gradient to fills only.
  1119. if (prop === 'fill') {
  1120. // Handle linear gradient angle
  1121. if (fillType === 'gradient') {
  1122. x1 = gradient.x1 || gradient[0] || 0;
  1123. y1 = gradient.y1 || gradient[1] || 0;
  1124. x2 = gradient.x2 || gradient[2] || 0;
  1125. y2 = gradient.y2 || gradient[3] || 0;
  1126. fillAttr_1 = 'angle="' + (90 - Math.atan((y2 - y1) / // y vector
  1127. (x2 - x1) // x vector
  1128. ) * 180 / Math.PI) + '"';
  1129. addFillNode_1();
  1130. // Radial (circular) gradient
  1131. }
  1132. else {
  1133. var r = gradient.r,
  1134. sizex_1 = r * 2,
  1135. sizey_1 = r * 2,
  1136. cx_1 = gradient.cx,
  1137. cy_1 = gradient.cy,
  1138. radialReference_1 = elem.radialReference,
  1139. bBox_1,
  1140. applyRadialGradient = function () {
  1141. if (radialReference_1) {
  1142. bBox_1 = wrapper.getBBox();
  1143. cx_1 += (radialReference_1[0] - bBox_1.x) /
  1144. bBox_1.width - 0.5;
  1145. cy_1 += (radialReference_1[1] - bBox_1.y) /
  1146. bBox_1.height - 0.5;
  1147. sizex_1 *= radialReference_1[2] / bBox_1.width;
  1148. sizey_1 *= radialReference_1[2] / bBox_1.height;
  1149. }
  1150. fillAttr_1 =
  1151. 'src="' + getOptions().global.VMLRadialGradientURL +
  1152. '" ' +
  1153. 'size="' + sizex_1 + ',' + sizey_1 + '" ' +
  1154. 'origin="0.5,0.5" ' +
  1155. 'position="' + cx_1 + ',' + cy_1 + '" ' +
  1156. 'color2="' + color2_1 + '" ';
  1157. addFillNode_1();
  1158. };
  1159. // Apply radial gradient
  1160. if (wrapper.added) {
  1161. applyRadialGradient();
  1162. }
  1163. else {
  1164. // We need to know the bounding box to get the size
  1165. // and position right
  1166. wrapper.onAdd = applyRadialGradient;
  1167. }
  1168. // The fill element's color attribute is broken in IE8
  1169. // standards mode, so we need to set the parent shape's
  1170. // fillcolor attribute instead.
  1171. ret = color1_1;
  1172. }
  1173. // Gradients are not supported for VML stroke, return the first
  1174. // color. #722.
  1175. }
  1176. else {
  1177. ret = stopColor_1;
  1178. }
  1179. // If the color is an rgba color, split it and add a fill node
  1180. // to hold the opacity component
  1181. }
  1182. else if (regexRgba.test(colorOption) && elem.tagName !== 'IMG') {
  1183. colorObject = color(colorOption);
  1184. wrapper[prop + '-opacitySetter'](colorObject.get('a'), prop, elem);
  1185. ret = colorObject.get('rgb');
  1186. }
  1187. else {
  1188. // 'stroke' or 'fill' node
  1189. var propNodes = elem.getElementsByTagName(prop);
  1190. if (propNodes.length) {
  1191. propNodes[0].opacity = 1;
  1192. propNodes[0].type = 'solid';
  1193. }
  1194. ret = colorOption;
  1195. }
  1196. return ret;
  1197. },
  1198. /**
  1199. * Take a VML string and prepare it for either IE8 or IE6/IE7.
  1200. *
  1201. * @function Highcharts.VMLRenderer#prepVML
  1202. *
  1203. * @param {Array<(number|string)>} markup
  1204. * A string array of the VML markup to prepare
  1205. *
  1206. * @return {string}
  1207. */
  1208. prepVML: function (markup) {
  1209. var vmlStyle = 'display:inline-block;behavior:url(#default#VML);',
  1210. isIE8 = this.isIE8;
  1211. markup = markup.join('');
  1212. if (isIE8) { // add xmlns and style inline
  1213. markup = markup.replace('/>', ' xmlns="urn:schemas-microsoft-com:vml" />');
  1214. if (markup.indexOf('style="') === -1) {
  1215. markup = markup.replace('/>', ' style="' + vmlStyle + '" />');
  1216. }
  1217. else {
  1218. markup = markup.replace('style="', 'style="' + vmlStyle);
  1219. }
  1220. }
  1221. else { // add namespace
  1222. markup = markup.replace('<', '<hcv:');
  1223. }
  1224. return markup;
  1225. },
  1226. /**
  1227. * Create rotated and aligned text
  1228. *
  1229. * @function Highcharts.VMLRenderer#text
  1230. *
  1231. * @param {string} str
  1232. *
  1233. * @param {number} x
  1234. *
  1235. * @param {number} y
  1236. */
  1237. text: SVGRenderer.prototype.html,
  1238. /**
  1239. * Create and return a path element
  1240. *
  1241. * @function Highcharts.VMLRenderer#path
  1242. *
  1243. * @param {Highcharts.VMLAttributes|Highcharts.VMLPathArray} [path]
  1244. */
  1245. path: function (path) {
  1246. var attr = {
  1247. // subpixel precision down to 0.1 (width and height = 1px)
  1248. coordsize: '10 10'
  1249. };
  1250. if (isArray(path)) {
  1251. attr.d = path;
  1252. }
  1253. else if (isObject(path)) { // attributes
  1254. extend(attr, path);
  1255. }
  1256. // create the shape
  1257. return this.createElement('shape').attr(attr);
  1258. },
  1259. /**
  1260. * Create and return a circle element. In VML circles are implemented as
  1261. * shapes, which is faster than v:oval
  1262. *
  1263. * @function Highcharts.VMLRenderer#circle
  1264. * @param {number|Highcharts.Dictionary<number>} x
  1265. * @param {number} [y]
  1266. * @param {number} [r]
  1267. * @return {Highcharts.VMLElement}
  1268. */
  1269. circle: function (x, y, r) {
  1270. var circle = this.symbol('circle');
  1271. if (isObject(x)) {
  1272. r = x.r;
  1273. y = x.y;
  1274. x = x.x;
  1275. }
  1276. circle.isCircle = true; // Causes x and y to mean center (#1682)
  1277. circle.r = r;
  1278. return circle.attr({ x: x, y: y });
  1279. },
  1280. /**
  1281. * Create a group using an outer div and an inner v:group to allow
  1282. * rotating and flipping. A simple v:group would have problems with
  1283. * positioning child HTML elements and CSS clip.
  1284. *
  1285. * @function Highcharts.VMLRenderer#g
  1286. *
  1287. * @param {string} name
  1288. * The name of the group
  1289. *
  1290. * @return {Highcharts.VMLElement}
  1291. */
  1292. g: function (name) {
  1293. var wrapper,
  1294. attribs;
  1295. // set the class name
  1296. if (name) {
  1297. attribs = {
  1298. 'className': 'highcharts-' + name,
  1299. 'class': 'highcharts-' + name
  1300. };
  1301. }
  1302. // the div to hold HTML and clipping
  1303. wrapper = this.createElement('div').attr(attribs);
  1304. return wrapper;
  1305. },
  1306. /**
  1307. * VML override to create a regular HTML image.
  1308. *
  1309. * @function Highcharts.VMLRenderer#image
  1310. *
  1311. * @param {string} src
  1312. *
  1313. * @param {number} x
  1314. *
  1315. * @param {number} y
  1316. *
  1317. * @param {number} width
  1318. *
  1319. * @param {number} height
  1320. * @return {Highcharts.VMLElement}
  1321. */
  1322. image: function (src, x, y, width, height) {
  1323. var obj = this.createElement('img').attr({ src: src });
  1324. if (arguments.length > 1) {
  1325. obj.attr({
  1326. x: x,
  1327. y: y,
  1328. width: width,
  1329. height: height
  1330. });
  1331. }
  1332. return obj;
  1333. },
  1334. /**
  1335. * For rectangles, VML uses a shape for rect to overcome bugs and
  1336. * rotation problems
  1337. *
  1338. * @function Highcharts.VMLRenderer#createElement
  1339. * @param {string} nodeName
  1340. * @return {Highcharts.VMLElement}
  1341. */
  1342. createElement: function (nodeName) {
  1343. return nodeName === 'rect' ?
  1344. this.symbol(nodeName) :
  1345. SVGRenderer.prototype.createElement.call(this, nodeName);
  1346. },
  1347. /**
  1348. * In the VML renderer, each child of an inverted div (group) is
  1349. * inverted
  1350. *
  1351. * @function Highcharts.VMLRenderer#invertChild
  1352. *
  1353. * @param {Highcharts.HTMLDOMElement} element
  1354. *
  1355. * @param {Highcharts.HTMLDOMElement} parentNode
  1356. */
  1357. invertChild: function (element, parentNode) {
  1358. var ren = this,
  1359. parentStyle = parentNode.style,
  1360. imgStyle = element.tagName === 'IMG' && element.style; // #1111
  1361. css(element, {
  1362. flip: 'x',
  1363. left: (pInt(parentStyle.width) -
  1364. (imgStyle ? pInt(imgStyle.top) : 1)) + 'px',
  1365. top: (pInt(parentStyle.height) -
  1366. (imgStyle ? pInt(imgStyle.left) : 1)) + 'px',
  1367. rotation: -90
  1368. });
  1369. // Recursively invert child elements, needed for nested composite
  1370. // shapes like box plots and error bars. #1680, #1806.
  1371. [].forEach.call(element.childNodes, function (child) {
  1372. ren.invertChild(child, element);
  1373. });
  1374. },
  1375. /**
  1376. * Symbol definitions that override the parent SVG renderer's symbols
  1377. *
  1378. * @name Highcharts.VMLRenderer#symbols
  1379. * @type {Highcharts.Dictionary<Function>}
  1380. */
  1381. symbols: {
  1382. // VML specific arc function
  1383. arc: function (x, y, w, h, options) {
  1384. var start = options.start,
  1385. end = options.end,
  1386. radius = options.r || w || h,
  1387. innerRadius = options.innerR,
  1388. cosStart = Math.cos(start),
  1389. sinStart = Math.sin(start),
  1390. cosEnd = Math.cos(end),
  1391. sinEnd = Math.sin(end),
  1392. ret;
  1393. if (end - start === 0) { // no angle, don't show it.
  1394. return ['x'];
  1395. }
  1396. ret = [
  1397. 'wa',
  1398. x - radius,
  1399. y - radius,
  1400. x + radius,
  1401. y + radius,
  1402. x + radius * cosStart,
  1403. y + radius * sinStart,
  1404. x + radius * cosEnd,
  1405. y + radius * sinEnd // end y
  1406. ];
  1407. if (options.open && !innerRadius) {
  1408. ret.push('e', 'M', x, // - innerRadius,
  1409. y // - innerRadius
  1410. );
  1411. }
  1412. ret.push('at', // anti clockwise arc to
  1413. x - innerRadius, // left
  1414. y - innerRadius, // top
  1415. x + innerRadius, // right
  1416. y + innerRadius, // bottom
  1417. x + innerRadius * cosEnd, // start x
  1418. y + innerRadius * sinEnd, // start y
  1419. x + innerRadius * cosStart, // end x
  1420. y + innerRadius * sinStart, // end y
  1421. 'x', // finish path
  1422. 'e' // close
  1423. );
  1424. ret.isArc = true;
  1425. return ret;
  1426. },
  1427. // Add circle symbol path. This performs significantly faster than
  1428. // v:oval.
  1429. circle: function (x, y, w, h, wrapper) {
  1430. if (wrapper && defined(wrapper.r)) {
  1431. w = h = 2 * wrapper.r;
  1432. }
  1433. // Center correction, #1682
  1434. if (wrapper && wrapper.isCircle) {
  1435. x -= w / 2;
  1436. y -= h / 2;
  1437. }
  1438. // Return the path
  1439. return [
  1440. 'wa',
  1441. x,
  1442. y,
  1443. x + w,
  1444. y + h,
  1445. x + w,
  1446. y + h / 2,
  1447. x + w,
  1448. y + h / 2,
  1449. 'e' // close
  1450. ];
  1451. },
  1452. /**
  1453. * Add rectangle symbol path which eases rotation and omits arcsize
  1454. * problems compared to the built-in VML roundrect shape. When
  1455. * borders are not rounded, use the simpler square path, else use
  1456. * the callout path without the arrow.
  1457. */
  1458. rect: function (x, y, w, h, options) {
  1459. return SVGRenderer.prototype.symbols[!defined(options) || !options.r ? 'square' : 'callout'].call(0, x, y, w, h, options);
  1460. }
  1461. }
  1462. };
  1463. H.VMLRenderer = VMLRenderer = function () {
  1464. this.init.apply(this, arguments);
  1465. };
  1466. extend(VMLRenderer.prototype, SVGRenderer.prototype);
  1467. extend(VMLRenderer.prototype, VMLRendererExtension);
  1468. // general renderer
  1469. RendererRegistry.registerRendererType('VMLRenderer', VMLRenderer, true);
  1470. // 3D additions
  1471. VMLRenderer3D.compose(VMLRenderer, SVGRenderer);
  1472. }
  1473. SVGRenderer.prototype.getSpanWidth = function (wrapper, tspan) {
  1474. var renderer = this,
  1475. bBox = wrapper.getBBox(true),
  1476. actualWidth = bBox.width;
  1477. // Old IE cannot measure the actualWidth for SVG elements (#2314)
  1478. if (!svg && renderer.forExport) {
  1479. actualWidth = renderer.measureSpanWidth(tspan.firstChild.data, wrapper.styles);
  1480. }
  1481. return actualWidth;
  1482. };
  1483. // This method is used with exporting in old IE, when emulating SVG (see #2314)
  1484. SVGRenderer.prototype.measureSpanWidth = function (text, styles) {
  1485. var measuringSpan = doc.createElement('span'),
  1486. offsetWidth,
  1487. textNode = doc.createTextNode(text);
  1488. measuringSpan.appendChild(textNode);
  1489. css(measuringSpan, styles);
  1490. this.box.appendChild(measuringSpan);
  1491. offsetWidth = measuringSpan.offsetWidth;
  1492. discardElement(measuringSpan); // #2463
  1493. return offsetWidth;
  1494. };
  1495. });
  1496. _registerModule(_modules, 'masters/modules/oldie.src.js', [], function () {
  1497. });
  1498. }));