highcharts-3d.src.js 36 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352
  1. // ==ClosureCompiler==
  2. // @compilation_level SIMPLE_OPTIMIZATIONS
  3. /**
  4. * @license Highcharts JS v4.0.3 (2014-07-03)
  5. *
  6. * (c) 2009-2013 Torstein Hønsi
  7. *
  8. * License: www.highcharts.com/license
  9. */
  10. // JSLint options:
  11. /*global Highcharts, HighchartsAdapter, document, window, navigator, setInterval, clearInterval, clearTimeout, setTimeout, location, jQuery, $, console */
  12. (function (Highcharts) {
  13. /**
  14. Shorthands for often used function
  15. */
  16. /**
  17. * Mathematical Functionility
  18. */
  19. var PI = Math.PI,
  20. deg2rad = (PI / 180), // degrees to radians
  21. sin = Math.sin,
  22. cos = Math.cos,
  23. round = Math.round;
  24. function perspective(points, angle2, angle1, origin) {
  25. angle1 *= deg2rad;
  26. angle2 *= deg2rad;
  27. var result = [],
  28. xe,
  29. ye,
  30. ze;
  31. angle1 *= -1;
  32. xe = origin.x;
  33. ye = origin.y;
  34. ze = (origin.z === 0 ? 0.0001 : origin.z) * (origin.vd || 25);
  35. // some kind of minimum?
  36. ze = Math.max(500, ze);
  37. var s1 = sin(angle1),
  38. c1 = cos(angle1),
  39. s2 = sin(angle2),
  40. c2 = cos(angle2);
  41. var x, y, z, p;
  42. Highcharts.each(points, function (point) {
  43. x = point.x - xe;
  44. y = point.y - ye;
  45. z = point.z || 0;
  46. p = {
  47. x: c1 * x - s1 * z,
  48. y: -s1 * s2 * x - c1 * s2 * z + c2 * y,
  49. z: s1 * c2 * x + c1 * c2 * z + s2 * y
  50. };
  51. p.x = p.x * ((ze - p.z) / ze) + xe;
  52. p.y = p.y * ((ze - p.z) / ze) + ye;
  53. result.push({x: round(p.x), y: round(p.y), z: round(p.z)});
  54. });
  55. return result;
  56. }
  57. /***
  58. EXTENSION TO THE SVG-RENDERER TO ENABLE 3D SHAPES
  59. ***/
  60. ////// HELPER METHODS //////
  61. var dFactor = (4 * (Math.sqrt(2) - 1) / 3) / (PI / 2);
  62. function curveTo(cx, cy, rx, ry, start, end, dx, dy) {
  63. var result = [];
  64. if ((end > start) && (end - start > PI / 2 + 0.0001)) {
  65. result = result.concat(curveTo(cx, cy, rx, ry, start, start + (PI / 2), dx, dy));
  66. result = result.concat(curveTo(cx, cy, rx, ry, start + (PI / 2), end, dx, dy));
  67. return result;
  68. } else if ((end < start) && (start - end > PI / 2 + 0.0001)) {
  69. result = result.concat(curveTo(cx, cy, rx, ry, start, start - (PI / 2), dx, dy));
  70. result = result.concat(curveTo(cx, cy, rx, ry, start - (PI / 2), end, dx, dy));
  71. return result;
  72. } else {
  73. var arcAngle = end - start;
  74. return [
  75. 'C',
  76. cx + (rx * cos(start)) - ((rx * dFactor * arcAngle) * sin(start)) + dx,
  77. cy + (ry * sin(start)) + ((ry * dFactor * arcAngle) * cos(start)) + dy,
  78. cx + (rx * cos(end)) + ((rx * dFactor * arcAngle) * sin(end)) + dx,
  79. cy + (ry * sin(end)) - ((ry * dFactor * arcAngle) * cos(end)) + dy,
  80. cx + (rx * cos(end)) + dx,
  81. cy + (ry * sin(end)) + dy
  82. ];
  83. }
  84. }
  85. Highcharts.SVGRenderer.prototype.toLinePath = function (points, closed) {
  86. var result = [];
  87. // Put "L x y" for each point
  88. Highcharts.each(points, function (point) {
  89. result.push('L', point.x, point.y);
  90. });
  91. // Set the first element to M
  92. result[0] = 'M';
  93. // If it is a closed line, add Z
  94. if (closed) {
  95. result.push('Z');
  96. }
  97. return result;
  98. };
  99. ////// CUBOIDS //////
  100. Highcharts.SVGRenderer.prototype.cuboid = function (shapeArgs) {
  101. var result = this.g(),
  102. paths = this.cuboidPath(shapeArgs);
  103. result.front = this.path(paths[0]).attr({zIndex: paths[3], 'stroke-linejoin': 'round'}).add(result);
  104. result.top = this.path(paths[1]).attr({zIndex: paths[4], 'stroke-linejoin': 'round'}).add(result);
  105. result.side = this.path(paths[2]).attr({zIndex: paths[5], 'stroke-linejoin': 'round'}).add(result);
  106. result.fillSetter = function (color) {
  107. var c0 = color,
  108. c1 = Highcharts.Color(color).brighten(0.1).get(),
  109. c2 = Highcharts.Color(color).brighten(-0.1).get();
  110. this.front.attr({fill: c0});
  111. this.top.attr({fill: c1});
  112. this.side.attr({fill: c2});
  113. this.color = color;
  114. return this;
  115. };
  116. result.opacitySetter = function (opacity) {
  117. this.front.attr({opacity: opacity});
  118. this.top.attr({opacity: opacity});
  119. this.side.attr({opacity: opacity});
  120. return this;
  121. };
  122. result.attr = function (args) {
  123. if (args.shapeArgs || args.x) {
  124. var shapeArgs = args.shapeArgs || args;
  125. var paths = this.renderer.cuboidPath(shapeArgs);
  126. this.front.attr({d: paths[0], zIndex: paths[3]});
  127. this.top.attr({d: paths[1], zIndex: paths[4]});
  128. this.side.attr({d: paths[2], zIndex: paths[5]});
  129. } else {
  130. Highcharts.SVGElement.prototype.attr.call(this, args);
  131. }
  132. return this;
  133. };
  134. result.animate = function (args, duration, complete) {
  135. if (args.x && args.y) {
  136. var paths = this.renderer.cuboidPath(args);
  137. this.front.attr({zIndex: paths[3]}).animate({d: paths[0]}, duration, complete);
  138. this.top.attr({zIndex: paths[4]}).animate({d: paths[1]}, duration, complete);
  139. this.side.attr({zIndex: paths[5]}).animate({d: paths[2]}, duration, complete);
  140. } else if (args.opacity) {
  141. this.front.animate(args, duration, complete);
  142. this.top.animate(args, duration, complete);
  143. this.side.animate(args, duration, complete);
  144. } else {
  145. Highcharts.SVGElement.prototype.animate.call(this, args, duration, complete);
  146. }
  147. return this;
  148. };
  149. result.destroy = function () {
  150. this.front.destroy();
  151. this.top.destroy();
  152. this.side.destroy();
  153. return null;
  154. };
  155. // Apply the Z index to the cuboid group
  156. result.attr({ zIndex: -paths[3] });
  157. return result;
  158. };
  159. Highcharts.SVGRenderer.prototype.cuboidPath = function (shapeArgs) {
  160. var x = shapeArgs.x,
  161. y = shapeArgs.y,
  162. z = shapeArgs.z,
  163. h = shapeArgs.height,
  164. w = shapeArgs.width,
  165. d = shapeArgs.depth,
  166. alpha = shapeArgs.alpha,
  167. beta = shapeArgs.beta,
  168. origin = shapeArgs.origin;
  169. var pArr = [
  170. {x: x, y: y, z: z},
  171. {x: x + w, y: y, z: z},
  172. {x: x + w, y: y + h, z: z},
  173. {x: x, y: y + h, z: z},
  174. {x: x, y: y + h, z: z + d},
  175. {x: x + w, y: y + h, z: z + d},
  176. {x: x + w, y: y, z: z + d},
  177. {x: x, y: y, z: z + d}
  178. ];
  179. pArr = perspective(pArr, alpha, beta, origin);
  180. var path1, // FRONT
  181. path2, // TOP OR BOTTOM
  182. path3; // LEFT OR RIGHT
  183. // front
  184. path1 = [
  185. 'M', pArr[0].x, pArr[0].y,
  186. 'L', pArr[1].x, pArr[1].y,
  187. 'L', pArr[2].x, pArr[2].y,
  188. 'L', pArr[3].x, pArr[3].y,
  189. 'Z'
  190. ];
  191. var z1 = (pArr[0].z + pArr[1].z + pArr[2].z + pArr[3].z) / 4;
  192. // top or bottom
  193. var top = [
  194. 'M', pArr[0].x, pArr[0].y,
  195. 'L', pArr[7].x, pArr[7].y,
  196. 'L', pArr[6].x, pArr[6].y,
  197. 'L', pArr[1].x, pArr[1].y,
  198. 'Z'
  199. ];
  200. var bottom = [
  201. 'M', pArr[3].x, pArr[3].y,
  202. 'L', pArr[2].x, pArr[2].y,
  203. 'L', pArr[5].x, pArr[5].y,
  204. 'L', pArr[4].x, pArr[4].y,
  205. 'Z'
  206. ];
  207. if (pArr[7].y < pArr[1].y) {
  208. path2 = top;
  209. } else if (pArr[4].y > pArr[2].y) {
  210. path2 = bottom;
  211. } else {
  212. path2 = [];
  213. }
  214. var z2 = (beta > 0 ? (pArr[0].z + pArr[7].z + pArr[6].z + pArr[1].z) / 4 : (pArr[3].z + pArr[2].z + pArr[5].z + pArr[4].z) / 4);
  215. // side
  216. var right = [
  217. 'M', pArr[1].x, pArr[1].y,
  218. 'L', pArr[2].x, pArr[2].y,
  219. 'L', pArr[5].x, pArr[5].y,
  220. 'L', pArr[6].x, pArr[6].y,
  221. 'Z'
  222. ];
  223. var left = [
  224. 'M', pArr[0].x, pArr[0].y,
  225. 'L', pArr[7].x, pArr[7].y,
  226. 'L', pArr[4].x, pArr[4].y,
  227. 'L', pArr[3].x, pArr[3].y,
  228. 'Z'
  229. ];
  230. if (pArr[6].x > pArr[1].x) {
  231. path3 = right;
  232. } else if (pArr[7].x < pArr[0].x) {
  233. path3 = left;
  234. } else {
  235. path3 = [];
  236. }
  237. var z3 = (alpha > 0 ? (pArr[1].z + pArr[2].z + pArr[5].z + pArr[6].z) / 4 : (pArr[0].z + pArr[7].z + pArr[4].z + pArr[3].z) / 4);
  238. return [path1, path2, path3, z1, z2, z3];
  239. };
  240. ////// SECTORS //////
  241. Highcharts.SVGRenderer.prototype.arc3d = function (shapeArgs) {
  242. shapeArgs.alpha *= deg2rad;
  243. shapeArgs.beta *= deg2rad;
  244. var result = this.g(),
  245. paths = this.arc3dPath(shapeArgs),
  246. renderer = result.renderer;
  247. var zIndex = paths.zTop * 100;
  248. result.shapeArgs = shapeArgs; // Store for later use
  249. result.top = renderer.path(paths.top).attr({zIndex: paths.zTop}).add(result);
  250. result.side1 = renderer.path(paths.side2).attr({zIndex: paths.zSide2});
  251. result.side2 = renderer.path(paths.side1).attr({zIndex: paths.zSide1});
  252. result.inn = renderer.path(paths.inn).attr({zIndex: paths.zInn});
  253. result.out = renderer.path(paths.out).attr({zIndex: paths.zOut});
  254. result.fillSetter = function (color) {
  255. this.color = color;
  256. var c0 = color,
  257. c2 = Highcharts.Color(color).brighten(-0.1).get();
  258. this.side1.attr({fill: c2});
  259. this.side2.attr({fill: c2});
  260. this.inn.attr({fill: c2});
  261. this.out.attr({fill: c2});
  262. this.top.attr({fill: c0});
  263. return this;
  264. };
  265. result.translateXSetter = function (value) {
  266. this.out.attr({translateX: value});
  267. this.inn.attr({translateX: value});
  268. this.side1.attr({translateX: value});
  269. this.side2.attr({translateX: value});
  270. this.top.attr({translateX: value});
  271. };
  272. result.translateYSetter = function (value) {
  273. this.out.attr({translateY: value});
  274. this.inn.attr({translateY: value});
  275. this.side1.attr({translateY: value});
  276. this.side2.attr({translateY: value});
  277. this.top.attr({translateY: value});
  278. };
  279. result.animate = function (args, duration, complete) {
  280. if (args.end || args.start) {
  281. this._shapeArgs = this.shapeArgs;
  282. Highcharts.SVGElement.prototype.animate.call(this, {
  283. _args: args
  284. }, {
  285. duration: duration,
  286. step: function () {
  287. var args = arguments,
  288. fx = args[1],
  289. result = fx.elem,
  290. start = result._shapeArgs,
  291. end = fx.end,
  292. pos = fx.pos,
  293. sA = Highcharts.merge(start, {
  294. start: start.start + ((end.start - start.start) * pos),
  295. end: start.end + ((end.end - start.end) * pos)
  296. });
  297. var paths = result.renderer.arc3dPath(sA);
  298. result.shapeArgs = sA;
  299. result.top.attr({d: paths.top, zIndex: paths.zTop});
  300. result.inn.attr({d: paths.inn, zIndex: paths.zInn});
  301. result.out.attr({d: paths.out, zIndex: paths.zOut});
  302. result.side1.attr({d: paths.side1, zIndex: paths.zSide1});
  303. result.side2.attr({d: paths.side2, zIndex: paths.zSide2});
  304. }
  305. }, complete);
  306. } else {
  307. Highcharts.SVGElement.prototype.animate.call(this, args, duration, complete);
  308. }
  309. return this;
  310. };
  311. result.destroy = function () {
  312. this.top.destroy();
  313. this.out.destroy();
  314. this.inn.destroy();
  315. this.side1.destroy();
  316. this.side2.destroy();
  317. Highcharts.SVGElement.prototype.destroy.call(this);
  318. };
  319. result.hide = function () {
  320. this.top.hide();
  321. this.out.hide();
  322. this.inn.hide();
  323. this.side1.hide();
  324. this.side2.hide();
  325. };
  326. result.show = function () {
  327. this.top.show();
  328. this.out.show();
  329. this.inn.show();
  330. this.side1.show();
  331. this.side2.show();
  332. };
  333. result.zIndex = zIndex;
  334. result.attr({zIndex: zIndex});
  335. return result;
  336. };
  337. Highcharts.SVGRenderer.prototype.arc3dPath = function (shapeArgs) {
  338. var cx = shapeArgs.x,
  339. cy = shapeArgs.y,
  340. start = shapeArgs.start,
  341. end = shapeArgs.end - 0.00001,
  342. r = shapeArgs.r,
  343. ir = shapeArgs.innerR,
  344. d = shapeArgs.depth,
  345. alpha = shapeArgs.alpha,
  346. beta = shapeArgs.beta;
  347. // Some Variables
  348. var cs = cos(start),
  349. ss = sin(start),
  350. ce = cos(end),
  351. se = sin(end),
  352. rx = r * cos(beta),
  353. ry = r * cos(alpha),
  354. irx = ir * cos(beta),
  355. iry = ir * cos(alpha),
  356. dx = d * sin(beta),
  357. dy = d * sin(alpha);
  358. // TOP
  359. var top = ['M', cx + (rx * cs), cy + (ry * ss)];
  360. top = top.concat(curveTo(cx, cy, rx, ry, start, end, 0, 0));
  361. top = top.concat([
  362. 'L', cx + (irx * ce), cy + (iry * se)
  363. ]);
  364. top = top.concat(curveTo(cx, cy, irx, iry, end, start, 0, 0));
  365. top = top.concat(['Z']);
  366. // OUTSIDE
  367. var b = (beta > 0 ? PI / 2 : 0),
  368. a = (alpha > 0 ? 0 : PI / 2);
  369. var start2 = start > -b ? start : (end > -b ? -b : start),
  370. end2 = end < PI - a ? end : (start < PI - a ? PI - a : end);
  371. var out = ['M', cx + (rx * cos(start2)), cy + (ry * sin(start2))];
  372. out = out.concat(curveTo(cx, cy, rx, ry, start2, end2, 0, 0));
  373. out = out.concat([
  374. 'L', cx + (rx * cos(end2)) + dx, cy + (ry * sin(end2)) + dy
  375. ]);
  376. out = out.concat(curveTo(cx, cy, rx, ry, end2, start2, dx, dy));
  377. out = out.concat(['Z']);
  378. // INSIDE
  379. var inn = ['M', cx + (irx * cs), cy + (iry * ss)];
  380. inn = inn.concat(curveTo(cx, cy, irx, iry, start, end, 0, 0));
  381. inn = inn.concat([
  382. 'L', cx + (irx * cos(end)) + dx, cy + (iry * sin(end)) + dy
  383. ]);
  384. inn = inn.concat(curveTo(cx, cy, irx, iry, end, start, dx, dy));
  385. inn = inn.concat(['Z']);
  386. // SIDES
  387. var side1 = [
  388. 'M', cx + (rx * cs), cy + (ry * ss),
  389. 'L', cx + (rx * cs) + dx, cy + (ry * ss) + dy,
  390. 'L', cx + (irx * cs) + dx, cy + (iry * ss) + dy,
  391. 'L', cx + (irx * cs), cy + (iry * ss),
  392. 'Z'
  393. ];
  394. var side2 = [
  395. 'M', cx + (rx * ce), cy + (ry * se),
  396. 'L', cx + (rx * ce) + dx, cy + (ry * se) + dy,
  397. 'L', cx + (irx * ce) + dx, cy + (iry * se) + dy,
  398. 'L', cx + (irx * ce), cy + (iry * se),
  399. 'Z'
  400. ];
  401. var a1 = sin((start + end) / 2),
  402. a2 = sin(start),
  403. a3 = sin(end);
  404. return {
  405. top: top,
  406. zTop: r,
  407. out: out,
  408. zOut: Math.max(a1, a2, a3) * r,
  409. inn: inn,
  410. zInn: Math.max(a1, a2, a3) * r,
  411. side1: side1,
  412. zSide1: a2 * (r * 0.99),
  413. side2: side2,
  414. zSide2: a3 * (r * 0.99)
  415. };
  416. };
  417. /***
  418. EXTENSION FOR 3D CHARTS
  419. ***/
  420. // Shorthand to check the is3d flag
  421. Highcharts.Chart.prototype.is3d = function () {
  422. return this.options.chart.options3d && this.options.chart.options3d.enabled;
  423. };
  424. Highcharts.wrap(Highcharts.Chart.prototype, 'isInsidePlot', function (proceed) {
  425. if (this.is3d()) {
  426. return true;
  427. } else {
  428. return proceed.apply(this, [].slice.call(arguments, 1));
  429. }
  430. });
  431. var defaultChartOptions = Highcharts.getOptions();
  432. defaultChartOptions.chart.options3d = {
  433. enabled: false,
  434. alpha: 0,
  435. beta: 0,
  436. depth: 100,
  437. viewDistance: 25,
  438. frame: {
  439. bottom: { size: 1, color: 'rgba(255,255,255,0)' },
  440. side: { size: 1, color: 'rgba(255,255,255,0)' },
  441. back: { size: 1, color: 'rgba(255,255,255,0)' }
  442. }
  443. };
  444. defaultChartOptions.plotOptions.pie.borderColor = undefined;
  445. Highcharts.wrap(Highcharts.Chart.prototype, 'setChartSize', function (proceed) {
  446. proceed.apply(this, [].slice.call(arguments, 1));
  447. if (this.is3d()) {
  448. var inverted = this.inverted,
  449. clipBox = this.clipBox,
  450. margin = this.margin,
  451. x = inverted ? 'y' : 'x',
  452. y = inverted ? 'x' : 'y',
  453. w = inverted ? 'height' : 'width',
  454. h = inverted ? 'width' : 'height';
  455. clipBox[x] = -(margin[3] || 0);
  456. clipBox[y] = -(margin[0] || 0);
  457. clipBox[w] = this.chartWidth + (margin[3] || 0) + (margin[1] || 0);
  458. clipBox[h] = this.chartHeight + (margin[0] || 0) + (margin[2] || 0);
  459. }
  460. });
  461. Highcharts.wrap(Highcharts.Chart.prototype, 'redraw', function (proceed) {
  462. if (this.is3d()) {
  463. // Set to force a redraw of all elements
  464. this.isDirtyBox = true;
  465. }
  466. proceed.apply(this, [].slice.call(arguments, 1));
  467. });
  468. Highcharts.Chart.prototype.retrieveStacks = function (grouping, stacking) {
  469. var stacks = {},
  470. i = 1;
  471. if (grouping || !stacking) { return this.series; }
  472. Highcharts.each(this.series, function (S) {
  473. if (!stacks[S.options.stack || 0]) {
  474. stacks[S.options.stack || 0] = { series: [S], position: i};
  475. i++;
  476. } else {
  477. stacks[S.options.stack || 0].series.push(S);
  478. }
  479. });
  480. stacks.totalStacks = i + 1;
  481. return stacks;
  482. };
  483. /***
  484. EXTENSION TO THE AXIS
  485. ***/
  486. Highcharts.wrap(Highcharts.Axis.prototype, 'init', function (proceed) {
  487. var args = arguments;
  488. if (args[1].is3d()) {
  489. args[2].tickWidth = Highcharts.pick(args[2].tickWidth, 0);
  490. args[2].gridLineWidth = Highcharts.pick(args[2].gridLineWidth, 1);
  491. }
  492. proceed.apply(this, [].slice.call(arguments, 1));
  493. });
  494. Highcharts.wrap(Highcharts.Axis.prototype, 'render', function (proceed) {
  495. proceed.apply(this, [].slice.call(arguments, 1));
  496. // Do not do this if the chart is not 3D
  497. if (!this.chart.is3d()) {
  498. return;
  499. }
  500. var chart = this.chart,
  501. renderer = chart.renderer,
  502. options3d = chart.options.chart.options3d,
  503. alpha = options3d.alpha,
  504. beta = options3d.beta * (chart.yAxis[0].opposite ? -1 : 1),
  505. frame = options3d.frame,
  506. fbottom = frame.bottom,
  507. fback = frame.back,
  508. fside = frame.side,
  509. depth = options3d.depth,
  510. height = this.height,
  511. width = this.width,
  512. left = this.left,
  513. top = this.top;
  514. var origin = {
  515. x: chart.plotLeft + (chart.plotWidth / 2),
  516. y: chart.plotTop + (chart.plotHeight / 2),
  517. z: depth,
  518. vd: options3d.viewDistance
  519. };
  520. if (this.horiz) {
  521. /// BOTTOM
  522. if (this.axisLine) {
  523. this.axisLine.hide();
  524. }
  525. var bottomShape = {
  526. x: left,
  527. y: top + (chart.yAxis[0].reversed ? -fbottom.size : height),
  528. z: 0,
  529. width: width,
  530. height: fbottom.size,
  531. depth: depth,
  532. alpha: alpha,
  533. beta: beta,
  534. origin: origin
  535. };
  536. if (!this.bottomFrame) {
  537. this.bottomFrame = renderer.cuboid(bottomShape).attr({fill: fbottom.color, zIndex: (chart.yAxis[0].reversed && alpha > 0 ? 4 : -1)}).css({stroke: fbottom.color}).add();
  538. } else {
  539. this.bottomFrame.animate(bottomShape);
  540. }
  541. } else {
  542. // BACK
  543. var backShape = {
  544. x: left,
  545. y: top,
  546. z: depth + 1,
  547. width: width,
  548. height: height + fbottom.size,
  549. depth: fback.size,
  550. alpha: alpha,
  551. beta: beta,
  552. origin: origin
  553. };
  554. if (!this.backFrame) {
  555. this.backFrame = renderer.cuboid(backShape).attr({fill: fback.color, zIndex: -3}).css({stroke: fback.color}).add();
  556. } else {
  557. this.backFrame.animate(backShape);
  558. }
  559. // SIDE
  560. if (this.axisLine) {
  561. this.axisLine.hide();
  562. }
  563. var sideShape = {
  564. x: (chart.yAxis[0].opposite ? width : 0) + left - fside.size,
  565. y: top,
  566. z: 0,
  567. width: fside.size,
  568. height: height + fbottom.size,
  569. depth: depth + fback.size,
  570. alpha: alpha,
  571. beta: beta,
  572. origin: origin
  573. };
  574. if (!this.sideFrame) {
  575. this.sideFrame = renderer.cuboid(sideShape).attr({fill: fside.color, zIndex: -2}).css({stroke: fside.color}).add();
  576. } else {
  577. this.sideFrame.animate(sideShape);
  578. }
  579. }
  580. });
  581. Highcharts.wrap(Highcharts.Axis.prototype, 'getPlotLinePath', function (proceed) {
  582. var path = proceed.apply(this, [].slice.call(arguments, 1));
  583. // Do not do this if the chart is not 3D
  584. if (!this.chart.is3d()) {
  585. return path;
  586. }
  587. if (path === null) { return path; }
  588. var chart = this.chart,
  589. options3d = chart.options.chart.options3d;
  590. var d = options3d.depth;
  591. options3d.origin = {
  592. x: chart.plotLeft + (chart.plotWidth / 2),
  593. y: chart.plotTop + (chart.plotHeight / 2),
  594. z: d,
  595. vd: options3d.viewDistance
  596. };
  597. var pArr = [
  598. { x: path[1], y: path[2], z : (this.horiz || this.opposite ? d : 0)},
  599. { x: path[1], y: path[2], z : d },
  600. { x: path[4], y: path[5], z : d },
  601. { x: path[4], y: path[5], z : (this.horiz || this.opposite ? 0 : d)}
  602. ];
  603. var alpha = chart.options.inverted ? options3d.beta : options3d.alpha,
  604. beta = chart.options.inverted ? options3d.alpha : options3d.beta;
  605. beta *= (chart.yAxis[0].opposite ? -1 : 1);
  606. pArr = perspective(pArr, alpha, beta, options3d.origin);
  607. path = this.chart.renderer.toLinePath(pArr, false);
  608. return path;
  609. });
  610. Highcharts.wrap(Highcharts.Axis.prototype, 'getPlotBandPath', function (proceed) {
  611. // Do not do this if the chart is not 3D
  612. if (!this.chart.is3d()) {
  613. return proceed.apply(this, [].slice.call(arguments, 1));
  614. } else {
  615. var args = arguments,
  616. from = args[1],
  617. to = args[2];
  618. var toPath = this.getPlotLinePath(to),
  619. path = this.getPlotLinePath(from);
  620. if (path && toPath) {
  621. path.push(
  622. toPath[7], // These two do not exist in the regular getPlotLine
  623. toPath[8], // ---- # 3005
  624. toPath[4],
  625. toPath[5],
  626. toPath[1],
  627. toPath[2]
  628. );
  629. } else { // outside the axis area
  630. path = null;
  631. }
  632. return path;
  633. }
  634. });
  635. /***
  636. EXTENSION TO THE TICKS
  637. ***/
  638. Highcharts.wrap(Highcharts.Tick.prototype, 'getMarkPath', function (proceed) {
  639. var path = proceed.apply(this, [].slice.call(arguments, 1));
  640. // Do not do this if the chart is not 3D
  641. if (!this.axis.chart.is3d()) {
  642. return path;
  643. }
  644. var chart = this.axis.chart,
  645. options3d = chart.options.chart.options3d;
  646. var origin = {
  647. x: chart.plotLeft + (chart.plotWidth / 2),
  648. y: chart.plotTop + (chart.plotHeight / 2),
  649. z: options3d.depth,
  650. vd: options3d.viewDistance
  651. };
  652. var pArr = [
  653. {x: path[1], y: path[2], z: 0},
  654. {x: path[4], y: path[5], z: 0}
  655. ];
  656. var alpha = chart.inverted ? options3d.beta : options3d.alpha,
  657. beta = chart.inverted ? options3d.alpha : options3d.beta;
  658. beta *= (chart.yAxis[0].opposite ? -1 : 1);
  659. pArr = perspective(pArr, alpha, beta, origin);
  660. path = [
  661. 'M', pArr[0].x, pArr[0].y,
  662. 'L', pArr[1].x, pArr[1].y
  663. ];
  664. return path;
  665. });
  666. Highcharts.wrap(Highcharts.Tick.prototype, 'getLabelPosition', function (proceed) {
  667. var pos = proceed.apply(this, [].slice.call(arguments, 1));
  668. // Do not do this if the chart is not 3D
  669. if (!this.axis.chart.is3d()) {
  670. return pos;
  671. }
  672. var chart = this.axis.chart,
  673. options3d = chart.options.chart.options3d;
  674. var origin = {
  675. x: chart.plotLeft + (chart.plotWidth / 2),
  676. y: chart.plotTop + (chart.plotHeight / 2),
  677. z: options3d.depth,
  678. vd: options3d.viewDistance
  679. };
  680. var alpha = chart.inverted ? options3d.beta : options3d.alpha,
  681. beta = chart.inverted ? options3d.alpha : options3d.beta;
  682. beta *= (chart.yAxis[0].opposite ? -1 : 1);
  683. pos = perspective([{x: pos.x, y: pos.y, z: 0}], alpha, beta, origin)[0];
  684. return pos;
  685. });
  686. Highcharts.wrap(Highcharts.Axis.prototype, 'drawCrosshair', function (proceed) {
  687. var args = arguments;
  688. if (this.chart.is3d()) {
  689. if (args[2]) {
  690. args[2] = {
  691. plotX: args[2].plotXold || args[2].plotX,
  692. plotY: args[2].plotYold || args[2].plotY
  693. };
  694. }
  695. }
  696. proceed.apply(this, [].slice.call(args, 1));
  697. });/***
  698. EXTENSION FOR 3D COLUMNS
  699. ***/
  700. Highcharts.wrap(Highcharts.seriesTypes.column.prototype, 'translate', function (proceed) {
  701. proceed.apply(this, [].slice.call(arguments, 1));
  702. // Do not do this if the chart is not 3D
  703. if (!this.chart.is3d()) {
  704. return;
  705. }
  706. var series = this,
  707. chart = series.chart,
  708. options = chart.options,
  709. seriesOptions = series.options,
  710. options3d = options.chart.options3d,
  711. depth = seriesOptions.depth || 25,
  712. origin = {
  713. x: chart.plotWidth / 2,
  714. y: chart.plotHeight / 2,
  715. z: options3d.depth,
  716. vd: options3d.viewDistance
  717. },
  718. alpha = options3d.alpha,
  719. beta = options3d.beta * (chart.yAxis[0].opposite ? -1 : 1);
  720. var stack = seriesOptions.stacking ? (seriesOptions.stack || 0) : series._i;
  721. var z = stack * (depth + (seriesOptions.groupZPadding || 1));
  722. if (seriesOptions.grouping !== false) { z = 0; }
  723. z += (seriesOptions.groupZPadding || 1);
  724. Highcharts.each(series.data, function (point) {
  725. var shapeArgs = point.shapeArgs,
  726. tooltipPos = point.tooltipPos;
  727. point.shapeType = 'cuboid';
  728. shapeArgs.alpha = alpha;
  729. shapeArgs.beta = beta;
  730. shapeArgs.z = z;
  731. shapeArgs.origin = origin;
  732. shapeArgs.depth = depth;
  733. // Translate the tooltip position in 3d space
  734. tooltipPos = perspective([{ x: tooltipPos[0], y: tooltipPos[1], z: z }], alpha, beta, origin)[0];
  735. point.tooltipPos = [tooltipPos.x, tooltipPos.y];
  736. });
  737. });
  738. Highcharts.wrap(Highcharts.seriesTypes.column.prototype, 'animate', function (proceed) {
  739. if (!this.chart.is3d()) {
  740. proceed.apply(this, [].slice.call(arguments, 1));
  741. } else {
  742. var args = arguments,
  743. init = args[1],
  744. yAxis = this.yAxis,
  745. series = this,
  746. reversed = this.yAxis.reversed;
  747. if (Highcharts.svg) { // VML is too slow anyway
  748. if (init) {
  749. Highcharts.each(series.data, function (point) {
  750. point.height = point.shapeArgs.height;
  751. point.shapey = point.shapeArgs.y; //#2968
  752. point.shapeArgs.height = 1;
  753. if (!reversed) {
  754. if (point.stackY) {
  755. point.shapeArgs.y = point.plotY + yAxis.translate(point.stackY);
  756. } else {
  757. point.shapeArgs.y = point.plotY + (point.negative ? -point.height : point.height);
  758. }
  759. }
  760. });
  761. } else { // run the animation
  762. Highcharts.each(series.data, function (point) {
  763. point.shapeArgs.height = point.height;
  764. point.shapeArgs.y = point.shapey; //#2968
  765. // null value do not have a graphic
  766. if (point.graphic) {
  767. point.graphic.animate(point.shapeArgs, series.options.animation);
  768. }
  769. });
  770. // redraw datalabels to the correct position
  771. this.drawDataLabels();
  772. // delete this function to allow it only once
  773. series.animate = null;
  774. }
  775. }
  776. }
  777. });
  778. Highcharts.wrap(Highcharts.seriesTypes.column.prototype, 'init', function (proceed) {
  779. proceed.apply(this, [].slice.call(arguments, 1));
  780. if (this.chart.is3d()) {
  781. var seriesOptions = this.options,
  782. grouping = seriesOptions.grouping,
  783. stacking = seriesOptions.stacking,
  784. z = 0;
  785. if (!(grouping !== undefined && !grouping) && stacking) {
  786. var stacks = this.chart.retrieveStacks(grouping, stacking),
  787. stack = seriesOptions.stack || 0,
  788. i; // position within the stack
  789. for (i = 0; i < stacks[stack].series.length; i++) {
  790. if (stacks[stack].series[i] === this) {
  791. break;
  792. }
  793. }
  794. z = (stacks.totalStacks * 10) - (10 * (stacks.totalStacks - stacks[stack].position)) - i;
  795. }
  796. seriesOptions.zIndex = z;
  797. }
  798. });
  799. function draw3DPoints(proceed) {
  800. // Do not do this if the chart is not 3D
  801. if (this.chart.is3d()) {
  802. var grouping = this.chart.options.plotOptions.column.grouping;
  803. if (grouping !== undefined && !grouping && this.group.zIndex !== undefined) {
  804. this.group.attr({zIndex : (this.group.zIndex * 10)});
  805. }
  806. var options = this.options,
  807. states = this.options.states;
  808. this.borderWidth = options.borderWidth = options.edgeWidth || 1;
  809. Highcharts.each(this.data, function (point) {
  810. var pointAttr = point.pointAttr;
  811. // Set the border color to the fill color to provide a smooth edge
  812. this.borderColor = Highcharts.pick(options.edgeColor, pointAttr[''].fill);
  813. pointAttr[''].stroke = this.borderColor;
  814. pointAttr.hover.stroke = Highcharts.pick(states.hover.edgeColor, this.borderColor);
  815. pointAttr.select.stroke = Highcharts.pick(states.select.edgeColor, this.borderColor);
  816. });
  817. }
  818. proceed.apply(this, [].slice.call(arguments, 1));
  819. }
  820. Highcharts.wrap(Highcharts.Series.prototype, 'alignDataLabel', function (proceed) {
  821. // Only do this for 3D columns and columnranges
  822. if (this.chart.is3d() && (this.type === 'column' || this.type === 'columnrange')) {
  823. var series = this,
  824. chart = series.chart,
  825. options = chart.options,
  826. options3d = options.chart.options3d,
  827. origin = {
  828. x: chart.plotWidth / 2,
  829. y: chart.plotHeight / 2,
  830. z: options3d.depth,
  831. vd: options3d.viewDistance
  832. },
  833. alpha = options3d.alpha,
  834. beta = options3d.beta * (chart.yAxis[0].opposite ? -1 : 1);
  835. var args = arguments,
  836. alignTo = args[4];
  837. var pos = ({x: alignTo.x, y: alignTo.y, z: 0});
  838. pos = perspective([pos], alpha, beta, origin)[0];
  839. alignTo.x = pos.x;
  840. alignTo.y = pos.y;
  841. }
  842. proceed.apply(this, [].slice.call(arguments, 1));
  843. });
  844. if (Highcharts.seriesTypes.columnrange) {
  845. Highcharts.wrap(Highcharts.seriesTypes.columnrange.prototype, 'drawPoints', draw3DPoints);
  846. }
  847. Highcharts.wrap(Highcharts.seriesTypes.column.prototype, 'drawPoints', draw3DPoints);
  848. /***
  849. EXTENSION FOR 3D CYLINDRICAL COLUMNS
  850. Not supported
  851. ***/
  852. var defaultOptions = Highcharts.getOptions();
  853. defaultOptions.plotOptions.cylinder = Highcharts.merge(defaultOptions.plotOptions.column);
  854. var CylinderSeries = Highcharts.extendClass(Highcharts.seriesTypes.column, {
  855. type: 'cylinder'
  856. });
  857. Highcharts.seriesTypes.cylinder = CylinderSeries;
  858. Highcharts.wrap(Highcharts.seriesTypes.cylinder.prototype, 'translate', function (proceed) {
  859. proceed.apply(this, [].slice.call(arguments, 1));
  860. // Do not do this if the chart is not 3D
  861. if (!this.chart.is3d()) {
  862. return;
  863. }
  864. var series = this,
  865. chart = series.chart,
  866. options = chart.options,
  867. cylOptions = options.plotOptions.cylinder,
  868. options3d = options.chart.options3d,
  869. depth = cylOptions.depth || 0,
  870. origin = {
  871. x: chart.inverted ? chart.plotHeight / 2 : chart.plotWidth / 2,
  872. y: chart.inverted ? chart.plotWidth / 2 : chart.plotHeight / 2,
  873. z: options3d.depth,
  874. vd: options3d.viewDistance
  875. },
  876. alpha = options3d.alpha;
  877. var z = cylOptions.stacking ? (this.options.stack || 0) * depth : series._i * depth;
  878. z += depth / 2;
  879. if (cylOptions.grouping !== false) { z = 0; }
  880. Highcharts.each(series.data, function (point) {
  881. var shapeArgs = point.shapeArgs;
  882. point.shapeType = 'arc3d';
  883. shapeArgs.x += depth / 2;
  884. shapeArgs.z = z;
  885. shapeArgs.start = 0;
  886. shapeArgs.end = 2 * PI;
  887. shapeArgs.r = depth * 0.95;
  888. shapeArgs.innerR = 0;
  889. shapeArgs.depth = shapeArgs.height * (1 / sin((90 - alpha) * deg2rad)) - z;
  890. shapeArgs.alpha = 90 - alpha;
  891. shapeArgs.beta = 0;
  892. shapeArgs.origin = origin;
  893. });
  894. });
  895. /***
  896. EXTENSION FOR 3D PIES
  897. ***/
  898. Highcharts.wrap(Highcharts.seriesTypes.pie.prototype, 'translate', function (proceed) {
  899. proceed.apply(this, [].slice.call(arguments, 1));
  900. // Do not do this if the chart is not 3D
  901. if (!this.chart.is3d()) {
  902. return;
  903. }
  904. var series = this,
  905. chart = series.chart,
  906. options = chart.options,
  907. seriesOptions = series.options,
  908. depth = seriesOptions.depth || 0,
  909. options3d = options.chart.options3d,
  910. origin = {
  911. x: chart.plotWidth / 2,
  912. y: chart.plotHeight / 2,
  913. z: options3d.depth
  914. },
  915. alpha = options3d.alpha,
  916. beta = options3d.beta;
  917. var z = seriesOptions.stacking ? (seriesOptions.stack || 0) * depth : series._i * depth;
  918. z += depth / 2;
  919. if (seriesOptions.grouping !== false) { z = 0; }
  920. Highcharts.each(series.data, function (point) {
  921. point.shapeType = 'arc3d';
  922. var shapeArgs = point.shapeArgs;
  923. if (point.y) { // will be false if null or 0 #3006
  924. shapeArgs.z = z;
  925. shapeArgs.depth = depth * 0.75;
  926. shapeArgs.origin = origin;
  927. shapeArgs.alpha = alpha;
  928. shapeArgs.beta = beta;
  929. var angle = (shapeArgs.end + shapeArgs.start) / 2;
  930. point.slicedTranslation = {
  931. translateX : round(cos(angle) * series.options.slicedOffset * cos(alpha * deg2rad)),
  932. translateY : round(sin(angle) * series.options.slicedOffset * cos(alpha * deg2rad))
  933. };
  934. } else {
  935. shapeArgs = null;
  936. }
  937. });
  938. });
  939. Highcharts.wrap(Highcharts.seriesTypes.pie.prototype.pointClass.prototype, 'haloPath', function (proceed) {
  940. return this.series.chart.is3d() ? [] : proceed.call(this);
  941. });
  942. Highcharts.wrap(Highcharts.seriesTypes.pie.prototype, 'drawPoints', function (proceed) {
  943. // Do not do this if the chart is not 3D
  944. if (this.chart.is3d()) {
  945. var options = this.options,
  946. states = this.options.states;
  947. // Set the border color to the fill color to provide a smooth edge
  948. this.borderWidth = options.borderWidth = options.edgeWidth || 1;
  949. states.hover.borderColor = Highcharts.pick(states.hover.edgeColor, this.borderColor);
  950. states.hover.borderWidth = Highcharts.pick(states.hover.edgeWidth, this.borderWidth);
  951. states.select.borderColor = Highcharts.pick(states.select.edgeColor, this.borderColor);
  952. states.select.borderWidth = Highcharts.pick(states.select.edgeWidth, this.borderWidth);
  953. Highcharts.each(this.data, function (point) {
  954. var pointAttr = point.pointAttr;
  955. pointAttr[''].stroke = point.series.borderColor || point.color;
  956. pointAttr['']['stroke-width'] = point.series.borderWidth;
  957. pointAttr.hover.stroke = states.hover.borderColor;
  958. pointAttr.hover['stroke-width'] = states.hover.borderWidth;
  959. pointAttr.select.stroke = states.select.borderColor;
  960. pointAttr.select['stroke-width'] = states.select.borderWidth;
  961. });
  962. }
  963. proceed.apply(this, [].slice.call(arguments, 1));
  964. if (this.chart.is3d()) {
  965. var seriesGroup = this.group;
  966. Highcharts.each(this.points, function (point) {
  967. point.graphic.out.add(seriesGroup);
  968. point.graphic.inn.add(seriesGroup);
  969. point.graphic.side1.add(seriesGroup);
  970. point.graphic.side2.add(seriesGroup);
  971. });
  972. }
  973. });
  974. Highcharts.wrap(Highcharts.seriesTypes.pie.prototype, 'drawDataLabels', function (proceed) {
  975. if (this.chart.is3d()) {
  976. var series = this;
  977. Highcharts.each(series.data, function (point) {
  978. var shapeArgs = point.shapeArgs,
  979. r = shapeArgs.r,
  980. d = shapeArgs.depth,
  981. a1 = shapeArgs.alpha * deg2rad,
  982. a2 = (shapeArgs.start + shapeArgs.end) / 2,
  983. labelPos = point.labelPos;
  984. labelPos[1] += (-r * (1 - cos(a1)) * sin(a2)) + (sin(a2) > 0 ? sin(a1) * d : 0);
  985. labelPos[3] += (-r * (1 - cos(a1)) * sin(a2)) + (sin(a2) > 0 ? sin(a1) * d : 0);
  986. labelPos[5] += (-r * (1 - cos(a1)) * sin(a2)) + (sin(a2) > 0 ? sin(a1) * d : 0);
  987. });
  988. }
  989. proceed.apply(this, [].slice.call(arguments, 1));
  990. });
  991. Highcharts.wrap(Highcharts.seriesTypes.pie.prototype, 'addPoint', function (proceed) {
  992. proceed.apply(this, [].slice.call(arguments, 1));
  993. if (this.chart.is3d()) {
  994. // destroy (and rebuild) everything!!!
  995. this.update();
  996. }
  997. });
  998. Highcharts.wrap(Highcharts.seriesTypes.pie.prototype, 'animate', function (proceed) {
  999. if (!this.chart.is3d()) {
  1000. proceed.apply(this, [].slice.call(arguments, 1));
  1001. } else {
  1002. var args = arguments,
  1003. init = args[1],
  1004. animation = this.options.animation,
  1005. attribs,
  1006. center = this.center,
  1007. group = this.group,
  1008. markerGroup = this.markerGroup;
  1009. if (Highcharts.svg) { // VML is too slow anyway
  1010. if (animation === true) {
  1011. animation = {};
  1012. }
  1013. // Initialize the animation
  1014. if (init) {
  1015. // Scale down the group and place it in the center
  1016. group.oldtranslateX = group.translateX;
  1017. group.oldtranslateY = group.translateY;
  1018. attribs = {
  1019. translateX: center[0],
  1020. translateY: center[1],
  1021. scaleX: 0.001, // #1499
  1022. scaleY: 0.001
  1023. };
  1024. group.attr(attribs);
  1025. if (markerGroup) {
  1026. markerGroup.attrSetters = group.attrSetters;
  1027. markerGroup.attr(attribs);
  1028. }
  1029. // Run the animation
  1030. } else {
  1031. attribs = {
  1032. translateX: group.oldtranslateX,
  1033. translateY: group.oldtranslateY,
  1034. scaleX: 1,
  1035. scaleY: 1
  1036. };
  1037. group.animate(attribs, animation);
  1038. if (markerGroup) {
  1039. markerGroup.animate(attribs, animation);
  1040. }
  1041. // Delete this function to allow it only once
  1042. this.animate = null;
  1043. }
  1044. }
  1045. }
  1046. });/***
  1047. EXTENSION FOR 3D SCATTER CHART
  1048. ***/
  1049. Highcharts.wrap(Highcharts.seriesTypes.scatter.prototype, 'translate', function (proceed) {
  1050. //function translate3d(proceed) {
  1051. proceed.apply(this, [].slice.call(arguments, 1));
  1052. if (!this.chart.is3d()) {
  1053. return;
  1054. }
  1055. var series = this,
  1056. chart = series.chart,
  1057. options3d = series.chart.options.chart.options3d,
  1058. alpha = options3d.alpha,
  1059. beta = options3d.beta,
  1060. origin = {
  1061. x: chart.inverted ? chart.plotHeight / 2 : chart.plotWidth / 2,
  1062. y: chart.inverted ? chart.plotWidth / 2 : chart.plotHeight / 2,
  1063. z: options3d.depth,
  1064. vd: options3d.viewDistance
  1065. },
  1066. depth = options3d.depth,
  1067. zAxis = chart.options.zAxis || { min : 0, max: depth };
  1068. var rangeModifier = depth / (zAxis.max - zAxis.min);
  1069. Highcharts.each(series.data, function (point) {
  1070. var pCo = {
  1071. x: point.plotX,
  1072. y: point.plotY,
  1073. z: (point.z - zAxis.min) * rangeModifier
  1074. };
  1075. pCo = perspective([pCo], alpha, beta, origin)[0];
  1076. point.plotXold = point.plotX;
  1077. point.plotYold = point.plotY;
  1078. point.plotX = pCo.x;
  1079. point.plotY = pCo.y;
  1080. point.plotZ = pCo.z;
  1081. });
  1082. });
  1083. Highcharts.wrap(Highcharts.seriesTypes.scatter.prototype, 'init', function (proceed) {
  1084. var result = proceed.apply(this, [].slice.call(arguments, 1));
  1085. if (this.chart.is3d()) {
  1086. // Add a third coordinate
  1087. this.pointArrayMap = ['x', 'y', 'z'];
  1088. // Set a new default tooltip formatter
  1089. var default3dScatterTooltip = 'x: <b>{point.x}</b><br/>y: <b>{point.y}</b><br/>z: <b>{point.z}</b><br/>';
  1090. if (this.userOptions.tooltip) {
  1091. this.tooltipOptions.pointFormat = this.userOptions.tooltip.pointFormat || default3dScatterTooltip;
  1092. } else {
  1093. this.tooltipOptions.pointFormat = default3dScatterTooltip;
  1094. }
  1095. }
  1096. return result;
  1097. });/**
  1098. * Extension to the VML Renderer
  1099. */
  1100. if (Highcharts.VMLRenderer) {
  1101. Highcharts.setOptions({animate: false});
  1102. Highcharts.VMLRenderer.prototype.cuboid = Highcharts.SVGRenderer.prototype.cuboid;
  1103. Highcharts.VMLRenderer.prototype.cuboidPath = Highcharts.SVGRenderer.prototype.cuboidPath;
  1104. Highcharts.VMLRenderer.prototype.toLinePath = Highcharts.SVGRenderer.prototype.toLinePath;
  1105. Highcharts.VMLRenderer.prototype.createElement3D = Highcharts.SVGRenderer.prototype.createElement3D;
  1106. Highcharts.VMLRenderer.prototype.arc3d = function (shapeArgs) {
  1107. var result = Highcharts.SVGRenderer.prototype.arc3d.call(this, shapeArgs);
  1108. result.css({zIndex: result.zIndex});
  1109. return result;
  1110. };
  1111. Highcharts.VMLRenderer.prototype.arc3dPath = Highcharts.SVGRenderer.prototype.arc3dPath;
  1112. // Draw the series in the reverse order
  1113. Highcharts.Chart.prototype.renderSeries = function () {
  1114. var serie,
  1115. i = this.series.length;
  1116. while (i--) {
  1117. serie = this.series[i];
  1118. serie.translate();
  1119. if (serie.setTooltipPoints) {
  1120. serie.setTooltipPoints();
  1121. }
  1122. serie.render();
  1123. }
  1124. };
  1125. Highcharts.wrap(Highcharts.Axis.prototype, 'render', function (proceed) {
  1126. proceed.apply(this, [].slice.call(arguments, 1));
  1127. // VML doesn't support a negative z-index
  1128. if (this.sideFrame) {
  1129. this.sideFrame.css({zIndex: 0});
  1130. this.sideFrame.front.attr({fill: this.sideFrame.color});
  1131. }
  1132. if (this.bottomFrame) {
  1133. this.bottomFrame.css({zIndex: 1});
  1134. this.bottomFrame.front.attr({fill: this.bottomFrame.color});
  1135. }
  1136. if (this.backFrame) {
  1137. this.backFrame.css({zIndex: 0});
  1138. this.backFrame.front.attr({fill: this.backFrame.color});
  1139. }
  1140. });
  1141. }
  1142. }(Highcharts));