Não pode escolher mais do que 25 tópicos Os tópicos devem começar com uma letra ou um número, podem incluir traços ('-') e podem ter até 35 caracteres.
 
 
 

768 linhas
19 KiB

  1. (function () {
  2. 'use strict';
  3. // Fixed 5-color theme,
  4. // More colors are difficult to parse visually
  5. var HEATMAP_COLORS_BLUE = ['#ebedf0', '#c0ddf9', '#73b3f3', '#3886e1', '#17459e'];
  6. var HEATMAP_COLORS_YELLOW = ['#ebedf0', '#fdf436', '#ffc700', '#ff9100', '#06001c'];
  7. // Universal constants
  8. var asyncGenerator = function () {
  9. function AwaitValue(value) {
  10. this.value = value;
  11. }
  12. function AsyncGenerator(gen) {
  13. var front, back;
  14. function send(key, arg) {
  15. return new Promise(function (resolve, reject) {
  16. var request = {
  17. key: key,
  18. arg: arg,
  19. resolve: resolve,
  20. reject: reject,
  21. next: null
  22. };
  23. if (back) {
  24. back = back.next = request;
  25. } else {
  26. front = back = request;
  27. resume(key, arg);
  28. }
  29. });
  30. }
  31. function resume(key, arg) {
  32. try {
  33. var result = gen[key](arg);
  34. var value = result.value;
  35. if (value instanceof AwaitValue) {
  36. Promise.resolve(value.value).then(function (arg) {
  37. resume("next", arg);
  38. }, function (arg) {
  39. resume("throw", arg);
  40. });
  41. } else {
  42. settle(result.done ? "return" : "normal", result.value);
  43. }
  44. } catch (err) {
  45. settle("throw", err);
  46. }
  47. }
  48. function settle(type, value) {
  49. switch (type) {
  50. case "return":
  51. front.resolve({
  52. value: value,
  53. done: true
  54. });
  55. break;
  56. case "throw":
  57. front.reject(value);
  58. break;
  59. default:
  60. front.resolve({
  61. value: value,
  62. done: false
  63. });
  64. break;
  65. }
  66. front = front.next;
  67. if (front) {
  68. resume(front.key, front.arg);
  69. } else {
  70. back = null;
  71. }
  72. }
  73. this._invoke = send;
  74. if (typeof gen.return !== "function") {
  75. this.return = undefined;
  76. }
  77. }
  78. if (typeof Symbol === "function" && Symbol.asyncIterator) {
  79. AsyncGenerator.prototype[Symbol.asyncIterator] = function () {
  80. return this;
  81. };
  82. }
  83. AsyncGenerator.prototype.next = function (arg) {
  84. return this._invoke("next", arg);
  85. };
  86. AsyncGenerator.prototype.throw = function (arg) {
  87. return this._invoke("throw", arg);
  88. };
  89. AsyncGenerator.prototype.return = function (arg) {
  90. return this._invoke("return", arg);
  91. };
  92. return {
  93. wrap: function (fn) {
  94. return function () {
  95. return new AsyncGenerator(fn.apply(this, arguments));
  96. };
  97. },
  98. await: function (value) {
  99. return new AwaitValue(value);
  100. }
  101. };
  102. }();
  103. /**
  104. * Returns the value of a number upto 2 decimal places.
  105. * @param {Number} d Any number
  106. */
  107. /**
  108. * Returns whether or not two given arrays are equal.
  109. * @param {Array} arr1 First array
  110. * @param {Array} arr2 Second array
  111. */
  112. /**
  113. * Shuffles array in place. ES6 version
  114. * @param {Array} array An array containing the items.
  115. */
  116. function shuffle(array) {
  117. // Awesomeness: https://bost.ocks.org/mike/shuffle/
  118. // https://stackoverflow.com/a/2450976/6495043
  119. // https://stackoverflow.com/questions/6274339/how-can-i-shuffle-an-array?noredirect=1&lq=1
  120. for (var i = array.length - 1; i > 0; i--) {
  121. var j = Math.floor(Math.random() * (i + 1));
  122. var _ref = [array[j], array[i]];
  123. array[i] = _ref[0];
  124. array[j] = _ref[1];
  125. }
  126. return array;
  127. }
  128. /**
  129. * Fill an array with extra points
  130. * @param {Array} array Array
  131. * @param {Number} count number of filler elements
  132. * @param {Object} element element to fill with
  133. * @param {Boolean} start fill at start?
  134. */
  135. /**
  136. * Returns pixel width of string.
  137. * @param {String} string
  138. * @param {Number} charWidth Width of single char in pixels
  139. */
  140. // https://stackoverflow.com/a/29325222
  141. function getRandomBias(min, max, bias, influence) {
  142. var range = max - min;
  143. var biasValue = range * bias + min;
  144. var rnd = Math.random() * range + min,
  145. // random in range
  146. mix = Math.random() * influence; // random mixer
  147. return rnd * (1 - mix) + biasValue * mix; // mix full range and bias
  148. }
  149. /**
  150. * Check if a number is valid for svg attributes
  151. * @param {object} candidate Candidate to test
  152. * @param {Boolean} nonNegative flag to treat negative number as invalid
  153. */
  154. /**
  155. * Round a number to the closes precision, max max precision 4
  156. * @param {Number} d Any Number
  157. */
  158. /**
  159. * Creates a deep clone of an object
  160. * @param {Object} candidate Any Object
  161. */
  162. // Playing around with dates
  163. var NO_OF_MILLIS = 1000;
  164. var SEC_IN_DAY = 86400;
  165. var MONTH_NAMES_SHORT = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
  166. function clone(date) {
  167. return new Date(date.getTime());
  168. }
  169. function timestampSec(date) {
  170. return date.getTime() / NO_OF_MILLIS;
  171. }
  172. function timestampToMidnight(timestamp) {
  173. var roundAhead = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
  174. var midnightTs = Math.floor(timestamp - timestamp % SEC_IN_DAY);
  175. if (roundAhead) {
  176. return midnightTs + SEC_IN_DAY;
  177. }
  178. return midnightTs;
  179. }
  180. // export function getMonthsBetween(startDate, endDate) {}
  181. // mutates
  182. // mutates
  183. function addDays(date, numberOfDays) {
  184. date.setDate(date.getDate() + numberOfDays);
  185. }
  186. // Composite Chart
  187. // ================================================================================
  188. var reportCountList = [152, 222, 199, 287, 534, 709, 1179, 1256, 1632, 1856, 1850];
  189. var lineCompositeData = {
  190. labels: ["2007", "2008", "2009", "2010", "2011", "2012", "2013", "2014", "2015", "2016", "2017"],
  191. yMarkers: [{
  192. label: "Average 100 reports/month",
  193. value: 1200,
  194. options: { labelPos: "left" }
  195. }],
  196. datasets: [{
  197. name: "Events",
  198. values: reportCountList
  199. }]
  200. };
  201. var fireball_5_25 = [[4, 0, 3, 1, 1, 2, 1, 1, 1, 0, 1, 1], [2, 3, 3, 2, 1, 3, 0, 1, 2, 7, 10, 4], [5, 6, 2, 4, 0, 1, 4, 3, 0, 2, 0, 1], [0, 2, 6, 2, 1, 1, 2, 3, 6, 3, 7, 8], [6, 8, 7, 7, 4, 5, 6, 5, 22, 12, 10, 11], [7, 10, 11, 7, 3, 2, 7, 7, 11, 15, 22, 20], [13, 16, 21, 18, 19, 17, 12, 17, 31, 28, 25, 29], [24, 14, 21, 14, 11, 15, 19, 21, 41, 22, 32, 18], [31, 20, 30, 22, 14, 17, 21, 35, 27, 50, 117, 24], [32, 24, 21, 27, 11, 27, 43, 37, 44, 40, 48, 32], [31, 38, 36, 26, 23, 23, 25, 29, 26, 47, 61, 50]];
  202. var fireball_2_5 = [[22, 6, 6, 9, 7, 8, 6, 14, 19, 10, 8, 20], [11, 13, 12, 8, 9, 11, 9, 13, 10, 22, 40, 24], [20, 13, 13, 19, 13, 10, 14, 13, 20, 18, 5, 9], [7, 13, 16, 19, 12, 11, 21, 27, 27, 24, 33, 33], [38, 25, 28, 22, 31, 21, 35, 42, 37, 32, 46, 53], [50, 33, 36, 34, 35, 28, 27, 52, 58, 59, 75, 69], [54, 67, 67, 45, 66, 51, 38, 64, 90, 113, 116, 87], [84, 52, 56, 51, 55, 46, 50, 87, 114, 83, 152, 93], [73, 58, 59, 63, 56, 51, 83, 140, 103, 115, 265, 89], [106, 95, 94, 71, 77, 75, 99, 136, 129, 154, 168, 156], [81, 102, 95, 72, 58, 91, 89, 122, 124, 135, 183, 171]];
  203. var fireballOver25 = [
  204. // [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  205. [0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0], [0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0], [1, 1, 0, 0, 0, 0, 1, 0, 1, 0, 0, 0], [0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 2], [3, 2, 1, 3, 2, 0, 2, 2, 2, 3, 0, 1], [2, 3, 5, 2, 1, 3, 0, 2, 3, 5, 1, 4], [7, 4, 6, 1, 9, 2, 2, 2, 20, 9, 4, 9], [5, 6, 1, 2, 5, 4, 5, 5, 16, 9, 14, 9], [5, 4, 7, 5, 1, 5, 3, 3, 5, 7, 22, 2], [5, 13, 11, 6, 1, 7, 9, 8, 14, 17, 16, 3], [8, 9, 8, 6, 4, 8, 5, 6, 14, 11, 21, 12]];
  206. var barCompositeData = {
  207. labels: MONTH_NAMES_SHORT,
  208. datasets: [{
  209. name: "Over 25 reports",
  210. values: fireballOver25[9]
  211. }, {
  212. name: "5 to 25 reports",
  213. values: fireball_5_25[9]
  214. }, {
  215. name: "2 to 5 reports",
  216. values: fireball_2_5[9]
  217. }]
  218. };
  219. // Demo Chart multitype Chart
  220. // ================================================================================
  221. var typeData = {
  222. labels: ["12am-3am", "3am-6am", "6am-9am", "9am-12pm", "12pm-3pm", "3pm-6pm", "6pm-9pm", "9pm-12am"],
  223. yMarkers: [{
  224. label: "Marker",
  225. value: 43,
  226. options: { labelPos: "left" }
  227. // type: 'dashed'
  228. }],
  229. yRegions: [{
  230. label: "Region",
  231. start: -10,
  232. end: 50,
  233. options: { labelPos: "right" }
  234. }],
  235. datasets: [{
  236. name: "Some Data",
  237. values: [18, 40, 30, 35, 8, 52, 17, -4],
  238. axisPosition: "right",
  239. chartType: "bar"
  240. }, {
  241. name: "Another Set",
  242. values: [30, 50, -10, 15, 18, 32, 27, 14],
  243. axisPosition: "right",
  244. chartType: "bar"
  245. }, {
  246. name: "Yet Another",
  247. values: [15, 20, -3, -15, 58, 12, -17, 37],
  248. chartType: "line"
  249. }]
  250. };
  251. var trendsData = {
  252. labels: [1967, 1968, 1969, 1970, 1971, 1972, 1973, 1974, 1975, 1976, 1977, 1978, 1979, 1980, 1981, 1982, 1983, 1984, 1985, 1986, 1987, 1988, 1989, 1990, 1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998, 1999, 2000, 2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012, 2013, 2014, 2015, 2016],
  253. datasets: [{
  254. values: [132.9, 150.0, 149.4, 148.0, 94.4, 97.6, 54.1, 49.2, 22.5, 18.4, 39.3, 131.0, 220.1, 218.9, 198.9, 162.4, 91.0, 60.5, 20.6, 14.8, 33.9, 123.0, 211.1, 191.8, 203.3, 133.0, 76.1, 44.9, 25.1, 11.6, 28.9, 88.3, 136.3, 173.9, 170.4, 163.6, 99.3, 65.3, 45.8, 24.7, 12.6, 4.2, 4.8, 24.9, 80.8, 84.5, 94.0, 113.3, 69.8, 39.8]
  255. }]
  256. };
  257. var moonData = {
  258. names: ["Ganymede", "Callisto", "Io", "Europa"],
  259. masses: [14819000, 10759000, 8931900, 4800000],
  260. distances: [1070.412, 1882.709, 421.7, 671.034],
  261. diameters: [5262.4, 4820.6, 3637.4, 3121.6]
  262. };
  263. var demoConfig = {
  264. lineComposite: {
  265. elementID: "#chart-composite-1",
  266. options: {
  267. title: "Fireball/Bolide Events - Yearly (reported)",
  268. data: lineCompositeData,
  269. type: "line",
  270. height: 190,
  271. colors: ["green"],
  272. isNavigable: 1,
  273. valuesOverPoints: 1,
  274. lineOptions: {
  275. dotSize: 8
  276. }
  277. }
  278. },
  279. barComposite: {
  280. elementID: "#chart-composite-2",
  281. options: {
  282. data: barCompositeData,
  283. type: "bar",
  284. height: 210,
  285. colors: ["violet", "light-blue", "#46a9f9"],
  286. valuesOverPoints: 1,
  287. axisOptions: {
  288. xAxisMode: "tick",
  289. shortenYAxisNumbers: true
  290. },
  291. barOptions: {
  292. stacked: 1
  293. }
  294. }
  295. },
  296. demoMain: {
  297. elementID: "",
  298. options: {
  299. title: "My Awesome Chart",
  300. data: "typeData",
  301. type: "axis-mixed",
  302. height: 300,
  303. colors: ["purple", "magenta", "light-blue"],
  304. maxSlices: 10,
  305. tooltipOptions: {
  306. formatTooltipX: function formatTooltipX(d) {
  307. return (d + '').toUpperCase();
  308. },
  309. formatTooltipY: function formatTooltipY(d) {
  310. return d + ' pts';
  311. }
  312. }
  313. }
  314. }
  315. };
  316. /* eslint-disable no-unused-vars */
  317. /* eslint-enable no-unused-vars */
  318. // import { lineComposite, barComposite } from './demoConfig';
  319. // ================================================================================
  320. var Chart = frappe.Chart; // eslint-disable-line no-undef
  321. var lc = demoConfig.lineComposite;
  322. var lineCompositeChart = new Chart(lc.elementID, lc.options);
  323. var bc = demoConfig.barComposite;
  324. var barCompositeChart = new Chart(bc.elementID, bc.options);
  325. lineCompositeChart.parent.addEventListener('data-select', function (e) {
  326. var i = e.index;
  327. barCompositeChart.updateDatasets([fireballOver25[i], fireball_5_25[i], fireball_2_5[i]]);
  328. });
  329. // ================================================================================
  330. var customColors = ['purple', 'magenta', 'light-blue'];
  331. var typeChartArgs = {
  332. title: "My Awesome Chart",
  333. data: typeData,
  334. type: 'axis-mixed',
  335. height: 300,
  336. colors: customColors,
  337. // maxLegendPoints: 6,
  338. maxSlices: 10,
  339. tooltipOptions: {
  340. formatTooltipX: function formatTooltipX(d) {
  341. return (d + '').toUpperCase();
  342. },
  343. formatTooltipY: function formatTooltipY(d) {
  344. return d + ' pts';
  345. }
  346. }
  347. };
  348. var aggrChart = new Chart("#chart-aggr", typeChartArgs);
  349. Array.prototype.slice.call(document.querySelectorAll('.aggr-type-buttons button')).map(function (el) {
  350. el.addEventListener('click', function (e) {
  351. var btn = e.target;
  352. var type = btn.getAttribute('data-type');
  353. typeChartArgs.type = type;
  354. if (type !== 'axis-mixed') {
  355. typeChartArgs.colors = undefined;
  356. } else {
  357. typeChartArgs.colors = customColors;
  358. }
  359. if (type !== 'percentage') {
  360. typeChartArgs.height = 300;
  361. } else {
  362. typeChartArgs.height = undefined;
  363. }
  364. var newChart = new Chart("#chart-aggr", typeChartArgs);
  365. if (newChart) {
  366. aggrChart = newChart;
  367. }
  368. Array.prototype.slice.call(btn.parentNode.querySelectorAll('button')).map(function (el) {
  369. el.classList.remove('active');
  370. });
  371. btn.classList.add('active');
  372. });
  373. });
  374. document.querySelector('.export-aggr').addEventListener('click', function () {
  375. aggrChart.export();
  376. });
  377. // Update values chart
  378. // ================================================================================
  379. var updateDataAllLabels = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun", "Mon"];
  380. var getRandom = function getRandom() {
  381. return Math.floor(getRandomBias(-40, 60, 0.8, 1));
  382. };
  383. var updateDataAllValues = Array.from({ length: 30 }, getRandom);
  384. // We're gonna be shuffling this
  385. var updateDataAllIndices = updateDataAllLabels.map(function (d, i) {
  386. return i;
  387. });
  388. var getUpdateData = function getUpdateData(source_array) {
  389. var length = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 10;
  390. var indices = updateDataAllIndices.slice(0, length);
  391. return indices.map(function (index) {
  392. return source_array[index];
  393. });
  394. };
  395. var updateData = {
  396. labels: getUpdateData(updateDataAllLabels),
  397. datasets: [{
  398. "values": getUpdateData(updateDataAllValues)
  399. }],
  400. yMarkers: [{
  401. label: "Altitude",
  402. value: 25,
  403. type: 'dashed'
  404. }],
  405. yRegions: [{
  406. label: "Range",
  407. start: 10,
  408. end: 45
  409. }]
  410. };
  411. var updateChart = new Chart("#chart-update", {
  412. data: updateData,
  413. type: 'line',
  414. height: 300,
  415. colors: ['#ff6c03'],
  416. lineOptions: {
  417. // hideLine: 1,
  418. regionFill: 1
  419. }
  420. });
  421. var chartUpdateButtons = document.querySelector('.chart-update-buttons');
  422. chartUpdateButtons.querySelector('[data-update="random"]').addEventListener("click", function () {
  423. shuffle(updateDataAllIndices);
  424. var value = getRandom();
  425. var start = getRandom();
  426. var end = getRandom();
  427. var data = {
  428. labels: updateDataAllLabels.slice(0, 10),
  429. datasets: [{ values: getUpdateData(updateDataAllValues) }],
  430. yMarkers: [{
  431. label: "Altitude",
  432. value: value,
  433. type: 'dashed'
  434. }],
  435. yRegions: [{
  436. label: "Range",
  437. start: start,
  438. end: end
  439. }]
  440. };
  441. updateChart.update(data);
  442. });
  443. chartUpdateButtons.querySelector('[data-update="add"]').addEventListener("click", function () {
  444. var index = updateChart.state.datasetLength; // last index to add
  445. if (index >= updateDataAllIndices.length) return;
  446. updateChart.addDataPoint(updateDataAllLabels[index], [updateDataAllValues[index]]);
  447. });
  448. chartUpdateButtons.querySelector('[data-update="remove"]').addEventListener("click", function () {
  449. updateChart.removeDataPoint();
  450. });
  451. document.querySelector('.export-update').addEventListener('click', function () {
  452. updateChart.export();
  453. });
  454. // Trends Chart
  455. // ================================================================================
  456. var plotChartArgs = {
  457. title: "Mean Total Sunspot Count - Yearly",
  458. data: trendsData,
  459. type: 'line',
  460. height: 300,
  461. colors: ['#238e38'],
  462. lineOptions: {
  463. hideDots: 1,
  464. heatline: 1
  465. },
  466. axisOptions: {
  467. xAxisMode: 'tick',
  468. yAxisMode: 'span',
  469. xIsSeries: 1
  470. }
  471. };
  472. var trendsChart = new Chart("#chart-trends", plotChartArgs);
  473. Array.prototype.slice.call(document.querySelectorAll('.chart-plot-buttons button')).map(function (el) {
  474. el.addEventListener('click', function (e) {
  475. var btn = e.target;
  476. var type = btn.getAttribute('data-type');
  477. var config = {};
  478. config[type] = 1;
  479. if (['regionFill', 'heatline'].includes(type)) {
  480. config.hideDots = 1;
  481. }
  482. // plotChartArgs.init = false;
  483. plotChartArgs.lineOptions = config;
  484. new Chart("#chart-trends", plotChartArgs);
  485. Array.prototype.slice.call(btn.parentNode.querySelectorAll('button')).map(function (el) {
  486. el.classList.remove('active');
  487. });
  488. btn.classList.add('active');
  489. });
  490. });
  491. document.querySelector('.export-trends').addEventListener('click', function () {
  492. trendsChart.export();
  493. });
  494. // Event chart
  495. // ================================================================================
  496. var eventsData = {
  497. labels: ["Ganymede", "Callisto", "Io", "Europa"],
  498. datasets: [{
  499. "values": moonData.distances,
  500. "formatted": moonData.distances.map(function (d) {
  501. return d * 1000 + " km";
  502. })
  503. }]
  504. };
  505. var eventsChart = new Chart("#chart-events", {
  506. title: "Jupiter's Moons: Semi-major Axis (1000 km)",
  507. data: eventsData,
  508. type: 'bar',
  509. height: 330,
  510. colors: ['grey'],
  511. isNavigable: 1
  512. });
  513. var dataDiv = document.querySelector('.chart-events-data');
  514. eventsChart.parent.addEventListener('data-select', function (e) {
  515. var name = moonData.names[e.index];
  516. dataDiv.querySelector('.moon-name').innerHTML = name;
  517. dataDiv.querySelector('.semi-major-axis').innerHTML = moonData.distances[e.index] * 1000;
  518. dataDiv.querySelector('.mass').innerHTML = moonData.masses[e.index];
  519. dataDiv.querySelector('.diameter').innerHTML = moonData.diameters[e.index];
  520. dataDiv.querySelector('img').src = "./assets/img/" + name.toLowerCase() + ".jpg";
  521. });
  522. // Heatmap
  523. // ================================================================================
  524. var today = new Date();
  525. var start = clone(today);
  526. addDays(start, 4);
  527. var end = clone(start);
  528. start.setFullYear(start.getFullYear() - 2);
  529. end.setFullYear(end.getFullYear() - 1);
  530. var dataPoints = {};
  531. var startTs = timestampSec(start);
  532. var endTs = timestampSec(end);
  533. startTs = timestampToMidnight(startTs);
  534. endTs = timestampToMidnight(endTs, true);
  535. while (startTs < endTs) {
  536. dataPoints[parseInt(startTs)] = Math.floor(getRandomBias(0, 5, 0.2, 1));
  537. startTs += SEC_IN_DAY;
  538. }
  539. var heatmapData = {
  540. dataPoints: dataPoints,
  541. start: start,
  542. end: end
  543. };
  544. var heatmapArgs = {
  545. title: "Monthly Distribution",
  546. data: heatmapData,
  547. type: 'heatmap',
  548. discreteDomains: 1,
  549. countLabel: 'Level',
  550. colors: HEATMAP_COLORS_BLUE,
  551. legendScale: [0, 1, 2, 4, 5]
  552. };
  553. var heatmapChart = new Chart("#chart-heatmap", heatmapArgs);
  554. Array.prototype.slice.call(document.querySelectorAll('.heatmap-mode-buttons button')).map(function (el) {
  555. el.addEventListener('click', function (e) {
  556. var btn = e.target;
  557. var mode = btn.getAttribute('data-mode');
  558. var discreteDomains = 0;
  559. if (mode === 'discrete') {
  560. discreteDomains = 1;
  561. }
  562. var colors = [];
  563. var colors_mode = document.querySelector('.heatmap-color-buttons .active').getAttribute('data-color');
  564. if (colors_mode === 'halloween') {
  565. colors = HEATMAP_COLORS_YELLOW;
  566. } else if (colors_mode === 'blue') {
  567. colors = HEATMAP_COLORS_BLUE;
  568. }
  569. heatmapArgs.discreteDomains = discreteDomains;
  570. heatmapArgs.colors = colors;
  571. new Chart("#chart-heatmap", heatmapArgs);
  572. Array.prototype.slice.call(btn.parentNode.querySelectorAll('button')).map(function (el) {
  573. el.classList.remove('active');
  574. });
  575. btn.classList.add('active');
  576. });
  577. });
  578. Array.prototype.slice.call(document.querySelectorAll('.heatmap-color-buttons button')).map(function (el) {
  579. el.addEventListener('click', function (e) {
  580. var btn = e.target;
  581. var colors_mode = btn.getAttribute('data-color');
  582. var colors = [];
  583. if (colors_mode === 'halloween') {
  584. colors = HEATMAP_COLORS_YELLOW;
  585. } else if (colors_mode === 'blue') {
  586. colors = HEATMAP_COLORS_BLUE;
  587. }
  588. var discreteDomains = 1;
  589. var view_mode = document.querySelector('.heatmap-mode-buttons .active').getAttribute('data-mode');
  590. if (view_mode === 'continuous') {
  591. discreteDomains = 0;
  592. }
  593. heatmapArgs.discreteDomains = discreteDomains;
  594. heatmapArgs.colors = colors;
  595. new Chart("#chart-heatmap", heatmapArgs);
  596. Array.prototype.slice.call(btn.parentNode.querySelectorAll('button')).map(function (el) {
  597. el.classList.remove('active');
  598. });
  599. btn.classList.add('active');
  600. });
  601. });
  602. document.querySelector('.export-heatmap').addEventListener('click', function () {
  603. heatmapChart.export();
  604. });
  605. }());
  606. //# sourceMappingURL=index.min.js.map