UNPKG

502 kBJavaScriptView Raw
1/*!
2 * Copyright (c) 2017 ~ present NAVER Corp.
3 * billboard.js project is licensed under the MIT license
4 *
5 * billboard.js, JavaScript chart library
6 * http://naver.github.io/billboard.js/
7 *
8 * @version 1.7.1
9 */
10(function webpackUniversalModuleDefinition(root, factory) {
11 if(typeof exports === 'object' && typeof module === 'object')
12 module.exports = factory(require("d3-time-format"), require("d3-selection"), require("d3-array"), require("d3-transition"), require("d3-axis"), require("d3-brush"), require("d3-scale"), require("d3-collection"), require("d3-dsv"), require("d3-drag"), require("d3-shape"), require("d3-interpolate"), require("d3-color"), require("d3-zoom"), require("d3-ease"));
13 else if(typeof define === 'function' && define.amd)
14 define(["d3-time-format", "d3-selection", "d3-array", "d3-transition", "d3-axis", "d3-brush", "d3-scale", "d3-collection", "d3-dsv", "d3-drag", "d3-shape", "d3-interpolate", "d3-color", "d3-zoom", "d3-ease"], factory);
15 else {
16 var a = typeof exports === 'object' ? factory(require("d3-time-format"), require("d3-selection"), require("d3-array"), require("d3-transition"), require("d3-axis"), require("d3-brush"), require("d3-scale"), require("d3-collection"), require("d3-dsv"), require("d3-drag"), require("d3-shape"), require("d3-interpolate"), require("d3-color"), require("d3-zoom"), require("d3-ease")) : factory(root["d3"], root["d3"], root["d3"], root["d3"], root["d3"], root["d3"], root["d3"], root["d3"], root["d3"], root["d3"], root["d3"], root["d3"], root["d3"], root["d3"], root["d3"]);
17 for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
18 }
19})(window, function(__WEBPACK_EXTERNAL_MODULE__6__, __WEBPACK_EXTERNAL_MODULE__7__, __WEBPACK_EXTERNAL_MODULE__8__, __WEBPACK_EXTERNAL_MODULE__9__, __WEBPACK_EXTERNAL_MODULE__10__, __WEBPACK_EXTERNAL_MODULE__12__, __WEBPACK_EXTERNAL_MODULE__17__, __WEBPACK_EXTERNAL_MODULE__18__, __WEBPACK_EXTERNAL_MODULE__19__, __WEBPACK_EXTERNAL_MODULE__20__, __WEBPACK_EXTERNAL_MODULE__21__, __WEBPACK_EXTERNAL_MODULE__22__, __WEBPACK_EXTERNAL_MODULE__23__, __WEBPACK_EXTERNAL_MODULE__24__, __WEBPACK_EXTERNAL_MODULE__25__) {
20return /******/ (function(modules) { // webpackBootstrap
21/******/ // The module cache
22/******/ var installedModules = {};
23/******/
24/******/ // The require function
25/******/ function __webpack_require__(moduleId) {
26/******/
27/******/ // Check if module is in cache
28/******/ if(installedModules[moduleId]) {
29/******/ return installedModules[moduleId].exports;
30/******/ }
31/******/ // Create a new module (and put it into the cache)
32/******/ var module = installedModules[moduleId] = {
33/******/ i: moduleId,
34/******/ l: false,
35/******/ exports: {}
36/******/ };
37/******/
38/******/ // Execute the module function
39/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
40/******/
41/******/ // Flag the module as loaded
42/******/ module.l = true;
43/******/
44/******/ // Return the exports of the module
45/******/ return module.exports;
46/******/ }
47/******/
48/******/
49/******/ // expose the modules object (__webpack_modules__)
50/******/ __webpack_require__.m = modules;
51/******/
52/******/ // expose the module cache
53/******/ __webpack_require__.c = installedModules;
54/******/
55/******/ // define getter function for harmony exports
56/******/ __webpack_require__.d = function(exports, name, getter) {
57/******/ if(!__webpack_require__.o(exports, name)) {
58/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
59/******/ }
60/******/ };
61/******/
62/******/ // define __esModule on exports
63/******/ __webpack_require__.r = function(exports) {
64/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
65/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
66/******/ }
67/******/ Object.defineProperty(exports, '__esModule', { value: true });
68/******/ };
69/******/
70/******/ // create a fake namespace object
71/******/ // mode & 1: value is a module id, require it
72/******/ // mode & 2: merge all properties of value into the ns
73/******/ // mode & 4: return value when already ns object
74/******/ // mode & 8|1: behave like require
75/******/ __webpack_require__.t = function(value, mode) {
76/******/ if(mode & 1) value = __webpack_require__(value);
77/******/ if(mode & 8) return value;
78/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
79/******/ var ns = Object.create(null);
80/******/ __webpack_require__.r(ns);
81/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
82/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
83/******/ return ns;
84/******/ };
85/******/
86/******/ // getDefaultExport function for compatibility with non-harmony modules
87/******/ __webpack_require__.n = function(module) {
88/******/ var getter = module && module.__esModule ?
89/******/ function getDefault() { return module['default']; } :
90/******/ function getModuleExports() { return module; };
91/******/ __webpack_require__.d(getter, 'a', getter);
92/******/ return getter;
93/******/ };
94/******/
95/******/ // Object.prototype.hasOwnProperty.call
96/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
97/******/
98/******/ // __webpack_public_path__
99/******/ __webpack_require__.p = "";
100/******/
101/******/
102/******/ // Load entry module and return exports
103/******/ return __webpack_require__(__webpack_require__.s = 27);
104/******/ })
105/************************************************************************/
106/******/ ([
107/* 0 */
108/***/ (function(module, exports) {
109
110function _classCallCheck(instance, Constructor) {
111 if (!(instance instanceof Constructor)) {
112 throw new TypeError("Cannot call a class as a function");
113 }
114}
115
116module.exports = _classCallCheck;
117
118/***/ }),
119/* 1 */
120/***/ (function(module, exports, __webpack_require__) {
121
122var arrayWithHoles = __webpack_require__(2);
123
124var iterableToArrayLimit = __webpack_require__(3);
125
126var nonIterableRest = __webpack_require__(4);
127
128function _slicedToArray(arr, i) {
129 return arrayWithHoles(arr) || iterableToArrayLimit(arr, i) || nonIterableRest();
130}
131
132module.exports = _slicedToArray;
133
134/***/ }),
135/* 2 */
136/***/ (function(module, exports) {
137
138function _arrayWithHoles(arr) {
139 if (Array.isArray(arr)) return arr;
140}
141
142module.exports = _arrayWithHoles;
143
144/***/ }),
145/* 3 */
146/***/ (function(module, exports) {
147
148function _iterableToArrayLimit(arr, i) {
149 var _arr = [];
150 var _n = true;
151 var _d = false;
152 var _e = undefined;
153
154 try {
155 for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
156 _arr.push(_s.value);
157
158 if (i && _arr.length === i) break;
159 }
160 } catch (err) {
161 _d = true;
162 _e = err;
163 } finally {
164 try {
165 if (!_n && _i["return"] != null) _i["return"]();
166 } finally {
167 if (_d) throw _e;
168 }
169 }
170
171 return _arr;
172}
173
174module.exports = _iterableToArrayLimit;
175
176/***/ }),
177/* 4 */
178/***/ (function(module, exports) {
179
180function _nonIterableRest() {
181 throw new TypeError("Invalid attempt to destructure non-iterable instance");
182}
183
184module.exports = _nonIterableRest;
185
186/***/ }),
187/* 5 */
188/***/ (function(module, exports) {
189
190function _defineProperties(target, props) {
191 for (var i = 0; i < props.length; i++) {
192 var descriptor = props[i];
193 descriptor.enumerable = descriptor.enumerable || false;
194 descriptor.configurable = true;
195 if ("value" in descriptor) descriptor.writable = true;
196 Object.defineProperty(target, descriptor.key, descriptor);
197 }
198}
199
200function _createClass(Constructor, protoProps, staticProps) {
201 if (protoProps) _defineProperties(Constructor.prototype, protoProps);
202 if (staticProps) _defineProperties(Constructor, staticProps);
203 return Constructor;
204}
205
206module.exports = _createClass;
207
208/***/ }),
209/* 6 */
210/***/ (function(module, exports) {
211
212module.exports = __WEBPACK_EXTERNAL_MODULE__6__;
213
214/***/ }),
215/* 7 */
216/***/ (function(module, exports) {
217
218module.exports = __WEBPACK_EXTERNAL_MODULE__7__;
219
220/***/ }),
221/* 8 */
222/***/ (function(module, exports) {
223
224module.exports = __WEBPACK_EXTERNAL_MODULE__8__;
225
226/***/ }),
227/* 9 */
228/***/ (function(module, exports) {
229
230module.exports = __WEBPACK_EXTERNAL_MODULE__9__;
231
232/***/ }),
233/* 10 */
234/***/ (function(module, exports) {
235
236module.exports = __WEBPACK_EXTERNAL_MODULE__10__;
237
238/***/ }),
239/* 11 */
240/***/ (function(module, exports) {
241
242function _typeof2(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof2 = function _typeof2(obj) { return typeof obj; }; } else { _typeof2 = function _typeof2(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof2(obj); }
243
244function _typeof(obj) {
245 if (typeof Symbol === "function" && _typeof2(Symbol.iterator) === "symbol") {
246 module.exports = _typeof = function _typeof(obj) {
247 return _typeof2(obj);
248 };
249 } else {
250 module.exports = _typeof = function _typeof(obj) {
251 return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : _typeof2(obj);
252 };
253 }
254
255 return _typeof(obj);
256}
257
258module.exports = _typeof;
259
260/***/ }),
261/* 12 */
262/***/ (function(module, exports) {
263
264module.exports = __WEBPACK_EXTERNAL_MODULE__12__;
265
266/***/ }),
267/* 13 */
268/***/ (function(module, exports, __webpack_require__) {
269
270var arrayWithoutHoles = __webpack_require__(14);
271
272var iterableToArray = __webpack_require__(15);
273
274var nonIterableSpread = __webpack_require__(16);
275
276function _toConsumableArray(arr) {
277 return arrayWithoutHoles(arr) || iterableToArray(arr) || nonIterableSpread();
278}
279
280module.exports = _toConsumableArray;
281
282/***/ }),
283/* 14 */
284/***/ (function(module, exports) {
285
286function _arrayWithoutHoles(arr) {
287 if (Array.isArray(arr)) {
288 for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) {
289 arr2[i] = arr[i];
290 }
291
292 return arr2;
293 }
294}
295
296module.exports = _arrayWithoutHoles;
297
298/***/ }),
299/* 15 */
300/***/ (function(module, exports) {
301
302function _iterableToArray(iter) {
303 if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter);
304}
305
306module.exports = _iterableToArray;
307
308/***/ }),
309/* 16 */
310/***/ (function(module, exports) {
311
312function _nonIterableSpread() {
313 throw new TypeError("Invalid attempt to spread non-iterable instance");
314}
315
316module.exports = _nonIterableSpread;
317
318/***/ }),
319/* 17 */
320/***/ (function(module, exports) {
321
322module.exports = __WEBPACK_EXTERNAL_MODULE__17__;
323
324/***/ }),
325/* 18 */
326/***/ (function(module, exports) {
327
328module.exports = __WEBPACK_EXTERNAL_MODULE__18__;
329
330/***/ }),
331/* 19 */
332/***/ (function(module, exports) {
333
334module.exports = __WEBPACK_EXTERNAL_MODULE__19__;
335
336/***/ }),
337/* 20 */
338/***/ (function(module, exports) {
339
340module.exports = __WEBPACK_EXTERNAL_MODULE__20__;
341
342/***/ }),
343/* 21 */
344/***/ (function(module, exports) {
345
346module.exports = __WEBPACK_EXTERNAL_MODULE__21__;
347
348/***/ }),
349/* 22 */
350/***/ (function(module, exports) {
351
352module.exports = __WEBPACK_EXTERNAL_MODULE__22__;
353
354/***/ }),
355/* 23 */
356/***/ (function(module, exports) {
357
358module.exports = __WEBPACK_EXTERNAL_MODULE__23__;
359
360/***/ }),
361/* 24 */
362/***/ (function(module, exports) {
363
364module.exports = __WEBPACK_EXTERNAL_MODULE__24__;
365
366/***/ }),
367/* 25 */
368/***/ (function(module, exports) {
369
370module.exports = __WEBPACK_EXTERNAL_MODULE__25__;
371
372/***/ }),
373/* 26 */
374/***/ (function(module, exports, __webpack_require__) {
375
376// extracted by mini-css-extract-plugin
377
378/***/ }),
379/* 27 */
380/***/ (function(module, __webpack_exports__, __webpack_require__) {
381
382"use strict";
383
384// EXTERNAL MODULE: ./node_modules/@babel/runtime/helpers/classCallCheck.js
385var classCallCheck = __webpack_require__(0);
386var classCallCheck_default = /*#__PURE__*/__webpack_require__.n(classCallCheck);
387
388// EXTERNAL MODULE: ./node_modules/@babel/runtime/helpers/slicedToArray.js
389var slicedToArray = __webpack_require__(1);
390var slicedToArray_default = /*#__PURE__*/__webpack_require__.n(slicedToArray);
391
392// EXTERNAL MODULE: ./node_modules/@babel/runtime/helpers/createClass.js
393var createClass = __webpack_require__(5);
394var createClass_default = /*#__PURE__*/__webpack_require__.n(createClass);
395
396// EXTERNAL MODULE: external {"commonjs":"d3-time-format","commonjs2":"d3-time-format","amd":"d3-time-format","root":"d3"}
397var external_commonjs_d3_time_format_commonjs2_d3_time_format_amd_d3_time_format_root_d3_ = __webpack_require__(6);
398
399// EXTERNAL MODULE: external {"commonjs":"d3-selection","commonjs2":"d3-selection","amd":"d3-selection","root":"d3"}
400var external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_ = __webpack_require__(7);
401
402// EXTERNAL MODULE: external {"commonjs":"d3-array","commonjs2":"d3-array","amd":"d3-array","root":"d3"}
403var external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_ = __webpack_require__(8);
404
405// EXTERNAL MODULE: external {"commonjs":"d3-transition","commonjs2":"d3-transition","amd":"d3-transition","root":"d3"}
406var external_commonjs_d3_transition_commonjs2_d3_transition_amd_d3_transition_root_d3_ = __webpack_require__(9);
407
408// EXTERNAL MODULE: external {"commonjs":"d3-axis","commonjs2":"d3-axis","amd":"d3-axis","root":"d3"}
409var external_commonjs_d3_axis_commonjs2_d3_axis_amd_d3_axis_root_d3_ = __webpack_require__(10);
410
411// CONCATENATED MODULE: ./src/config/classes.js
412/**
413 * Copyright (c) 2017 ~ present NAVER Corp.
414 * billboard.js project is licensed under the MIT license
415 */
416
417/**
418 * CSS class names definition
419 * @private
420 */
421/* harmony default export */ var config_classes = ({
422 arc: "bb-arc",
423 arcs: "bb-arcs",
424 area: "bb-area",
425 areas: "bb-areas",
426 axis: "bb-axis",
427 axisX: "bb-axis-x",
428 axisXLabel: "bb-axis-x-label",
429 axisY: "bb-axis-y",
430 axisY2: "bb-axis-y2",
431 axisY2Label: "bb-axis-y2-label",
432 axisYLabel: "bb-axis-y-label",
433 bar: "bb-bar",
434 bars: "bb-bars",
435 brush: "bb-brush",
436 button: "bb-button",
437 buttonZoomReset: "bb-zoom-reset",
438 chart: "bb-chart",
439 chartArc: "bb-chart-arc",
440 chartArcs: "bb-chart-arcs",
441 chartArcsBackground: "bb-chart-arcs-background",
442 chartArcsGaugeMax: "bb-chart-arcs-gauge-max",
443 chartArcsGaugeMin: "bb-chart-arcs-gauge-min",
444 chartArcsGaugeUnit: "bb-chart-arcs-gauge-unit",
445 chartArcsTitle: "bb-chart-arcs-title",
446 chartBar: "bb-chart-bar",
447 chartBars: "bb-chart-bars",
448 chartLine: "bb-chart-line",
449 chartLines: "bb-chart-lines",
450 chartRadar: "bb-chart-radar",
451 chartRadars: "bb-chart-radars",
452 chartText: "bb-chart-text",
453 chartTexts: "bb-chart-texts",
454 circle: "bb-circle",
455 circles: "bb-circles",
456 colorPattern: "bb-color-pattern",
457 defocused: "bb-defocused",
458 dragarea: "bb-dragarea",
459 empty: "bb-empty",
460 eventRect: "bb-event-rect",
461 eventRects: "bb-event-rects",
462 eventRectsMultiple: "bb-event-rects-multiple",
463 eventRectsSingle: "bb-event-rects-single",
464 focused: "bb-focused",
465 gaugeValue: "bb-gauge-value",
466 grid: "bb-grid",
467 gridLines: "bb-grid-lines",
468 legendBackground: "bb-legend-background",
469 legendItem: "bb-legend-item",
470 legendItemEvent: "bb-legend-item-event",
471 legendItemFocused: "bb-legend-item-focused",
472 legendItemHidden: "bb-legend-item-hidden",
473 legendItemPoint: "bb-legend-item-point",
474 legendItemTile: "bb-legend-item-tile",
475 level: "bb-level",
476 levels: "bb-levels",
477 line: "bb-line",
478 lines: "bb-lines",
479 region: "bb-region",
480 regions: "bb-regions",
481 selectedCircle: "bb-selected-circle",
482 selectedCircles: "bb-selected-circles",
483 shape: "bb-shape",
484 shapes: "bb-shapes",
485 target: "bb-target",
486 text: "bb-text",
487 texts: "bb-texts",
488 title: "bb-title",
489 tooltip: "bb-tooltip",
490 tooltipContainer: "bb-tooltip-container",
491 tooltipName: "bb-tooltip-name",
492 xgrid: "bb-xgrid",
493 xgridFocus: "bb-xgrid-focus",
494 xgridLine: "bb-xgrid-line",
495 xgridLines: "bb-xgrid-lines",
496 xgrids: "bb-xgrids",
497 ygrid: "bb-ygrid",
498 ygridLine: "bb-ygrid-line",
499 ygridLines: "bb-ygrid-lines",
500 ygrids: "bb-ygrids",
501 zoomBrush: "bb-zoom-brush",
502 zoomRect: "bb-zoom-rect",
503 EXPANDED: "_expanded_",
504 SELECTED: "_selected_",
505 INCLUDED: "_included_"
506});
507// EXTERNAL MODULE: ./node_modules/@babel/runtime/helpers/typeof.js
508var helpers_typeof = __webpack_require__(11);
509var typeof_default = /*#__PURE__*/__webpack_require__.n(helpers_typeof);
510
511// EXTERNAL MODULE: external {"commonjs":"d3-brush","commonjs2":"d3-brush","amd":"d3-brush","root":"d3"}
512var external_commonjs_d3_brush_commonjs2_d3_brush_amd_d3_brush_root_d3_ = __webpack_require__(12);
513
514// CONCATENATED MODULE: ./src/internals/util.js
515
516
517/**
518 * Copyright (c) 2017 ~ present NAVER Corp.
519 * billboard.js project is licensed under the MIT license
520 * @ignore
521 */
522
523
524
525
526var isValue = function (v) {
527 return v || v === 0;
528},
529 isFunction = function (v) {
530 return typeof v === "function";
531},
532 isString = function (v) {
533 return typeof v === "string";
534},
535 isNumber = function (v) {
536 return typeof v === "number";
537},
538 isUndefined = function (v) {
539 return typeof v === "undefined";
540},
541 isDefined = function (v) {
542 return typeof v !== "undefined";
543},
544 isBoolean = function (v) {
545 return typeof v === "boolean";
546},
547 ceil10 = function (v) {
548 return Math.ceil(v / 10) * 10;
549},
550 asHalfPixel = function (n) {
551 return Math.ceil(n) + .5;
552},
553 diffDomain = function (d) {
554 return d[1] - d[0];
555},
556 isObjectType = function (v) {
557 return typeof_default()(v) === "object";
558},
559 isEmpty = function (o) {
560 return isUndefined(o) || o === null || isString(o) && o.length === 0 || isObjectType(o) && Object.keys(o).length === 0;
561},
562 notEmpty = function (o) {
563 return !isEmpty(o);
564},
565 isArray = function (arr) {
566 return arr && arr.constructor === Array;
567},
568 isObject = function (obj) {
569 return obj && !obj.nodeType && isObjectType(obj) && !isArray(obj);
570},
571 getOption = function (options, key, defaultValue) {
572 return isDefined(options[key]) ? options[key] : defaultValue;
573},
574 util_hasValue = function (dict, value) {
575 var found = !1;
576 return Object.keys(dict).forEach(function (key) {
577 return dict[key] === value && (found = !0);
578 }), found;
579},
580 callFn = function (fn) {
581 for (var isFn = isFunction(fn), _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) args[_key - 1] = arguments[_key];
582
583 return isFn && fn.call.apply(fn, args), isFn;
584},
585 sanitise = function (str) {
586 return isString(str) ? str.replace(/</g, "&lt;").replace(/>/g, "&gt;") : str;
587},
588 getRectSegList = function (path) {
589 /*
590 * seg1 ---------- seg2
591 * | |
592 * | |
593 * | |
594 * seg0 ---------- seg3
595 * */
596 var _path$getBBox = path.getBBox(),
597 x = _path$getBBox.x,
598 y = _path$getBBox.y,
599 width = _path$getBBox.width,
600 height = _path$getBBox.height;
601
602 return [{
603 x: x,
604 y: y + height
605 }, // seg0
606 {
607 x: x,
608 y: y
609 }, // seg1
610 {
611 x: x + width,
612 y: y
613 }, // seg2
614 {
615 x: x + width,
616 y: y + height // seg3
617
618 }];
619},
620 getPathBox = function (path) {
621 var _path$getBoundingClie = path.getBoundingClientRect(),
622 width = _path$getBoundingClie.width,
623 height = _path$getBoundingClie.height,
624 items = getRectSegList(path),
625 x = items[0].x,
626 y = Math.min(items[0].y, items[1].y);
627
628 return {
629 x: x,
630 y: y,
631 width: width,
632 height: height
633 };
634},
635 getBrushSelection = function (ctx) {
636 var selection = null,
637 event = external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["event"],
638 main = ctx.context || ctx.main;
639 return event && event.constructor.name === "BrushEvent" ? selection = event.selection : main && (selection = main.select(".".concat(config_classes.brush)).node()) && (selection = Object(external_commonjs_d3_brush_commonjs2_d3_brush_amd_d3_brush_root_d3_["brushSelection"])(selection)), selection;
640},
641 getRandom = function () {
642 var asStr = !(arguments.length > 0 && arguments[0] !== undefined) || arguments[0];
643 return Math.random() + (asStr ? "" : 0);
644},
645 brushEmpty = function (ctx) {
646 var selection = getBrushSelection(ctx);
647 return !selection || selection[0] === selection[1];
648},
649 extend = function () {
650 var target = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
651 source = arguments.length > 1 ? arguments[1] : undefined;
652
653 for (var p in source) target[p] = source[p];
654
655 return target;
656},
657 capitalize = function (str) {
658 return str.charAt(0).toUpperCase() + str.slice(1);
659},
660 toArray = function (v) {
661 return [].slice.call(v);
662},
663 getCssRules = function (styleSheets) {
664 var rules = [];
665 return styleSheets.forEach(function (sheet) {
666 try {
667 sheet.cssRules && sheet.cssRules.length && (rules = rules.concat(toArray(sheet.cssRules)));
668 } catch (e) {
669 console.error("Error while reading rules from ".concat(sheet.href, ": ").concat(e.toString()));
670 }
671 }), rules;
672},
673 emulateEvent = {
674 mouse: function () {
675 var getParams = function () {
676 return {
677 bubbles: !1,
678 cancelable: !1,
679 screenX: 0,
680 screenY: 0,
681 clientX: 0,
682 clientY: 0
683 };
684 };
685
686 try {
687 return new MouseEvent("t"), function (el, eventType) {
688 var params = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : getParams();
689 el.dispatchEvent(new MouseEvent(eventType, params));
690 };
691 } catch (e) {
692 // Polyfills DOM4 MouseEvent
693 return function (el, eventType) {
694 var params = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : getParams(),
695 mouseEvent = document.createEvent("MouseEvent");
696 mouseEvent.initMouseEvent(eventType, params.bubbles, params.cancelable, window, 0, // the event's mouse click count
697 params.screenX, params.screenY, params.clientX, params.clientY, !1, !1, !1, !1, 0, null), el.dispatchEvent(mouseEvent);
698 };
699 }
700 }(),
701 touch: function touch(el, eventType, params) {
702 var touchObj = new Touch(Object.assign({
703 identifier: Date.now(),
704 target: el,
705 radiusX: 2.5,
706 radiusY: 2.5,
707 rotationAngle: 10,
708 force: .5
709 }, params));
710 el.dispatchEvent(new TouchEvent(eventType, {
711 cancelable: !0,
712 bubbles: !0,
713 shiftKey: !0,
714 touches: [touchObj],
715 targetTouches: [],
716 changedTouches: [touchObj]
717 }));
718 }
719};
720
721
722// EXTERNAL MODULE: ./node_modules/@babel/runtime/helpers/toConsumableArray.js
723var toConsumableArray = __webpack_require__(13);
724var toConsumableArray_default = /*#__PURE__*/__webpack_require__.n(toConsumableArray);
725
726// EXTERNAL MODULE: external {"commonjs":"d3-scale","commonjs2":"d3-scale","amd":"d3-scale","root":"d3"}
727var external_commonjs_d3_scale_commonjs2_d3_scale_amd_d3_scale_root_d3_ = __webpack_require__(17);
728
729// CONCATENATED MODULE: ./src/axis/AxisRendererHelper.js
730
731
732
733
734/**
735 * Copyright (c) 2017 ~ present NAVER Corp.
736 * billboard.js project is licensed under the MIT license
737 * @ignore
738 */
739
740
741
742var AxisRendererHelper_AxisRendererHelper =
743/*#__PURE__*/
744function () {
745 function AxisRendererHelper(config, params) {
746 classCallCheck_default()(this, AxisRendererHelper);
747
748 var scale = Object(external_commonjs_d3_scale_commonjs2_d3_scale_amd_d3_scale_root_d3_["scaleLinear"])();
749 this.config = config, this.scale = scale, config.range = scale.rangeExtent ? scale.rangeExtent() : this.scaleExtent((params.orgXScale || scale).range());
750 }
751 /**
752 * Compute a character dimension
753 * @param {d3.selection} node
754 * @return {{w: number, h: number}}
755 * @private
756 */
757
758
759 return createClass_default()(AxisRendererHelper, [{
760 key: "axisX",
761 value: function axisX(selection, x) {
762 var tickOffset = this.config.tickOffset;
763 selection.attr("transform", function (d) {
764 return "translate(".concat(Math.ceil(x(d) + tickOffset), ", 0)");
765 });
766 }
767 }, {
768 key: "axisY",
769 value: function axisY(selection, y) {
770 selection.attr("transform", function (d) {
771 return "translate(0,".concat(Math.ceil(y(d)), ")");
772 });
773 }
774 }, {
775 key: "scaleExtent",
776 value: function scaleExtent(domain) {
777 var start = domain[0],
778 stop = domain[domain.length - 1];
779 return start < stop ? [start, stop] : [stop, start];
780 }
781 }, {
782 key: "generateTicks",
783 value: function generateTicks(scale) {
784 var ticks = [];
785 if (scale.ticks) return scale.ticks.apply(scale, toConsumableArray_default()(this.config.tickArguments || [])).map(function (v) {
786 return (// round the tick value if is number
787 isString(v) && isNumber(v) && !isNaN(v) && Math.round(v * 10) / 10 || v
788 );
789 });
790
791 for (var domain = scale.domain(), i = Math.ceil(domain[0]); i < domain[1]; i++) ticks.push(i);
792
793 return ticks.length > 0 && ticks[0] > 0 && ticks.unshift(ticks[0] - (ticks[1] - ticks[0])), ticks;
794 }
795 }, {
796 key: "copyScale",
797 value: function copyScale() {
798 var newScale = this.scale.copy();
799 return newScale.domain().length || newScale.domain(this.scale.domain()), newScale;
800 }
801 }, {
802 key: "textFormatted",
803 value: function textFormatted(v) {
804 var tickFormat = this.config.tickFormat,
805 value = /\d+\.\d+0{5,}\d$/.test(v) ? +(v + "").replace(/0+\d$/, "") : v,
806 formatted = tickFormat ? tickFormat(value) : value; // to round float numbers from 'binary floating point'
807 // https://en.wikipedia.org/wiki/Double-precision_floating-point_format
808 // https://stackoverflow.com/questions/17849101/laymans-explanation-for-why-javascript-has-weird-floating-math-ieee-754-stand
809
810 return isDefined(formatted) ? formatted : "";
811 }
812 }, {
813 key: "transitionise",
814 value: function transitionise(selection) {
815 var config = this.config;
816 return config.withoutTransition ? selection.interrupt() : selection.transition(config.transition);
817 }
818 }], [{
819 key: "getSizeFor1Char",
820 value: function getSizeFor1Char(node) {
821 // default size for one character
822 var size = {
823 w: 5.5,
824 h: 11.5
825 };
826 return node.empty() || node.select("text").text("0").call(function (el) {
827 try {
828 var _el$node$getBBox = el.node().getBBox(),
829 width = _el$node$getBBox.width,
830 height = _el$node$getBBox.height;
831
832 width && height && (size.w = width, size.h = height), el.text("");
833 } catch (e) {}
834 }), this.getSizeFor1Char = function () {
835 return size;
836 }, size;
837 }
838 }]), AxisRendererHelper;
839}();
840
841
842// CONCATENATED MODULE: ./src/axis/AxisRenderer.js
843
844
845
846/**
847 * Copyright (c) 2017 ~ present NAVER Corp.
848 * billboard.js project is licensed under the MIT license
849 * @ignore
850 */
851
852
853
854
855var AxisRenderer_AxisRenderer =
856/*#__PURE__*/
857function () {
858 function AxisRenderer() {
859 var params = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
860
861 classCallCheck_default()(this, AxisRenderer);
862
863 var config = {
864 innerTickSize: 6,
865 outerTickSize: params.withOuterTick ? 6 : 0,
866 orient: "bottom",
867 range: [],
868 tickArguments: null,
869 tickCentered: null,
870 tickCulling: !0,
871 tickFormat: null,
872 tickLength: 9,
873 tickOffset: 0,
874 tickPadding: 3,
875 tickValues: null,
876 transition: null,
877 withoutTransition: params.withoutTransition
878 };
879 config.tickLength = Math.max(config.innerTickSize, 0) + config.tickPadding, this.helper = new AxisRendererHelper_AxisRendererHelper(config, params), this.config = config, this.params = params;
880 }
881 /**
882 * Create axis element
883 * @param {d3.selection} g
884 * @private
885 */
886
887
888 return createClass_default()(AxisRenderer, [{
889 key: "create",
890 value: function create(g) {
891 var ctx = this,
892 config = this.config,
893 params = this.params,
894 helperInst = this.helper,
895 scale = helperInst.scale,
896 orient = config.orient,
897 splitTickText = this.splitTickText.bind(this),
898 isLeftRight = /^(left|right)$/.test(orient),
899 isTopBottom = /^(top|bottom)$/.test(orient),
900 tickTransform = helperInst[isTopBottom ? "axisX" : "axisY"],
901 axisPx = tickTransform === helperInst.axisX ? "y" : "x",
902 sign = /^(top|left)$/.test(orient) ? -1 : 1,
903 rotate = params.tickTextRotate;
904 this.config.range = scale.rangeExtent ? scale.rangeExtent() : helperInst.scaleExtent((params.orgXScale || scale).range());
905 var _config = config,
906 innerTickSize = _config.innerTickSize,
907 tickLength = _config.tickLength,
908 range = _config.range,
909 tickTextPos = params.axisName && /^(x|y|y2)$/.test(params.axisName) ? params.config["axis_".concat(params.axisName, "_tick_text_position")] : {
910 x: 0,
911 y: 0
912 },
913 $g = null; // get the axis' tick position configuration
914
915 g.each(function () {
916 var g = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this);
917 $g = g;
918 var scale0 = this.__chart__ || scale,
919 scale1 = helperInst.copyScale();
920 this.__chart__ = scale1;
921 // count of tick data in array
922 var ticks = config.tickValues || helperInst.generateTicks(scale1),
923 tick = g.selectAll(".tick").data(ticks, scale1),
924 tickEnter = tick.enter().insert("g", ".domain").attr("class", "tick").style("opacity", "1"),
925 tickExit = tick.exit().remove(); // update selection
926
927 tick = tickEnter.merge(tick);
928 // update selection - data join
929 var path = g.selectAll(".domain").data([0]); // enter + update selection
930
931 path.enter().append("path").attr("class", "domain").merge(helperInst.transitionise(path)).attr("d", function () {
932 var outerTickSized = config.outerTickSize * sign;
933 return isTopBottom ? "M".concat(range[0], ",").concat(outerTickSized, "V0H").concat(range[1], "V").concat(outerTickSized) : "M".concat(outerTickSized, ",").concat(range[0], "H0V").concat(range[1], "H").concat(outerTickSized);
934 }), tickEnter.append("line"), tickEnter.append("text");
935 var sizeFor1Char = AxisRendererHelper_AxisRendererHelper.getSizeFor1Char(tick),
936 counts = [],
937 tspan = tick.select("text").selectAll("tspan").data(function (d, index) {
938 var split = params.tickMultiline ? splitTickText(d, scale1, ticks, isLeftRight, sizeFor1Char.w) : isArray(helperInst.textFormatted(d)) ? helperInst.textFormatted(d).concat() : [helperInst.textFormatted(d)];
939 return counts[index] = split.length, split.map(function (splitted) {
940 return {
941 index: index,
942 splitted: splitted
943 };
944 });
945 });
946 tspan.exit().remove(), tspan = tspan.enter().append("tspan").merge(tspan).text(function (d) {
947 return d.splitted;
948 }), tspan.attr("x", isTopBottom ? 0 : tickLength * sign).attr("dx", function () {
949 var dx = 0;
950 return orient === "bottom" && rotate && (dx = 8 * Math.sin(Math.PI * (rotate / 180))), dx + (tickTextPos.x || 0);
951 }()).attr("dy", function (d, i) {
952 var dy = 0;
953 return orient !== "top" && (dy = sizeFor1Char.h, i === 0 && (dy = isLeftRight ? -((counts[d.index] - 1) * (sizeFor1Char.h / 2) - 3) : tickTextPos.y === 0 ? ".71em" : 0)), isNumber(dy) && tickTextPos.y ? dy + tickTextPos.y : dy || ".71em";
954 });
955 var lineUpdate = tick.select("line"),
956 textUpdate = tick.select("text");
957
958 if (tickEnter.select("line").attr("".concat(axisPx, "2"), innerTickSize * sign), tickEnter.select("text").attr("".concat(axisPx), tickLength * sign), ctx.setTickLineTextPosition(lineUpdate, textUpdate, scale1), params.tickTitle && textUpdate.append && textUpdate.append("title").each(function (index) {
959 Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this).text(params.tickTitle[index]);
960 }), scale1.bandwidth) {
961 var x = scale1,
962 dx = x.bandwidth() / 2;
963 scale0 = function (d) {
964 return x(d) + dx;
965 }, scale1 = scale0;
966 } else scale0.bandwidth ? scale0 = scale1 : tickTransform.call(helperInst, tickExit, scale1);
967
968 tickTransform.call(helperInst, tickEnter, scale0), tickTransform.call(helperInst, helperInst.transitionise(tick).style("opacity", 1), scale1);
969 }), this.g = $g;
970 }
971 /**
972 * Get tick x/y coordinate
973 * @param scale
974 * @return {{x: number, y: number}}
975 * @private
976 */
977
978 }, {
979 key: "getTickXY",
980 value: function getTickXY(scale) {
981 var config = this.config,
982 pos = {
983 x: 0,
984 y: 0
985 };
986 return this.params.isCategory ? (config.tickOffset = Math.ceil((scale(1) - scale(0)) / 2), pos.x = config.tickCentered ? 0 : config.tickOffset, pos.y = config.tickCentered ? config.tickOffset : 0) : config.tickOffset = pos.x, pos;
987 }
988 /**
989 * Get tick size
990 * @param d
991 * @return {number}
992 * @private
993 */
994
995 }, {
996 key: "getTickSize",
997 value: function getTickSize(d) {
998 var scale = this.helper.scale,
999 config = this.config,
1000 innerTickSize = config.innerTickSize,
1001 range = config.range,
1002 tickPosition = scale(d) + (config.tickCentered ? 0 : config.tickOffset);
1003 return range[0] < tickPosition && tickPosition < range[1] ? innerTickSize : 0;
1004 }
1005 /**
1006 * Set tick's line & text position
1007 * @param lineUpdate
1008 * @param textUpdate
1009 * @param scale
1010 * @private
1011 */
1012
1013 }, {
1014 key: "setTickLineTextPosition",
1015 value: function setTickLineTextPosition(lineUpdate, textUpdate, scale) {
1016 var tickPos = this.getTickXY(scale),
1017 _this$config = this.config,
1018 innerTickSize = _this$config.innerTickSize,
1019 orient = _this$config.orient,
1020 tickLength = _this$config.tickLength,
1021 tickOffset = _this$config.tickOffset,
1022 rotate = this.params.tickTextRotate;
1023 orient === "bottom" ? (lineUpdate.attr("x1", tickPos.x).attr("x2", tickPos.x).attr("y2", this.getTickSize.bind(this)), textUpdate.attr("x", 0).attr("y", function yForText(r) {
1024 return r ? 11.5 - 2.5 * (r / 15) * (r > 0 ? 1 : -1) : tickLength;
1025 }(rotate)).style("text-anchor", function textAnchorForText(r) {
1026 return r ? r > 0 ? "start" : "end" : "middle";
1027 }(rotate)).attr("transform", function textTransform(r) {
1028 return r ? "rotate(".concat(r, ")") : null;
1029 }(rotate))) : orient === "top" ? (lineUpdate.attr("x2", 0).attr("y2", -innerTickSize), textUpdate.attr("x", 0).attr("y", -tickLength * 2).style("text-anchor", "middle")) : orient === "left" ? (lineUpdate.attr("x2", -innerTickSize).attr("y1", tickPos.y).attr("y2", tickPos.y), textUpdate.attr("x", -tickLength).attr("y", tickOffset).style("text-anchor", "end")) : orient === "right" ? (lineUpdate.attr("x2", innerTickSize).attr("y2", 0), textUpdate.attr("x", tickLength).attr("y", 0).style("text-anchor", "start")) : void 0;
1030 } // this should be called only when category axis
1031
1032 }, {
1033 key: "splitTickText",
1034 value: function splitTickText(d, scale, ticks, isLeftRight, charWidth) {
1035 function split(splitted, text) {
1036 for (var subtext, spaceIndex, textWidth, i = 1; i < text.length; i++) // if text width gets over tick width, split by space index or current index
1037 if (text.charAt(i) === " " && (spaceIndex = i), subtext = text.substr(0, i + 1), textWidth = charWidth * subtext.length, tickWidth < textWidth) return split(splitted.concat(text.substr(0, spaceIndex || i)), text.slice(spaceIndex ? spaceIndex + 1 : i));
1038
1039 return splitted.concat(text);
1040 }
1041
1042 var params = this.params,
1043 tickText = this.helper.textFormatted(d),
1044 splitted = isString(tickText) && tickText.indexOf("\n") > -1 ? tickText.split("\n") : [];
1045 if (splitted.length) return splitted;
1046 if (isArray(tickText)) return tickText;
1047 var tickWidth = params.tickWidth;
1048 return (!tickWidth || tickWidth <= 0) && (tickWidth = isLeftRight ? 95 : params.isCategory ? Math.ceil(scale(ticks[1]) - scale(ticks[0])) - 12 : 110), split(splitted, tickText + "");
1049 }
1050 }, {
1051 key: "scale",
1052 value: function scale(x) {
1053 return arguments.length ? (this.helper.scale = x, this) : this.helper.scale;
1054 }
1055 }, {
1056 key: "orient",
1057 value: function orient(x) {
1058 return arguments.length ? (this.config.orient = x in {
1059 top: 1,
1060 right: 1,
1061 bottom: 1,
1062 left: 1
1063 } ? x + "" : "bottom", this) : this.config.orient;
1064 }
1065 }, {
1066 key: "tickFormat",
1067 value: function tickFormat(format) {
1068 return arguments.length ? (this.config.tickFormat = format, this) : this.config.tickFormat;
1069 }
1070 }, {
1071 key: "tickCentered",
1072 value: function tickCentered(isCentered) {
1073 var config = this.config;
1074 return arguments.length ? (config.tickCentered = isCentered, this) : config.tickCentered;
1075 }
1076 /**
1077 * Return tick's offset value.
1078 * The value will be set for 'category' axis type.
1079 * @return {number}
1080 * @private
1081 */
1082
1083 }, {
1084 key: "tickOffset",
1085 value: function tickOffset() {
1086 return this.config.tickOffset;
1087 }
1088 /**
1089 * Get tick interval count
1090 * @private
1091 * @param {Number} size Total data size
1092 * @return {number}
1093 */
1094
1095 }, {
1096 key: "tickInterval",
1097 value: function tickInterval(size) {
1098 var interval;
1099 if (this.params.isCategory) interval = this.config.tickOffset * 2;else {
1100 var length = this.g.select("path.domain").node().getTotalLength() - this.config.outerTickSize * 2;
1101 interval = length / (size || this.g.selectAll("line").size());
1102 }
1103 return interval === Infinity ? 0 : interval;
1104 }
1105 }, {
1106 key: "ticks",
1107 value: function ticks() {
1108 for (var config = this.config, _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) args[_key] = arguments[_key];
1109
1110 return args.length ? (config.tickArguments = toArray(args), this) : config.tickArguments;
1111 }
1112 }, {
1113 key: "tickCulling",
1114 value: function tickCulling(culling) {
1115 var config = this.config;
1116 return arguments.length ? (config.tickCulling = culling, this) : config.tickCulling;
1117 }
1118 }, {
1119 key: "tickValues",
1120 value: function tickValues(x) {
1121 var _this = this,
1122 config = this.config;
1123
1124 if (isFunction(x)) config.tickValues = function () {
1125 return x(_this.helper.scale.domain());
1126 };else {
1127 if (!arguments.length) return config.tickValues;
1128 config.tickValues = x;
1129 }
1130 return this;
1131 }
1132 }, {
1133 key: "setTransition",
1134 value: function setTransition(t) {
1135 return this.config.transition = t, this;
1136 }
1137 }]), AxisRenderer;
1138}();
1139
1140
1141// CONCATENATED MODULE: ./src/axis/Axis.js
1142
1143
1144
1145
1146/**
1147 * Copyright (c) 2017 ~ present NAVER Corp.
1148 * billboard.js project is licensed under the MIT license
1149 */
1150
1151
1152
1153
1154
1155var isHorizontal = function ($$, forHorizontal) {
1156 var isRotated = $$.config.axis_rotated;
1157 return forHorizontal ? isRotated : !isRotated;
1158},
1159 getAxisClassName = function (id) {
1160 return "".concat(config_classes.axis, " ").concat(config_classes["axis".concat(capitalize(id))]);
1161};
1162
1163var Axis_Axis =
1164/*#__PURE__*/
1165function () {
1166 function Axis(owner) {
1167 classCallCheck_default()(this, Axis), this.owner = owner;
1168 }
1169
1170 return createClass_default()(Axis, [{
1171 key: "init",
1172 value: function init() {
1173 var _this = this,
1174 $$ = this.owner,
1175 config = $$.config,
1176 isRotated = config.axis_rotated,
1177 main = $$.main;
1178
1179 $$.axesList = {}, ["x", "y", "y2"].forEach(function (v) {
1180 var classAxis = getAxisClassName(v),
1181 classLabel = config_classes["axis".concat(capitalize(v), "Label")];
1182 $$.axes[v] = main.append("g").attr("class", classAxis).attr("clip-path", function () {
1183 var res = null;
1184 return v === "x" ? res = $$.clipPathForXAxis : v === "y" && config.axis_y_inner && (res = $$.clipPathForYAxis), res;
1185 }).attr("transform", $$.getTranslate(v)).style("visibility", config["axis_".concat(v, "_show")] ? "visible" : "hidden"), $$.axes[v].append("text").attr("class", classLabel).attr("transform", ["rotate(-90)", null][v === "x" ? +!isRotated : +isRotated]).style("text-anchor", _this.textAnchorForXAxisLabel.bind(_this)), _this.generateAxes(v);
1186 });
1187 }
1188 /**
1189 * Generate axes
1190 * It's used when axis' axes option is set
1191 * @param {String} id Axis id
1192 * @private
1193 */
1194
1195 }, {
1196 key: "generateAxes",
1197 value: function generateAxes(id) {
1198 var d3Axis,
1199 $$ = this.owner,
1200 config = $$.config,
1201 axes = [],
1202 axesConfig = config["axis_".concat(id, "_axes")],
1203 isRotated = config.axis_rotated;
1204 id === "x" ? d3Axis = isRotated ? external_commonjs_d3_axis_commonjs2_d3_axis_amd_d3_axis_root_d3_["axisLeft"] : external_commonjs_d3_axis_commonjs2_d3_axis_amd_d3_axis_root_d3_["axisBottom"] : id === "y" ? d3Axis = isRotated ? external_commonjs_d3_axis_commonjs2_d3_axis_amd_d3_axis_root_d3_["axisBottom"] : external_commonjs_d3_axis_commonjs2_d3_axis_amd_d3_axis_root_d3_["axisLeft"] : id === "y2" && (d3Axis = isRotated ? external_commonjs_d3_axis_commonjs2_d3_axis_amd_d3_axis_root_d3_["axisTop"] : external_commonjs_d3_axis_commonjs2_d3_axis_amd_d3_axis_root_d3_["axisRight"]), axesConfig.length && axesConfig.forEach(function (v) {
1205 var tick = v.tick;
1206 axes.push(d3Axis($$[id]).ticks(tick.count).tickFormat(tick.format || function (x) {
1207 return x;
1208 }).tickValues(tick.values).tickSizeOuter(tick.outer === !1 ? 0 : 6));
1209 }), $$.axesList[id] = axes;
1210 }
1211 /**
1212 * Update axes nodes
1213 * @private
1214 */
1215
1216 }, {
1217 key: "updateAxes",
1218 value: function updateAxes() {
1219 var $$ = this.owner,
1220 config = $$.config;
1221 Object.keys($$.axesList).forEach(function (id) {
1222 $$.axesList[id].forEach(function (v, i) {
1223 var className = "".concat(getAxisClassName(id), "-").concat(i + 1),
1224 g = $$.main.select(".".concat(className.replace(/\s/, ".")));
1225 g.empty() ? g = $$.main.append("g").attr("class", className).style("visibility", config["axis_".concat(id, "_show")] ? "visible" : "hidden").call(v) : $$.xAxis.helper.transitionise(g).call(v.scale($$[id])), g.attr("transform", $$.getTranslate(id, i + 1));
1226 });
1227 });
1228 }
1229 }, {
1230 key: "getXAxis",
1231 value: function getXAxis(axisName, scale, orient, tickFormat, tickValues, withOuterTick, withoutTransition, withoutRotateTickText) {
1232 var $$ = this.owner,
1233 config = $$.config,
1234 isCategory = $$.isCategorized(),
1235 axisParams = {
1236 isCategory: isCategory,
1237 withOuterTick: withOuterTick,
1238 withoutTransition: withoutTransition,
1239 config: config,
1240 axisName: axisName,
1241 tickMultiline: config.axis_x_tick_multiline,
1242 tickWidth: config.axis_x_tick_width,
1243 tickTextRotate: withoutRotateTickText ? 0 : config.axis_x_tick_rotate,
1244 tickTitle: isCategory && config.axis_x_tick_tooltip && $$.api.categories(),
1245 orgXScale: $$.x
1246 },
1247 axis = new AxisRenderer_AxisRenderer(axisParams).scale($$.zoomScale || scale).orient(orient),
1248 newTickValues = tickValues;
1249 return $$.isTimeSeries() && tickValues && !isFunction(tickValues) && (newTickValues = tickValues.map(function (v) {
1250 return $$.parseDate(v);
1251 })), axis.tickFormat(tickFormat).tickValues(newTickValues), isCategory && (axis.tickCentered(config.axis_x_tick_centered), isEmpty(config.axis_x_tick_culling) && (config.axis_x_tick_culling = !1)), axis;
1252 }
1253 }, {
1254 key: "getYAxis",
1255 value: function getYAxis(axisName, scale, orient, tickFormat, tickValues, withOuterTick, withoutTransition, withoutRotateTickText) {
1256 var $$ = this.owner,
1257 config = $$.config,
1258 axisParams = {
1259 withOuterTick: withOuterTick,
1260 withoutTransition: withoutTransition,
1261 config: config,
1262 axisName: axisName,
1263 tickTextRotate: withoutRotateTickText ? 0 : config.axis_y_tick_rotate
1264 },
1265 axis = new AxisRenderer_AxisRenderer(axisParams).scale(scale).orient(orient).tickFormat(tickFormat || $$.isStackNormalized() && function (x) {
1266 return "".concat(x, "%");
1267 });
1268 return $$.isTimeSeriesY() ? // https://github.com/d3/d3/blob/master/CHANGES.md#time-intervals-d3-time
1269 axis.ticks(config.axis_y_tick_time_value) : axis.tickValues(tickValues), axis;
1270 }
1271 }, {
1272 key: "updateXAxisTickValues",
1273 value: function updateXAxisTickValues(targets, axis) {
1274 var tickValues,
1275 $$ = this.owner,
1276 config = $$.config,
1277 xTickCount = config.axis_x_tick_count;
1278 return (config.axis_x_tick_fit || xTickCount) && (tickValues = this.generateTickValues($$.mapTargetsToUniqueXs(targets), xTickCount, $$.isTimeSeries())), axis ? axis.tickValues(tickValues) : ($$.xAxis.tickValues(tickValues), $$.subXAxis.tickValues(tickValues)), tickValues;
1279 }
1280 }, {
1281 key: "getId",
1282 value: function getId(id) {
1283 var config = this.owner.config;
1284 return id in config.data_axes ? config.data_axes[id] : "y";
1285 }
1286 }, {
1287 key: "getXAxisTickFormat",
1288 value: function getXAxisTickFormat() {
1289 var format,
1290 $$ = this.owner,
1291 config = $$.config,
1292 tickFormat = config.axis_x_tick_format,
1293 isTimeSeries = $$.isTimeSeries(),
1294 isCategorized = $$.isCategorized();
1295 return tickFormat ? isFunction(tickFormat) ? format = tickFormat : isTimeSeries && (format = function (date) {
1296 return date ? $$.axisTimeFormat(tickFormat)(date) : "";
1297 }) : format = isTimeSeries ? $$.defaultAxisTimeFormat : isCategorized ? $$.categoryName : function (v) {
1298 return v < 0 ? v.toFixed(0) : v;
1299 }, isFunction(format) ? function (v) {
1300 return format.apply($$, isCategorized ? [v, $$.categoryName(v)] : [v]);
1301 } : format;
1302 }
1303 }, {
1304 key: "getTickValues",
1305 value: function getTickValues(type) {
1306 var $$ = this.owner,
1307 tickValues = $$.config["axis_".concat(type, "_tick_values")],
1308 axis = $$["".concat(type, "Axis")];
1309 return tickValues || (axis ? axis.tickValues() : undefined);
1310 }
1311 }, {
1312 key: "getXAxisTickValues",
1313 value: function getXAxisTickValues() {
1314 return this.getTickValues("x");
1315 }
1316 }, {
1317 key: "getYAxisTickValues",
1318 value: function getYAxisTickValues() {
1319 return this.getTickValues("y");
1320 }
1321 }, {
1322 key: "getY2AxisTickValues",
1323 value: function getY2AxisTickValues() {
1324 return this.getTickValues("y2");
1325 }
1326 }, {
1327 key: "getLabelOptionByAxisId",
1328 value: function getLabelOptionByAxisId(axisId) {
1329 return this.owner.config["axis_".concat(axisId, "_label")];
1330 }
1331 }, {
1332 key: "getLabelText",
1333 value: function getLabelText(axisId) {
1334 var option = this.getLabelOptionByAxisId(axisId);
1335 return isString(option) ? option : option ? option.text : null;
1336 }
1337 }, {
1338 key: "setLabelText",
1339 value: function setLabelText(axisId, text) {
1340 var $$ = this.owner,
1341 config = $$.config,
1342 option = this.getLabelOptionByAxisId(axisId);
1343 isString(option) ? config["axis_".concat(axisId, "_label")] = text : option && (option.text = text);
1344 }
1345 }, {
1346 key: "getLabelPosition",
1347 value: function getLabelPosition(axisId, defaultPosition) {
1348 var isRotated = this.owner.config.axis_rotated,
1349 option = this.getLabelOptionByAxisId(axisId),
1350 position = isObjectType(option) && option.position ? option.position : defaultPosition[+!isRotated],
1351 has = function (v) {
1352 return !!~position.indexOf(v);
1353 };
1354
1355 return {
1356 isInner: has("inner"),
1357 isOuter: has("outer"),
1358 isLeft: has("left"),
1359 isCenter: has("center"),
1360 isRight: has("right"),
1361 isTop: has("top"),
1362 isMiddle: has("middle"),
1363 isBottom: has("bottom")
1364 };
1365 }
1366 }, {
1367 key: "getXAxisLabelPosition",
1368 value: function getXAxisLabelPosition() {
1369 return this.getLabelPosition("x", ["inner-top", "inner-right"]);
1370 }
1371 }, {
1372 key: "getYAxisLabelPosition",
1373 value: function getYAxisLabelPosition() {
1374 return this.getLabelPosition("y", ["inner-right", "inner-top"]);
1375 }
1376 }, {
1377 key: "getY2AxisLabelPosition",
1378 value: function getY2AxisLabelPosition() {
1379 return this.getLabelPosition("y2", ["inner-right", "inner-top"]);
1380 }
1381 }, {
1382 key: "getLabelPositionById",
1383 value: function getLabelPositionById(id) {
1384 return this["get".concat(id.toUpperCase(), "AxisLabelPosition")]();
1385 }
1386 }, {
1387 key: "textForXAxisLabel",
1388 value: function textForXAxisLabel() {
1389 return this.getLabelText("x");
1390 }
1391 }, {
1392 key: "textForYAxisLabel",
1393 value: function textForYAxisLabel() {
1394 return this.getLabelText("y");
1395 }
1396 }, {
1397 key: "textForY2AxisLabel",
1398 value: function textForY2AxisLabel() {
1399 return this.getLabelText("y2");
1400 }
1401 }, {
1402 key: "xForAxisLabel",
1403 value: function xForAxisLabel(position) {
1404 var forHorizontal = !(arguments.length > 1 && arguments[1] !== undefined) || arguments[1],
1405 $$ = this.owner,
1406 x = position.isMiddle ? -$$.height / 2 : 0;
1407 return isHorizontal($$, forHorizontal) ? x = position.isLeft ? 0 : position.isCenter ? $$.width / 2 : $$.width : position.isBottom && (x = -$$.height), x;
1408 }
1409 }, {
1410 key: "dxForAxisLabel",
1411 value: function dxForAxisLabel(position) {
1412 var forHorizontal = !(arguments.length > 1 && arguments[1] !== undefined) || arguments[1],
1413 $$ = this.owner,
1414 dx = position.isBottom ? "0.5em" : "0";
1415 return isHorizontal($$, forHorizontal) ? dx = position.isLeft ? "0.5em" : position.isRight ? "-0.5em" : "0" : position.isTop && (dx = "-0.5em"), dx;
1416 }
1417 }, {
1418 key: "textAnchorForAxisLabel",
1419 value: function textAnchorForAxisLabel(position) {
1420 var forHorizontal = !(arguments.length > 1 && arguments[1] !== undefined) || arguments[1],
1421 $$ = this.owner,
1422 anchor = position.isMiddle ? "middle" : "end";
1423 return isHorizontal($$, forHorizontal) ? anchor = position.isLeft ? "start" : position.isCenter ? "middle" : "end" : position.isBottom && (anchor = "start"), anchor;
1424 }
1425 }, {
1426 key: "xForXAxisLabel",
1427 value: function xForXAxisLabel() {
1428 return this.xForAxisLabel(this.getXAxisLabelPosition(), !1);
1429 }
1430 }, {
1431 key: "xForYAxisLabel",
1432 value: function xForYAxisLabel() {
1433 return this.xForAxisLabel(this.getYAxisLabelPosition());
1434 }
1435 }, {
1436 key: "xForY2AxisLabel",
1437 value: function xForY2AxisLabel() {
1438 return this.xForAxisLabel(this.getY2AxisLabelPosition());
1439 }
1440 }, {
1441 key: "dxForXAxisLabel",
1442 value: function dxForXAxisLabel() {
1443 return this.dxForAxisLabel(this.getXAxisLabelPosition(), !1);
1444 }
1445 }, {
1446 key: "dxForYAxisLabel",
1447 value: function dxForYAxisLabel() {
1448 return this.dxForAxisLabel(this.getYAxisLabelPosition());
1449 }
1450 }, {
1451 key: "dxForY2AxisLabel",
1452 value: function dxForY2AxisLabel() {
1453 return this.dxForAxisLabel(this.getY2AxisLabelPosition());
1454 }
1455 }, {
1456 key: "dyForXAxisLabel",
1457 value: function dyForXAxisLabel() {
1458 var $$ = this.owner,
1459 config = $$.config,
1460 isInner = this.getXAxisLabelPosition().isInner,
1461 xHeight = config.axis_x_height;
1462 return config.axis_rotated ? isInner ? "1.2em" : -25 - this.getMaxTickWidth("x") : isInner ? "-0.5em" : xHeight ? xHeight - 10 : "3em";
1463 }
1464 }, {
1465 key: "dyForYAxisLabel",
1466 value: function dyForYAxisLabel() {
1467 var $$ = this.owner,
1468 isInner = this.getYAxisLabelPosition().isInner;
1469 return $$.config.axis_rotated ? isInner ? "-0.5em" : "3em" : isInner ? "1.2em" : -10 - ($$.config.axis_y_inner ? 0 : this.getMaxTickWidth("y") + 10);
1470 }
1471 }, {
1472 key: "dyForY2AxisLabel",
1473 value: function dyForY2AxisLabel() {
1474 var $$ = this.owner,
1475 isInner = this.getY2AxisLabelPosition().isInner;
1476 return $$.config.axis_rotated ? isInner ? "1.2em" : "-2.2em" : isInner ? "-0.5em" : 15 + ($$.config.axis_y2_inner ? 0 : this.getMaxTickWidth("y2") + 15);
1477 }
1478 }, {
1479 key: "textAnchorForXAxisLabel",
1480 value: function textAnchorForXAxisLabel() {
1481 return this.textAnchorForAxisLabel(this.getXAxisLabelPosition(), !1);
1482 }
1483 }, {
1484 key: "textAnchorForYAxisLabel",
1485 value: function textAnchorForYAxisLabel() {
1486 return this.textAnchorForAxisLabel(this.getYAxisLabelPosition());
1487 }
1488 }, {
1489 key: "textAnchorForY2AxisLabel",
1490 value: function textAnchorForY2AxisLabel() {
1491 return this.textAnchorForAxisLabel(this.getY2AxisLabelPosition());
1492 }
1493 }, {
1494 key: "getMaxTickWidth",
1495 value: function getMaxTickWidth(id, withoutRecompute) {
1496 var $$ = this.owner,
1497 config = $$.config,
1498 currentTickMax = $$.currentMaxTickWidths,
1499 maxWidth = 0;
1500 if (withoutRecompute && currentTickMax[id]) return currentTickMax[id];
1501
1502 if ($$.svg) {
1503 var isYAxis = /^y2?$/.test(id),
1504 targetsToShow = $$.filterTargetsToShow($$.data.targets),
1505 getFrom = isYAxis ? "getY" : "getX",
1506 scale = $$[id].copy().domain($$["".concat(getFrom, "Domain")](targetsToShow, id)),
1507 axis = this["".concat(getFrom, "Axis")](id, scale, $$["".concat(id, "Orient")], isYAxis ? config["axis_".concat(id, "_tick_format")] : $$.xAxisTickFormat, null, !1, !0, !0);
1508 isYAxis || this.updateXAxisTickValues(targetsToShow, axis);
1509 var dummy = $$.selectChart.append("svg").style("visibility", "hidden").style("position", "fixed").style("top", "0px").style("left", "0px");
1510 axis.create(dummy), dummy.selectAll("text").each(function () {
1511 maxWidth = Math.max(maxWidth, this.getBoundingClientRect().width);
1512 }), dummy.remove();
1513 }
1514
1515 return maxWidth > 0 && (currentTickMax[id] = maxWidth), currentTickMax[id];
1516 }
1517 }, {
1518 key: "updateLabels",
1519 value: function updateLabels(withTransition) {
1520 var _this2 = this,
1521 $$ = this.owner,
1522 labels = {
1523 X: $$.main.select(".".concat(config_classes.axisX, " .").concat(config_classes.axisXLabel)),
1524 Y: $$.main.select(".".concat(config_classes.axisY, " .").concat(config_classes.axisYLabel)),
1525 Y2: $$.main.select(".".concat(config_classes.axisY2, " .").concat(config_classes.axisY2Label))
1526 };
1527
1528 Object.keys(labels).forEach(function (v) {
1529 var node = labels[v],
1530 axisLabel = "".concat(v, "AxisLabel");
1531 (withTransition ? node.transition() : node).attr("x", _this2["xFor".concat(axisLabel)].bind(_this2)).attr("dx", _this2["dxFor".concat(axisLabel)].bind(_this2)).attr("dy", _this2["dyFor".concat(axisLabel)].bind(_this2)).text(_this2["textFor".concat(axisLabel)].bind(_this2));
1532 });
1533 }
1534 }, {
1535 key: "getPadding",
1536 value: function getPadding(padding, key, defaultValue, domainLength) {
1537 var p = isNumber(padding) ? padding : padding[key];
1538 return isValue(p) ? padding.unit === "ratio" ? padding[key] * domainLength : this.convertPixelsToAxisPadding(p, domainLength) : defaultValue; // assume padding is pixels if unit is not specified
1539 }
1540 }, {
1541 key: "convertPixelsToAxisPadding",
1542 value: function convertPixelsToAxisPadding(pixels, domainLength) {
1543 var $$ = this.owner,
1544 length = $$.config.axis_rotated ? $$.width : $$.height;
1545 return domainLength * (pixels / length);
1546 }
1547 }, {
1548 key: "generateTickValues",
1549 value: function generateTickValues(values, tickCount, forTimeSeries) {
1550 var start,
1551 end,
1552 count,
1553 interval,
1554 i,
1555 tickValue,
1556 tickValues = values;
1557
1558 if (tickCount) {
1559 var targetCount = isFunction(tickCount) ? tickCount() : tickCount; // compute ticks according to tickCount
1560
1561 if (targetCount === 1) tickValues = [values[0]];else if (targetCount === 2) tickValues = [values[0], values[values.length - 1]];else if (targetCount > 2) {
1562 for (count = targetCount - 2, start = values[0], end = values[values.length - 1], interval = (end - start) / (count + 1), tickValues = [start], i = 0; i < count; i++) tickValue = +start + interval * (i + 1), tickValues.push(forTimeSeries ? new Date(tickValue) : tickValue);
1563
1564 tickValues.push(end);
1565 }
1566 }
1567
1568 return forTimeSeries || (tickValues = tickValues.sort(function (a, b) {
1569 return a - b;
1570 })), tickValues;
1571 }
1572 }, {
1573 key: "generateTransitions",
1574 value: function generateTransitions(duration) {
1575 var $$ = this.owner,
1576 axes = $$.axes,
1577 _map = ["x", "y", "y2", "subx"].map(function (v) {
1578 return duration ? axes[v].transition().duration(duration) : axes[v];
1579 }),
1580 _map2 = slicedToArray_default()(_map, 4),
1581 axisX = _map2[0],
1582 axisY = _map2[1],
1583 axisY2 = _map2[2],
1584 axisSubX = _map2[3];
1585
1586 return {
1587 axisX: axisX,
1588 axisY: axisY,
1589 axisY2: axisY2,
1590 axisSubX: axisSubX
1591 };
1592 }
1593 }, {
1594 key: "redraw",
1595 value: function redraw(transitions, isHidden) {
1596 var $$ = this.owner,
1597 opacity = isHidden ? "0" : "1";
1598 ["x", "y", "y2", "subx"].forEach(function (v) {
1599 $$.axes[v].style("opacity", opacity);
1600 }), $$.xAxis.create(transitions.axisX), $$.yAxis.create(transitions.axisY), $$.y2Axis.create(transitions.axisY2), $$.subXAxis.create(transitions.axisSubX), this.updateAxes();
1601 }
1602 }]), Axis;
1603}();
1604
1605
1606// CONCATENATED MODULE: ./src/internals/ChartInternal.js
1607
1608
1609
1610
1611/**
1612 * Copyright (c) 2017 ~ present NAVER Corp.
1613 * billboard.js project is licensed under the MIT license
1614 * @ignore
1615 */
1616
1617
1618
1619
1620
1621
1622
1623/**
1624 * Internal chart class.
1625 * - Note: Instantiated internally, not exposed for public.
1626 * @class ChartInternal
1627 * @ignore
1628 * @private
1629*/
1630
1631var ChartInternal_ChartInternal =
1632/*#__PURE__*/
1633function () {
1634 function ChartInternal(api) {
1635 classCallCheck_default()(this, ChartInternal);
1636
1637 var $$ = this;
1638 $$.api = api, $$.config = $$.getOptions(), $$.data = {}, $$.cache = {}, $$.axes = {};
1639 }
1640
1641 return createClass_default()(ChartInternal, [{
1642 key: "beforeInit",
1643 value: function beforeInit() {
1644 var $$ = this; // can do something
1645
1646 callFn($$.config.onbeforeinit, $$);
1647 }
1648 }, {
1649 key: "afterInit",
1650 value: function afterInit() {
1651 var $$ = this; // can do something
1652
1653 callFn($$.config.onafterinit, $$);
1654 }
1655 }, {
1656 key: "init",
1657 value: function init() {
1658 var convertedData,
1659 $$ = this,
1660 config = $$.config;
1661 if ($$.initParams(), config.data_url) $$.convertUrlToData(config.data_url, config.data_mimeType, config.data_headers, config.data_keys, $$.initWithData);else if (config.data_json) convertedData = $$.convertJsonToData(config.data_json, config.data_keys);else if (config.data_rows) convertedData = $$.convertRowsToData(config.data_rows);else if (config.data_columns) convertedData = $$.convertColumnsToData(config.data_columns);else throw Error("url or json or rows or columns is required.");
1662 convertedData && $$.initWithData(convertedData);
1663 }
1664 }, {
1665 key: "initParams",
1666 value: function initParams() {
1667 var $$ = this,
1668 config = $$.config,
1669 isRotated = config.axis_rotated;
1670 $$.datetimeId = "bb-".concat(+new Date()), $$.clipId = "".concat($$.datetimeId, "-clip"), $$.clipIdForXAxis = "".concat($$.clipId, "-xaxis"), $$.clipIdForYAxis = "".concat($$.clipId, "-yaxis"), $$.clipIdForGrid = "".concat($$.clipId, "-grid"), $$.clipIdForSubchart = "".concat($$.clipId, "-subchart"), $$.clipPath = $$.getClipPath($$.clipId), $$.clipPathForXAxis = $$.getClipPath($$.clipIdForXAxis), $$.clipPathForYAxis = $$.getClipPath($$.clipIdForYAxis), $$.clipPathForGrid = $$.getClipPath($$.clipIdForGrid), $$.clipPathForSubchart = $$.getClipPath($$.clipIdForSubchart), $$.dragStart = null, $$.dragging = !1, $$.flowing = !1, $$.cancelClick = !1, $$.mouseover = !1, $$.transiting = !1, $$.color = $$.generateColor(), $$.levelColor = $$.generateLevelColor(), $$.point = $$.generatePoint(), $$.extraLineClasses = $$.generateExtraLineClass(), $$.dataTimeFormat = config.data_xLocaltime ? external_commonjs_d3_time_format_commonjs2_d3_time_format_amd_d3_time_format_root_d3_["timeParse"] : external_commonjs_d3_time_format_commonjs2_d3_time_format_amd_d3_time_format_root_d3_["utcParse"], $$.axisTimeFormat = config.axis_x_localtime ? external_commonjs_d3_time_format_commonjs2_d3_time_format_amd_d3_time_format_root_d3_["timeFormat"] : external_commonjs_d3_time_format_commonjs2_d3_time_format_amd_d3_time_format_root_d3_["utcFormat"], $$.defaultAxisTimeFormat = function (d) {
1671 var specifier = d.getMilliseconds() && ".%L" || d.getSeconds() && ".:%S" || d.getMinutes() && "%I:%M" || d.getHours() && "%I %p" || d.getDay() && d.getDate() !== 1 && "%-m/%-d" || d.getDate() !== 1 && "%b %d" || d.getMonth() && "%-m/%-d" || "%Y/%-m/%-d";
1672 return $$.axisTimeFormat(specifier)(d);
1673 }, $$.hiddenTargetIds = [], $$.hiddenLegendIds = [], $$.focusedTargetIds = [], $$.defocusedTargetIds = [], $$.xOrient = isRotated ? "left" : "bottom", $$.yOrient = isRotated ? config.axis_y_inner ? "top" : "bottom" : config.axis_y_inner ? "right" : "left", $$.y2Orient = isRotated ? config.axis_y2_inner ? "bottom" : "top" : config.axis_y2_inner ? "left" : "right", $$.subXOrient = isRotated ? "left" : "bottom", $$.isLegendRight = config.legend_position === "right", $$.isLegendInset = config.legend_position === "inset", $$.isLegendTop = config.legend_inset_anchor === "top-left" || config.legend_inset_anchor === "top-right", $$.isLegendLeft = config.legend_inset_anchor === "top-left" || config.legend_inset_anchor === "bottom-left", $$.legendStep = 0, $$.legendItemWidth = 0, $$.legendItemHeight = 0, $$.currentMaxTickWidths = {
1674 x: 0,
1675 y: 0,
1676 y2: 0
1677 }, $$.rotated_padding_left = 30, $$.rotated_padding_right = isRotated && !config.axis_x_show ? 0 : 30, $$.rotated_padding_top = 5, $$.withoutFadeIn = {}, $$.inputType = $$.convertInputType(), $$.axes.subx = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["selectAll"])([]);
1678 }
1679 }, {
1680 key: "initWithData",
1681 value: function initWithData(data) {
1682 var $$ = this,
1683 config = $$.config;
1684 $$.axis = new Axis_Axis($$), config.subchart_show && $$.initBrush(), config.zoom_enabled && ($$.initZoom(), $$.initZoomBehaviour());
1685 var bindto = {
1686 element: config.bindto,
1687 classname: "bb"
1688 };
1689
1690 if (isObject(config.bindto) && (bindto.element = config.bindto.element || "#chart", bindto.classname = config.bindto.classname || bindto.classname), $$.selectChart = isFunction(bindto.element.node) ? config.bindto.element : Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(bindto.element ? bindto.element : []), $$.selectChart.html("").classed(bindto.classname, !0), $$.data.xs = {}, $$.data.targets = $$.convertDataToTargets(data), config.data_filter && ($$.data.targets = $$.data.targets.filter(config.data_filter)), config.data_hide && $$.addHiddenTargetIds(config.data_hide === !0 ? $$.mapToIds($$.data.targets) : config.data_hide), config.legend_hide && $$.addHiddenLegendIds(config.legend_hide === !0 ? $$.mapToIds($$.data.targets) : config.legend_hide), $$.hasType("gauge") && (config.legend_show = !1), $$.updateSizes(), $$.updateScales(), $$.x.domain(Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["extent"])($$.getXDomain($$.data.targets))), $$.y.domain($$.getYDomain($$.data.targets, "y")), $$.y2.domain($$.getYDomain($$.data.targets, "y2")), $$.subX.domain($$.x.domain()), $$.subY.domain($$.y.domain()), $$.subY2.domain($$.y2.domain()), $$.orgXDomain = $$.x.domain(), $$.svg = $$.selectChart.append("svg").style("overflow", "hidden").style("display", "block"), config.interaction_enabled && $$.inputType) {
1691 var isTouch = $$.inputType === "touch";
1692 $$.svg.on(isTouch ? "touchstart" : "mouseenter", function () {
1693 return callFn(config.onover, $$);
1694 }).on(isTouch ? "touchend" : "mouseleave", function () {
1695 return callFn(config.onout, $$);
1696 });
1697 }
1698
1699 config.svg_classname && $$.svg.attr("class", config.svg_classname), $$.defs = $$.svg.append("defs"), $$.clipChart = $$.appendClip($$.defs, $$.clipId), $$.clipXAxis = $$.appendClip($$.defs, $$.clipIdForXAxis), $$.clipYAxis = $$.appendClip($$.defs, $$.clipIdForYAxis), $$.clipGrid = $$.appendClip($$.defs, $$.clipIdForGrid), $$.clipSubchart = $$.appendClip($$.defs, $$.clipIdForSubchart), isFunction(config.color_tiles) && $$.patterns && $$.patterns.forEach(function (p) {
1700 return $$.defs.append(function () {
1701 return p.node;
1702 });
1703 }), $$.updateSvgSize();
1704 // Define regions
1705 var main = $$.svg.append("g").attr("transform", $$.getTranslate("main"));
1706
1707 // data.onmin/max callback
1708 if ($$.main = main, config.subchart_show && $$.initSubchart && $$.initSubchart(), $$.initTooltip && $$.initTooltip(), $$.initLegend && $$.initLegend(), $$.initTitle && $$.initTitle(), main.append("text").attr("class", "".concat(config_classes.text, " ").concat(config_classes.empty)).attr("text-anchor", "middle") // horizontal centering of text at x position in all browsers.
1709 .attr("dominant-baseline", "middle"), $$.initRegion(), $$.initGrid(), config.clipPath || $$.axis.init(), main.append("g").attr("class", config_classes.chart).attr("clip-path", $$.clipPath), config.grid_lines_front && $$.initGridLines(), config.grid_front && $$.initXYFocusGrid(), $$.initEventRect(), $$.initChartElements(), main.insert("rect", config.zoom_privileged ? null : "g.".concat(config_classes.regions)).attr("class", config_classes.zoomRect).attr("width", $$.width).attr("height", $$.height).style("opacity", "0").on("dblclick.zoom", null), config.axis_x_extent && $$.brush.scale($$.getDefaultExtent()), config.clipPath && $$.axis.init(), $$.updateTargets($$.data.targets), $$.updateDimension(), config.oninit.call($$), $$.redraw({
1710 withTransition: !1,
1711 withTransform: !0,
1712 withUpdateXDomain: !0,
1713 withUpdateOrgXDomain: !0,
1714 withTransitionForAxis: !1,
1715 initializing: !0
1716 }), config.data_onmin || config.data_onmax) {
1717 var minMax = $$.getMinMaxData();
1718 callFn(config.data_onmin, $$, minMax.min), callFn(config.data_onmax, $$, minMax.max);
1719 } // Bind resize event
1720
1721
1722 $$.bindResize(), $$.api.element = $$.selectChart.node();
1723 }
1724 }, {
1725 key: "initChartElements",
1726 value: function initChartElements() {
1727 var _this = this;
1728
1729 ["Pie", "Bar", "Line", "Arc", "Gauge", "Bubble", "Radar", "Text"].forEach(function (v) {
1730 var method = "init".concat(v);
1731 _this[method] && _this[method]();
1732 });
1733 }
1734 }, {
1735 key: "getChartElements",
1736 value: function getChartElements() {
1737 var $$ = this;
1738 return {
1739 chart: $$.selectChart,
1740 svg: $$.svg,
1741 defs: $$.defs,
1742 main: $$.main,
1743 tooltip: $$.tooltip,
1744 legend: $$.legend,
1745 title: $$.title,
1746 grid: $$.grid,
1747 arc: $$.arcs,
1748 bar: {
1749 bars: $$.mainBar
1750 },
1751 line: {
1752 lines: $$.mainLine,
1753 areas: $$.mainArea,
1754 circles: $$.mainCircle
1755 },
1756 text: {
1757 texts: $$.texts
1758 }
1759 };
1760 }
1761 }, {
1762 key: "smoothLines",
1763 value: function smoothLines(el, type) {
1764 type === "grid" && el.each(function () {
1765 var g = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this),
1766 _map = ["x1", "x2", "y1", "y2"].map(function (v) {
1767 return Math.ceil(g.attr(v));
1768 }),
1769 _map2 = slicedToArray_default()(_map, 4),
1770 x1 = _map2[0],
1771 x2 = _map2[1],
1772 y1 = _map2[2],
1773 y2 = _map2[3];
1774
1775 g.attr({
1776 x1: x1,
1777 x2: x2,
1778 y1: y1,
1779 y2: y2
1780 });
1781 });
1782 }
1783 }, {
1784 key: "updateSizes",
1785 value: function updateSizes() {
1786 var $$ = this,
1787 config = $$.config,
1788 isRotated = config.axis_rotated,
1789 hasArc = $$.hasArcType(),
1790 legendHeight = $$.legend ? $$.getLegendHeight() : 0,
1791 legendWidth = $$.legend ? $$.getLegendWidth() : 0,
1792 legendHeightForBottom = $$.isLegendRight || $$.isLegendInset ? 0 : legendHeight,
1793 xAxisHeight = isRotated || hasArc ? 0 : $$.getHorizontalAxisHeight("x"),
1794 subchartHeight = config.subchart_show && !hasArc ? config.subchart_size_height + xAxisHeight : 0;
1795 $$.currentWidth = $$.getCurrentWidth(), $$.currentHeight = $$.getCurrentHeight(), $$.margin = isRotated ? {
1796 top: $$.getHorizontalAxisHeight("y2") + $$.getCurrentPaddingTop(),
1797 right: hasArc ? 0 : $$.getCurrentPaddingRight(),
1798 bottom: $$.getHorizontalAxisHeight("y") + legendHeightForBottom + $$.getCurrentPaddingBottom(),
1799 left: subchartHeight + (hasArc ? 0 : $$.getCurrentPaddingLeft())
1800 } : {
1801 top: 4 + $$.getCurrentPaddingTop(),
1802 // for top tick text
1803 right: hasArc ? 0 : $$.getCurrentPaddingRight(),
1804 bottom: xAxisHeight + subchartHeight + legendHeightForBottom + $$.getCurrentPaddingBottom(),
1805 left: hasArc ? 0 : $$.getCurrentPaddingLeft()
1806 }, $$.margin2 = isRotated ? {
1807 top: $$.margin.top,
1808 right: NaN,
1809 bottom: 20 + legendHeightForBottom,
1810 left: $$.rotated_padding_left
1811 } : {
1812 top: $$.currentHeight - subchartHeight - legendHeightForBottom,
1813 right: NaN,
1814 bottom: xAxisHeight + legendHeightForBottom,
1815 left: $$.margin.left
1816 }, $$.margin3 = {
1817 top: 0,
1818 right: NaN,
1819 bottom: 0,
1820 left: 0
1821 }, $$.updateSizeForLegend && $$.updateSizeForLegend(legendHeight, legendWidth), $$.width = $$.currentWidth - $$.margin.left - $$.margin.right, $$.height = $$.currentHeight - $$.margin.top - $$.margin.bottom, $$.width < 0 && ($$.width = 0), $$.height < 0 && ($$.height = 0), $$.width2 = isRotated ? $$.margin.left - $$.rotated_padding_left - $$.rotated_padding_right : $$.width, $$.height2 = isRotated ? $$.height : $$.currentHeight - $$.margin2.top - $$.margin2.bottom, $$.width2 < 0 && ($$.width2 = 0), $$.height2 < 0 && ($$.height2 = 0), $$.arcWidth = $$.width - ($$.isLegendRight ? legendWidth + 10 : 0), $$.arcHeight = $$.height - ($$.isLegendRight ? 0 : 10), $$.hasType("gauge") && !config.gauge_fullCircle && ($$.arcHeight += $$.height - $$.getGaugeLabelHeight()), $$.updateRadius && $$.updateRadius(), $$.isLegendRight && hasArc && ($$.margin3.left = $$.arcWidth / 2 + $$.radiusExpanded * 1.1);
1822 }
1823 /**
1824 * Update targeted element with given data
1825 * @param {Object} targets Data object formatted as 'target'
1826 * @private
1827 */
1828
1829 }, {
1830 key: "updateTargets",
1831 value: function updateTargets(targets) {
1832 var $$ = this; // Text
1833
1834 $$.updateTargetsForText(targets), $$.updateTargetsForBar(targets), $$.updateTargetsForLine(targets), $$.hasArcType(targets) && ($$.hasType("radar") ? $$.updateTargetsForRadar(targets) : $$.updateTargetsForArc(targets)), $$.updateTargetsForSubchart && $$.updateTargetsForSubchart(targets), $$.showTargets();
1835 }
1836 /**
1837 * Display targeted elements
1838 * @private
1839 */
1840
1841 }, {
1842 key: "showTargets",
1843 value: function showTargets() {
1844 var $$ = this;
1845 $$.svg.selectAll(".".concat(config_classes.target)).filter(function (d) {
1846 return $$.isTargetToShow(d.id);
1847 }).transition().duration($$.config.transition_duration).style("opacity", "1");
1848 }
1849 }, {
1850 key: "getWithOption",
1851 value: function getWithOption(options) {
1852 var withOptions = {
1853 Y: !0,
1854 Subchart: !0,
1855 Transition: !0,
1856 EventRect: !0,
1857 Dimension: !0,
1858 TrimXDomain: !0,
1859 Transform: !1,
1860 UpdateXDomain: !1,
1861 UpdateOrgXDomain: !1,
1862 Legend: !1,
1863 UpdateXAxis: "UpdateXDomain",
1864 TransitionForExit: "Transition",
1865 TransitionForAxis: "Transition"
1866 };
1867 return Object.keys(withOptions).forEach(function (key) {
1868 var defVal = withOptions[key];
1869 isString(defVal) && (defVal = withOptions[defVal]), withOptions[key] = getOption(options, "with".concat(key), defVal);
1870 }), withOptions;
1871 }
1872 }, {
1873 key: "redraw",
1874 value: function redraw() {
1875 var tickValues,
1876 intervalForCulling,
1877 xDomainForZoom,
1878 options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
1879 transitionsValue = arguments.length > 1 ? arguments[1] : undefined,
1880 $$ = this,
1881 main = $$.main,
1882 config = $$.config,
1883 isRotated = config.axis_rotated,
1884 hasRadar = $$.hasType("radar"),
1885 areaIndices = $$.getShapeIndices($$.isAreaType),
1886 barIndices = $$.getShapeIndices($$.isBarType),
1887 lineIndices = $$.getShapeIndices($$.isLineType),
1888 hideAxis = $$.hasArcType(),
1889 targetsToShow = $$.filterTargetsToShow($$.data.targets),
1890 xv = $$.xv.bind($$),
1891 wth = $$.getWithOption(options),
1892 duration = wth.Transition ? config.transition_duration : 0,
1893 durationForExit = wth.TransitionForExit ? duration : 0,
1894 durationForAxis = wth.TransitionForAxis ? duration : 0,
1895 transitions = transitionsValue || $$.axis.generateTransitions(durationForAxis);
1896 // show/hide if manual culling needed
1897 if (options.initializing && config.tooltip_init_show || $$.inputType !== "touch" || $$.hideTooltip(), wth.Legend && config.legend_show ? $$.updateLegend($$.mapToIds($$.data.targets), options, transitions) : wth.Dimension && $$.updateDimension(!0), $$.isCategorized() && targetsToShow.length === 0 && $$.x.domain([0, $$.axes.x.selectAll(".tick").size()]), targetsToShow.length ? ($$.updateXDomain(targetsToShow, wth.UpdateXDomain, wth.UpdateOrgXDomain, wth.TrimXDomain), !config.axis_x_tick_values && (tickValues = $$.axis.updateXAxisTickValues(targetsToShow))) : ($$.xAxis.tickValues([]), $$.subXAxis.tickValues([])), config.zoom_rescale && !options.flow && (xDomainForZoom = $$.x.orgDomain()), ["y", "y2"].forEach(function (key) {
1898 var axis = $$[key],
1899 tickValues = config["axis_".concat(key, "_tick_values")],
1900 tickCount = config["axis_".concat(key, "_tick_count")];
1901
1902 if (axis.domain($$.getYDomain(targetsToShow, key, xDomainForZoom)), !tickValues && tickCount) {
1903 var domain = axis.domain();
1904 $$["".concat(key, "Axis")].tickValues($$.axis.generateTickValues(domain, domain.every(function (v) {
1905 return v === 0;
1906 }) ? 1 : tickCount, $$.isTimeSeriesY()));
1907 }
1908 }), $$.axis.redraw(transitions, hideAxis), $$.axis.updateLabels(wth.Transition), (wth.UpdateXDomain || wth.UpdateXAxis) && targetsToShow.length) if (config.axis_x_tick_culling && tickValues) {
1909 for (var i = 1; i < tickValues.length; i++) if (tickValues.length / i < config.axis_x_tick_culling_max) {
1910 intervalForCulling = i;
1911 break;
1912 }
1913
1914 $$.svg.selectAll(".".concat(config_classes.axisX, " .tick text")).each(function (e) {
1915 var index = tickValues.indexOf(e);
1916 index >= 0 && Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this).style("display", index % intervalForCulling ? "none" : "block");
1917 });
1918 } else $$.svg.selectAll(".".concat(config_classes.axisX, " .tick text")).style("display", "block"); // setup drawer - MEMO: these must be called after axis updated
1919
1920 var drawArea = $$.generateDrawArea ? $$.generateDrawArea(areaIndices, !1) : undefined,
1921 drawBar = $$.generateDrawBar ? $$.generateDrawBar(barIndices) : undefined,
1922 drawLine = $$.generateDrawLine ? $$.generateDrawLine(lineIndices, !1) : undefined,
1923 xForText = $$.generateXYForText(areaIndices, barIndices, lineIndices, !0),
1924 yForText = $$.generateXYForText(areaIndices, barIndices, lineIndices, !1);
1925 wth.Y && ($$.subY.domain($$.getYDomain(targetsToShow, "y")), $$.subY2.domain($$.getYDomain(targetsToShow, "y2"))), $$.updateXgridFocus(), main.select("text.".concat(config_classes.text, ".").concat(config_classes.empty)).attr("x", $$.width / 2).attr("y", $$.height / 2).text(config.data_empty_label_text).transition().style("opacity", targetsToShow.length ? 0 : 1), $$.updateGrid(duration), $$.updateRegion(duration), $$.updateBar(durationForExit), $$.updateLine(durationForExit), $$.updateArea(durationForExit), $$.updateCircle(), $$.hasDataLabel() && $$.updateText(durationForExit), $$.redrawTitle && $$.redrawTitle(), $$.redrawArc && $$.redrawArc(duration, durationForExit, wth.Transform), hasRadar && $$.redrawRadar(duration, durationForExit), config.subchart_show && $$.redrawSubchart && $$.redrawSubchart(wth.Subchart, transitions, duration, durationForExit, areaIndices, barIndices, lineIndices), main.selectAll(".".concat(config_classes.selectedCircles)).filter($$.isBarType.bind($$)).selectAll("circle").remove(), config.interaction_enabled && !options.flow && wth.EventRect && ($$.redrawEventRect(), $$.bindZoomEvent()), $$.updateCircleY();
1926 // generate circle x/y functions depending on updated params
1927 var cx = (hasRadar ? $$.radarCircleX : isRotated ? $$.circleY : $$.circleX).bind($$),
1928 cy = (hasRadar ? $$.radarCircleY : isRotated ? $$.circleX : $$.circleY).bind($$),
1929 flow = options.flow && $$.generateFlow({
1930 targets: targetsToShow,
1931 flow: options.flow,
1932 duration: options.flow.duration,
1933 drawBar: drawBar,
1934 drawLine: drawLine,
1935 drawArea: drawArea,
1936 cx: cx,
1937 cy: cy,
1938 xv: xv,
1939 xForText: xForText,
1940 yForText: yForText
1941 }),
1942 isTransition = (duration || flow) && $$.isTabVisible(),
1943 redrawList = [$$.redrawBar(drawBar, isTransition), $$.redrawLine(drawLine, isTransition), $$.redrawArea(drawArea, isTransition), $$.redrawCircle(cx, cy, isTransition, flow), $$.redrawText(xForText, yForText, options.flow, isTransition), $$.redrawRegion(isTransition), $$.redrawGrid(isTransition)],
1944 afterRedraw = flow || config.onrendered ? function () {
1945 flow && flow(), callFn(config.onrendered, $$);
1946 } : null;
1947 if (afterRedraw) // Only use transition when current tab is visible.
1948 if (isTransition) {
1949 // Wait for end of transitions for callback
1950 var waitForDraw = $$.generateWait(); // transition should be derived from one transition
1951
1952 Object(external_commonjs_d3_transition_commonjs2_d3_transition_amd_d3_transition_root_d3_["transition"])().duration(duration).each(function () {
1953 redrawList.reduce(function (acc, t1) {
1954 return acc.concat(t1);
1955 }, []).forEach(function (t) {
1956 return waitForDraw.add(t);
1957 });
1958 }).call(waitForDraw, afterRedraw);
1959 } else afterRedraw(); // update fadein condition
1960
1961 $$.mapToIds($$.data.targets).forEach(function (id) {
1962 $$.withoutFadeIn[id] = !0;
1963 });
1964 }
1965 }, {
1966 key: "updateAndRedraw",
1967 value: function updateAndRedraw() {
1968 var transitions,
1969 options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
1970 $$ = this,
1971 config = $$.config;
1972 options.withTransition = getOption(options, "withTransition", !0), options.withTransform = getOption(options, "withTransform", !1), options.withLegend = getOption(options, "withLegend", !1), options.withUpdateXDomain = !0, options.withUpdateOrgXDomain = !0, options.withTransitionForExit = !1, options.withTransitionForTransform = getOption(options, "withTransitionForTransform", options.withTransition), $$.updateSizes(), options.withLegend && config.legend_show || (transitions = $$.axis.generateTransitions(options.withTransitionForAxis ? config.transition_duration : 0), $$.updateScales(), $$.updateSvgSize(), $$.transformAll(options.withTransitionForTransform, transitions)), $$.redraw(options, transitions);
1973 }
1974 }, {
1975 key: "redrawWithoutRescale",
1976 value: function redrawWithoutRescale() {
1977 this.redraw({
1978 withY: !1,
1979 withSubchart: !1,
1980 withEventRect: !1,
1981 withTransitionForAxis: !1
1982 });
1983 }
1984 }, {
1985 key: "isTimeSeries",
1986 value: function isTimeSeries() {
1987 return this.config.axis_x_type === "timeseries";
1988 }
1989 }, {
1990 key: "isCategorized",
1991 value: function isCategorized() {
1992 return this.config.axis_x_type.indexOf("category") >= 0 || this.hasType("radar");
1993 }
1994 }, {
1995 key: "isCustomX",
1996 value: function isCustomX() {
1997 var $$ = this,
1998 config = $$.config;
1999 return !$$.isTimeSeries() && (config.data_x || notEmpty(config.data_xs));
2000 }
2001 }, {
2002 key: "isTimeSeriesY",
2003 value: function isTimeSeriesY() {
2004 return this.config.axis_y_type === "timeseries";
2005 }
2006 }, {
2007 key: "getTranslate",
2008 value: function getTranslate(target) {
2009 var x,
2010 y,
2011 index = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0,
2012 $$ = this,
2013 config = $$.config,
2014 isRotated = config.axis_rotated,
2015 padding = 0;
2016 if (index && /^(x|y2?)$/.test(target) && (padding = $$.getAxisSize(target) * index), target === "main") x = asHalfPixel($$.margin.left), y = asHalfPixel($$.margin.top);else if (target === "context") x = asHalfPixel($$.margin2.left), y = asHalfPixel($$.margin2.top);else if (target === "legend") x = $$.margin3.left, y = $$.margin3.top;else if (target === "x") x = isRotated ? -padding : 0, y = isRotated ? 0 : $$.height + padding;else if (target === "y") x = isRotated ? 0 : -padding, y = isRotated ? $$.height + padding : 0;else if (target === "y2") x = isRotated ? 0 : $$.width + padding, y = isRotated ? 1 - padding : 0;else if (target === "subx") x = 0, y = isRotated ? 0 : $$.height2;else if (target === "arc") x = $$.arcWidth / 2, y = $$.arcHeight / 2;else if (target === "radar") {
2017 var diff = ($$.arcWidth - $$.arcHeight) / 2;
2018 x = Math.max(diff, 0) + 4, y = diff < 0 ? Math.abs(diff) : asHalfPixel($$.margin.top);
2019 }
2020 return "translate(".concat(x, ", ").concat(y, ")");
2021 }
2022 }, {
2023 key: "initialOpacity",
2024 value: function initialOpacity(d) {
2025 return this.getBaseValue(d) !== null && this.withoutFadeIn[d.id] ? "1" : "0";
2026 }
2027 }, {
2028 key: "initialOpacityForCircle",
2029 value: function initialOpacityForCircle(d) {
2030 return this.getBaseValue(d) !== null && this.withoutFadeIn[d.id] ? this.opacityForCircle(d) : "0";
2031 }
2032 }, {
2033 key: "opacityForCircle",
2034 value: function opacityForCircle(d) {
2035 var opacity = this.config.point_show ? "1" : "0";
2036 return isValue(this.getBaseValue(d)) ? this.isBubbleType(d) || this.isScatterType(d) ? "0.5" : opacity : "0";
2037 }
2038 }, {
2039 key: "opacityForText",
2040 value: function opacityForText() {
2041 return this.hasDataLabel() ? "1" : "0";
2042 }
2043 }, {
2044 key: "xx",
2045 value: function xx(d) {
2046 var fn = this.config.zoom_enabled && this.zoomScale ? this.zoomScale : this.x;
2047 return d ? fn(d.x) : null;
2048 }
2049 }, {
2050 key: "xv",
2051 value: function xv(d) {
2052 var $$ = this,
2053 value = $$.getBaseValue(d);
2054 return $$.isTimeSeries() ? value = $$.parseDate(value) : $$.isCategorized() && isString(value) && (value = $$.config.axis_x_categories.indexOf(value)), Math.ceil($$.x(value));
2055 }
2056 }, {
2057 key: "yv",
2058 value: function yv(d) {
2059 var $$ = this,
2060 yScale = d.axis && d.axis === "y2" ? $$.y2 : $$.y;
2061 return Math.ceil(yScale($$.getBaseValue(d)));
2062 }
2063 }, {
2064 key: "subxx",
2065 value: function subxx(d) {
2066 return d ? this.subX(d.x) : null;
2067 }
2068 }, {
2069 key: "transformMain",
2070 value: function transformMain(withTransition, transitions) {
2071 var xAxis,
2072 yAxis,
2073 y2Axis,
2074 $$ = this;
2075 transitions && transitions.axisX ? xAxis = transitions.axisX : (xAxis = $$.main.select(".".concat(config_classes.axisX)), withTransition && (xAxis = xAxis.transition())), transitions && transitions.axisY ? yAxis = transitions.axisY : (yAxis = $$.main.select(".".concat(config_classes.axisY)), withTransition && (yAxis = yAxis.transition())), transitions && transitions.axisY2 ? y2Axis = transitions.axisY2 : (y2Axis = $$.main.select(".".concat(config_classes.axisY2)), withTransition && (y2Axis = y2Axis.transition())), (withTransition ? $$.main.transition() : $$.main).attr("transform", $$.getTranslate("main")), xAxis.attr("transform", $$.getTranslate("x")), yAxis.attr("transform", $$.getTranslate("y")), y2Axis.attr("transform", $$.getTranslate("y2")), $$.main.select(".".concat(config_classes.chartArcs)).attr("transform", $$.getTranslate("arc"));
2076 }
2077 }, {
2078 key: "transformAll",
2079 value: function transformAll(withTransition, transitions) {
2080 var $$ = this;
2081 $$.transformMain(withTransition, transitions), $$.config.subchart_show && $$.transformContext(withTransition, transitions), $$.legend && $$.transformLegend(withTransition);
2082 }
2083 }, {
2084 key: "updateSvgSize",
2085 value: function updateSvgSize() {
2086 var $$ = this,
2087 brush = $$.svg.select(".".concat(config_classes.brush, " .overlay")),
2088 brushHeight = brush.size() ? brush.attr("height") : 0;
2089 $$.svg.attr("width", $$.currentWidth).attr("height", $$.currentHeight), $$.svg.selectAll(["#".concat($$.clipId), "#".concat($$.clipIdForGrid)]).select("rect").attr("width", $$.width).attr("height", $$.height), $$.svg.select("#".concat($$.clipIdForXAxis)).select("rect").attr("x", $$.getXAxisClipX.bind($$)).attr("y", $$.getXAxisClipY.bind($$)).attr("width", $$.getXAxisClipWidth.bind($$)).attr("height", $$.getXAxisClipHeight.bind($$)), $$.svg.select("#".concat($$.clipIdForYAxis)).select("rect").attr("x", $$.getYAxisClipX.bind($$)).attr("y", $$.getYAxisClipY.bind($$)).attr("width", $$.getYAxisClipWidth.bind($$)).attr("height", $$.getYAxisClipHeight.bind($$)), $$.svg.select("#".concat($$.clipIdForSubchart)).select("rect").attr("width", $$.width).attr("height", brushHeight), $$.svg.select(".".concat(config_classes.zoomRect)).attr("width", $$.width).attr("height", $$.height), $$.brush && $$.brush.scale($$.subX, brushHeight);
2090 }
2091 }, {
2092 key: "updateDimension",
2093 value: function updateDimension(withoutAxis) {
2094 var $$ = this;
2095 withoutAxis || ($$.config.axis_rotated ? ($$.xAxis.create($$.axes.x), $$.subXAxis.create($$.axes.subx)) : ($$.yAxis.create($$.axes.y), $$.y2Axis.create($$.axes.y2))), $$.updateSizes(), $$.updateScales(withoutAxis), $$.updateSvgSize(), $$.transformAll(!1);
2096 }
2097 }, {
2098 key: "bindResize",
2099 value: function bindResize() {
2100 var $$ = this,
2101 config = $$.config;
2102 $$.resizeFunction = $$.generateResize(), $$.resizeFunction.add(config.onresize.bind($$)), config.resize_auto && $$.resizeFunction.add(function () {
2103 $$.resizeTimeout && (window.clearTimeout($$.resizeTimeout), $$.resizeTimeout = null), $$.resizeTimeout = window.setTimeout($$.api.flush, 100);
2104 }), $$.resizeFunction.add(config.onresized.bind($$)), window.addEventListener("resize", $$.resizeFunction);
2105 }
2106 }, {
2107 key: "generateResize",
2108 value: function generateResize() {
2109 function callResizeFunctions() {
2110 resizeFunctions.forEach(function (f) {
2111 return f();
2112 });
2113 }
2114
2115 var resizeFunctions = [];
2116 return callResizeFunctions.add = function (f) {
2117 return resizeFunctions.push(f);
2118 }, callResizeFunctions.remove = function (f) {
2119 return resizeFunctions.splice(resizeFunctions.indexOf(f), 1);
2120 }, callResizeFunctions;
2121 }
2122 }, {
2123 key: "endall",
2124 value: function endall(transition, callback) {
2125 var n = 0;
2126 transition.each(function () {
2127 return ++n;
2128 }).on("end", function () {
2129 for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) args[_key] = arguments[_key];
2130
2131 --n || callback.apply.apply(callback, [this].concat(args));
2132 });
2133 }
2134 }, {
2135 key: "generateWait",
2136 value: function generateWait() {
2137 var transitionsToWait = [],
2138 f = function (transition, callback) {
2139 function loop() {
2140 var done = 0;
2141 transitionsToWait.forEach(function (t) {
2142 if (t.empty()) return void done++;
2143
2144 try {
2145 t.transition();
2146 } catch (e) {
2147 done++;
2148 }
2149 }), timer && clearTimeout(timer), done === transitionsToWait.length ? callback && callback() : timer = setTimeout(loop, 50);
2150 }
2151
2152 var timer;
2153 loop();
2154 };
2155
2156 return f.add = function (transition) {
2157 isArray(transition) ? transitionsToWait = transitionsToWait.concat(transition) : transitionsToWait.push(transition);
2158 }, f;
2159 }
2160 }, {
2161 key: "parseDate",
2162 value: function parseDate(date) {
2163 var parsedDate,
2164 $$ = this;
2165 return date instanceof Date ? parsedDate = date : isString(date) ? parsedDate = $$.dataTimeFormat($$.config.data_xFormat)(date) : isNumber(date) && !isNaN(date) && (parsedDate = new Date(+date)), (!parsedDate || isNaN(+parsedDate)) && console && console.error && console.error("Failed to parse x '".concat(date, "' to Date object")), parsedDate;
2166 }
2167 }, {
2168 key: "isTabVisible",
2169 value: function isTabVisible() {
2170 return !document[["hidden", "mozHidden", "msHidden", "webkitHidden"].filter(function (v) {
2171 return v in document;
2172 })[0]];
2173 }
2174 }, {
2175 key: "convertInputType",
2176 value: function convertInputType() {
2177 var $$ = this,
2178 config = $$.config,
2179 isMobile = $$.isMobile(),
2180 hasMouse = config.interaction_inputType_mouse && !isMobile && "onmouseover" in window,
2181 hasTouch = !1;
2182 return config.interaction_inputType_touch && (hasTouch = "ontouchmove" in window || window.DocumentTouch && document instanceof window.DocumentTouch), hasMouse && "mouse" || hasTouch && "touch" || null;
2183 }
2184 }]), ChartInternal;
2185}();
2186
2187
2188// CONCATENATED MODULE: ./src/internals/Chart.js
2189
2190
2191/**
2192 * Copyright (c) 2017 ~ present NAVER Corp.
2193 * billboard.js project is licensed under the MIT license
2194 * @license MIT
2195 * @ignore
2196 */
2197
2198/**
2199 * Main chart class.
2200 * - Note: Instantiated via `bb.generate()`.
2201 * @class Chart
2202 * @example
2203 * var chart = bb.generate({
2204 * data: {
2205 * columns: [
2206 * ["x", "2015-11-02", "2015-12-01", "2016-01-01", "2016-02-01", "2016-03-01"],
2207 * ["count1", 11, 8, 7, 6, 5 ],
2208 * ["count2", 9, 3, 6, 2, 8 ]
2209 * ]}
2210 * }
2211 * @see {@link bb.generate} for the initialization.
2212*/
2213
2214/**
2215 * Access primary node elements
2216 * @name Chart#$
2217 * @type Object
2218 * @property {Object} $
2219 * @property {d3.selection} $.chart Wrapper element
2220 * @property {d3.selection} $.svg Main svg element
2221 * @property {d3.selection} $.defs Definition element
2222 * @property {d3.selection} $.main Main grouping element
2223 * @property {d3.selection} $.tooltip Tooltip element
2224 * @property {d3.selection} $.legend Legend element
2225 * @property {d3.selection} $.title Title element
2226 * @property {d3.selection} $.grid Grid element
2227 * @property {d3.selection} $.arc Arc element
2228 * @property {Object} $.bar
2229 * @property {d3.selection} $.bar.bars Bar elements
2230 * @property {Object} $.line
2231 * @property {d3.selection} $.line.lines Line elements
2232 * @property {d3.selection} $.line.areas Areas elements
2233 * @property {d3.selection} $.line.circles Data point circle elements
2234 * @property {Object} $.text
2235 * @property {d3.selection} $.text.texts Data label text elements
2236 * @instance
2237 * @memberof Chart
2238 * @example
2239 * var chart = bb.generate({ ... });
2240 *
2241 * chart.$.chart; // wrapper element
2242 * chart.$.line.circles; // all data point circle elements
2243 */
2244
2245var Chart_Chart = function Chart(config) {
2246 classCallCheck_default()(this, Chart);
2247
2248 var $$ = new ChartInternal_ChartInternal(this);
2249 // bind "this" to nested API
2250 this.internal = $$, $$.loadConfig(config), $$.beforeInit(config), $$.init(), this.$ = $$.getChartElements(), $$.afterInit(config), function bindThis(fn, target, argThis) {
2251 Object.keys(fn).forEach(function (key) {
2252 target[key] = fn[key].bind(argThis), Object.keys(fn[key]).length && bindThis(fn[key], target[key], argThis);
2253 });
2254 }(Chart.prototype, this, this);
2255};
2256
2257
2258// CONCATENATED MODULE: ./src/config/Options.js
2259
2260
2261/**
2262 * Copyright (c) 2017 ~ present NAVER Corp.
2263 * billboard.js project is licensed under the MIT license
2264 */
2265
2266/**
2267 * Class to set options on generating chart.
2268 * - It's instantiated internally, not exposed for public.
2269 * @class Options
2270 * @see {@link bb.generate} to use these options on generating the chart
2271 */
2272var Options_Options = function Options() {
2273 return classCallCheck_default()(this, Options), {
2274 /**
2275 * Specify the CSS selector or the element which the chart will be set to. D3 selection object can be specified also.
2276 * If other chart is set already, it will be replaced with the new one (only one chart can be set in one element).<br><br>
2277 * If this option is not specified, the chart will be generated but not be set. Instead, we can access the element by chart.element and set it by ourselves.<br>
2278 * @name bindto
2279 * @memberof Options
2280 * @property {String|HTMLElement|d3.selection} bindto=#chart Specify the element where chart will be drawn.
2281 * @property {String|HTMLElement|d3.selection} bindto.element=#chart Specify the element where chart will be drawn.
2282 * @property {String} [bindto.classname=bb] Specify the class name of bind element.<br>
2283 * **NOTE:** When class name isn't `bb`, then you also need to update the default CSS to be rendered correctly.
2284 * @default #chart
2285 * @example
2286 * bindto: "#myContainer"
2287 *
2288 * // or HTMLElement
2289 * bindto: document.getElementById("myContainer")
2290 *
2291 * // or D3 selection object
2292 * bindto: d3.select("#myContainer")
2293 *
2294 * // or to change default classname
2295 * bindto: {
2296 * element: "#chart",
2297 * classname: "bill-board" // ex) <div id='chart' class='bill-board'>
2298 * }
2299 */
2300 bindto: "#chart",
2301
2302 /**
2303 * Set 'clip-path' attribute for chart element
2304 * - **NOTE:**
2305 * > When is false, chart node element is positioned after the axis node in DOM tree hierarchy.
2306 * > Is to make chart element positioned over axis element.
2307 * @name clipPath
2308 * @memberof Options
2309 * @type {Boolean}
2310 * @default true
2311 * @see [Demo](https://naver.github.io/billboard.js/demo/#ChartOptions.clipPath)
2312 * @example
2313 * // don't set 'clip-path' attribute
2314 * clipPath: false
2315 */
2316 clipPath: !0,
2317
2318 /**
2319 * Set svg element's class name
2320 * @name svg
2321 * @memberof Options
2322 * @type {Object}
2323 * @property {String} [svg.classname] class name for svg element
2324 * @example
2325 * svg: {
2326 * classname: "test_class"
2327 * }
2328 */
2329 svg_classname: undefined,
2330
2331 /**
2332 * The desired size of the chart element.
2333 * If value is not specified, the width of the chart will be calculated by the size of the parent element it's appended to.
2334 * @name size
2335 * @memberof Options
2336 * @type {Object}
2337 * @property {Number} [size.width] width of the chart element
2338 * @property {Number} [size.height] height of the chart element
2339 * @see [Demo](https://naver.github.io/billboard.js/demo/#ChartOptions.ChartSize)
2340 * @example
2341 * size: {
2342 * width: 640,
2343 * height: 480
2344 * }
2345 */
2346 size_width: undefined,
2347 size_height: undefined,
2348
2349 /**
2350 * The padding of the chart element.
2351 * @name padding
2352 * @memberof Options
2353 * @type {Object}
2354 * @property {Number} [padding.top] padding on the top of chart
2355 * @property {Number} [padding.right] padding on the right of chart
2356 * @property {Number} [padding.bottom] padding on the bottom of chart
2357 * @property {Number} [padding.left] padding on the left of chart
2358 * @example
2359 * padding: {
2360 * top: 20,
2361 * right: 20,
2362 * bottom: 20,
2363 * left: 20
2364 * }
2365 */
2366 padding_left: undefined,
2367 padding_right: undefined,
2368 padding_top: undefined,
2369 padding_bottom: undefined,
2370
2371 /**
2372 * Set chart resize options
2373 * @name resize
2374 * @memberof Options
2375 * @type {Object}
2376 * @property {Boolean} [resize.auto=true] Set chart resize automatically on viewport changes.
2377 * @example
2378 * resize: {
2379 * auto: false
2380 * }
2381 */
2382 resize_auto: !0,
2383
2384 /**
2385 * Set zoom options
2386 * @name zoom
2387 * @memberof Options
2388 * @type {Object}
2389 * @property {Boolean} [zoom.enabled=false] Enable zooming.
2390 * @property {String} [zoom.enabled.type='wheel'] Set zoom interaction type.
2391 * - **Available types:**
2392 * - wheel
2393 * - drag
2394 * @property {Boolean} [zoom.rescale=false] Enable to rescale after zooming.<br>
2395 * If true set, y domain will be updated according to the zoomed region.
2396 * @property {Array} [zoom.extent=[1, 10]] Change zoom extent.
2397 * @property {Number} [zoom.x.min] Set x Axis minimum zoom range
2398 * @property {Number} [zoom.x.max] Set x Axis maximum zoom range
2399 * @property {Function} [zoom.onzoomstart=undefined] Set callback that is called when zooming starts.<br>
2400 * Specified function receives the zoom event.
2401 * @property {Function} [zoom.onzoom=undefined] Set callback that is called when the chart is zooming.<br>
2402 * Specified function receives the zoomed domain.
2403 * @property {Function} [zoom.onzoomend=undefined] Set callback that is called when zooming ends.<br>
2404 * Specified function receives the zoomed domain.
2405 * @property {Boolean|Object} [zoom.resetButton=true] Set to display zoom reset button for 'drag' type zoom
2406 * @property {String} [zoom.resetButton.text='Reset Zoom'] Text value for zoom reset button.
2407 * @see [Demo:zoom](https://naver.github.io/billboard.js/demo/#Interaction.Zoom)
2408 * @see [Demo:drag zoom](https://naver.github.io/billboard.js/demo/#Interaction.DragZoom)
2409 * @example
2410 * zoom: {
2411 * enabled: {
2412 * type: "drag"
2413 * },
2414 * rescale: true,
2415 * extent: [1, 100] // enable more zooming
2416 * x: {
2417 * min: -1, // set min range
2418 * max: 10 // set max range
2419 * },
2420 * onzoomstart: function(event) { ... },
2421 * onzoom: function(domain) { ... },
2422 * onzoomend: function(domain) { ... },
2423 *
2424 * // show reset button when is zoomed-in
2425 * resetButton: true,
2426 *
2427 * // customized text value for reset zoom button
2428 * resetButton: {
2429 * text: "Unzoom"
2430 * }
2431 * }
2432 */
2433 zoom_enabled: undefined,
2434 zoom_extent: undefined,
2435 zoom_privileged: !1,
2436 zoom_rescale: !1,
2437 zoom_onzoom: undefined,
2438 zoom_onzoomstart: undefined,
2439 zoom_onzoomend: undefined,
2440 zoom_resetButton: !0,
2441 zoom_x_min: undefined,
2442 zoom_x_max: undefined,
2443
2444 /**
2445 * Interaction options
2446 * @name interaction
2447 * @memberof Options
2448 * @type {Object}
2449 * @property {Boolean} [interaction.enabled=true] Indicate if the chart should have interactions.<br>
2450 * If `false` is set, all of interactions (showing/hiding tooltip, selection, mouse events, etc) will be disabled.
2451 * @property {Boolean} [interaction.brighten=true] Make brighter for the selected area (ex. 'pie' type data selected area)
2452 * @property {Boolean} [interaction.inputType.mouse=true] enable or disable mouse interaction
2453 * @property {Boolean} [interaction.inputType.touch=true] enable or disable touch interaction
2454 * @property {Boolean|Number} [interaction.inputType.touch.preventDefault=false] enable or disable to call event.preventDefault on touchstart & touchmove event. It's usually used to prevent document scrolling.
2455 * @see [Demo: touch.preventDefault](https://naver.github.io/billboard.js/demo/#Interaction.PreventScrollOnTouch)
2456 * @example
2457 * interaction: {
2458 * enabled: false,
2459 * brighten: false,
2460 * inputType: {
2461 * mouse: true,
2462 * touch: false
2463 *
2464 * // or declare preventDefault explicitly.
2465 * // In this case touch inputType is enabled by default
2466 * touch: {
2467 * preventDefault: true
2468 *
2469 * // or threshold pixel value (pixel moved from touchstart to touchmove)
2470 * preventDefault: 5
2471 * }
2472 * }
2473 * }
2474 */
2475 interaction_enabled: !0,
2476 interaction_brighten: !0,
2477 interaction_inputType_mouse: !0,
2478 interaction_inputType_touch: {},
2479
2480 /**
2481 * Set a callback to execute when mouse/touch enters the chart.
2482 * @name onover
2483 * @memberof Options
2484 * @type {Function}
2485 * @default function(){}
2486 * @example
2487 * onover: function() {
2488 * ...
2489 * }
2490 */
2491 onover: function onover() {},
2492
2493 /**
2494 * Set a callback to execute when mouse/touch leaves the chart.
2495 * @name onout
2496 * @memberof Options
2497 * @type {Function}
2498 * @default function(){}
2499 * @example
2500 * onout: function() {
2501 * ...
2502 * }
2503 */
2504 onout: function onout() {},
2505
2506 /**
2507 * Set a callback to execute when user resizes the screen.
2508 * @name onresize
2509 * @memberof Options
2510 * @type {Function}
2511 * @default function(){}
2512 * @example
2513 * onresize: function() {
2514 * ...
2515 * }
2516 */
2517 onresize: function onresize() {},
2518
2519 /**
2520 * SSet a callback to execute when screen resize finished.
2521 * @name onresized
2522 * @memberof Options
2523 * @type {Function}
2524 * @default function(){}
2525 * @example
2526 * onresized: function() {
2527 * ...
2528 * }
2529 */
2530 onresized: function onresized() {},
2531
2532 /**
2533 * Set a callback to execute before the chart is initialized
2534 * @name onbeforeinit
2535 * @memberof Options
2536 * @type {Function}
2537 * @default function(){}
2538 * @example
2539 * onbeforeinit: function() {
2540 * ...
2541 * }
2542 */
2543 onbeforeinit: undefined,
2544
2545 /**
2546 * Set a callback to execute when the chart is initialized.
2547 * @name oninit
2548 * @memberof Options
2549 * @type {Function}
2550 * @default function(){}
2551 * @example
2552 * oninit: function() {
2553 * ...
2554 * }
2555 */
2556 oninit: function oninit() {},
2557
2558 /**
2559 * Set a callback to execute after the chart is initialized
2560 * @name onafterinit
2561 * @memberof Options
2562 * @type {Function}
2563 * @default function(){}
2564 * @example
2565 * onafterinit: function() {
2566 * ...
2567 * }
2568 */
2569 onafterinit: undefined,
2570
2571 /**
2572 * Set a callback which is executed when the chart is rendered. Basically, this callback will be called in each time when the chart is redrawed.
2573 * @name onrendered
2574 * @memberof Options
2575 * @type {Function}
2576 * @default undefined
2577 * @example
2578 * onrendered: function() {
2579 * ...
2580 * }
2581 */
2582 onrendered: undefined,
2583
2584 /**
2585 * Set duration of transition (in milliseconds) for chart animation.<br><br>
2586 * - **NOTE:** If `0 `or `null` set, transition will be skipped. So, this makes initial rendering faster especially in case you have a lot of data.
2587 * @name transition
2588 * @memberof Options
2589 * @type {Object}
2590 * @property {Number} [transition.duration=350] duration in milliseconds
2591 * @example
2592 * transition: {
2593 * duration: 500
2594 * }
2595 */
2596 transition_duration: 350,
2597
2598 /**
2599 * Specify the key of x values in the data.<br><br>
2600 * We can show the data with non-index x values by this option. This option is required when the type of x axis is timeseries. If this option is set on category axis, the values of the data on the key will be used for category names.
2601 * @name data․x
2602 * @memberof Options
2603 * @type {String}
2604 * @default undefined
2605 * @example
2606 * data: {
2607 * x: "date"
2608 * }
2609 */
2610 data_x: undefined,
2611
2612 /**
2613 * Specify the keys of the x values for each data.<br><br>
2614 * This option can be used if we want to show the data that has different x values.
2615 * @name data․xs
2616 * @memberof Options
2617 * @type {Object}
2618 * @default {}
2619 * @example
2620 * data: {
2621 * xs: {
2622 * data1: "x1",
2623 * data2: "x2"
2624 * }
2625 * }
2626 */
2627 data_xs: {},
2628
2629 /**
2630 * Set a format to parse string specifed as x.
2631 * @name data․xFormat
2632 * @memberof Options
2633 * @type {String}
2634 * @default %Y-%m-%d
2635 * @example
2636 * data: {
2637 * xFormat: "%Y-%m-%d %H:%M:%S"
2638 * }
2639 * @see [D3's time specifier](https://npm.runkit.com/d3-time-format)
2640 */
2641 data_xFormat: "%Y-%m-%d",
2642
2643 /**
2644 * Set localtime format to parse x axis.
2645 * @name data․xLocaltime
2646 * @memberof Options
2647 * @type {Boolean}
2648 * @default true
2649 * @example
2650 * data: {
2651 * xLocaltime: false
2652 * }
2653 */
2654 data_xLocaltime: !0,
2655
2656 /**
2657 * Sort on x axis.
2658 * @name data․xSort
2659 * @memberof Options
2660 * @type {Boolean}
2661 * @default true
2662 * @example
2663 * data: {
2664 * xSort: false
2665 * }
2666 */
2667 data_xSort: !0,
2668
2669 /**
2670 * Converts data id value
2671 * @name data․idConverter
2672 * @memberof Options
2673 * @type {Function}
2674 * @default function(id) { return id; }
2675 * @example
2676 * data: {
2677 * idConverter: function(id) {
2678 * // when id is 'data1', converts to be 'data2'
2679 * // 'data2' should be given as the initial data value
2680 * if (id === "data1") {
2681 * return "data2";
2682 * } else {
2683 * return id;
2684 * }
2685 * }
2686 * }
2687 */
2688 data_idConverter: function data_idConverter(id) {
2689 return id;
2690 },
2691
2692 /**
2693 * Set custom data name.
2694 * @name data․names
2695 * @memberof Options
2696 * @type {Object}
2697 * @default {}
2698 * @see [Demo](https://naver.github.io/billboard.js/demo/#Data.DataName)
2699 * @example
2700 * data: {
2701 * names: {
2702 * data1: "Data Name 1",
2703 * data2: "Data Name 2"
2704 * }
2705 * }
2706 */
2707 data_names: {},
2708
2709 /**
2710 * Set custom data class.<br><br>
2711 * If this option is specified, the element g for the data has an additional class that has the prefix 'bb-target-' (eg. bb-target-additional-data1-class).
2712 * @name data․classes
2713 * @memberof Options
2714 * @type {Object}
2715 * @default {}
2716 * @example
2717 * data: {
2718 * classes: {
2719 * data1: "additional-data1-class",
2720 * data2: "additional-data2-class"
2721 * }
2722 * }
2723 */
2724 data_classes: {},
2725
2726 /**
2727 * Set groups for the data for stacking.
2728 * @name data․groups
2729 * @memberof Options
2730 * @type {Array}
2731 * @default []
2732 * @example
2733 * data: {
2734 * groups: [
2735 * ["data1", "data2"],
2736 * ["data3"]
2737 * ]
2738 * }
2739 */
2740 data_groups: [],
2741
2742 /**
2743 * Set y axis the data related to. y and y2 can be used.
2744 * @name data․axes
2745 * @memberof Options
2746 * @type {Object}
2747 * @default {}
2748 * @example
2749 * data: {
2750 * axes: {
2751 * data1: "y",
2752 * data2: "y2"
2753 * }
2754 * }
2755 */
2756 data_axes: {},
2757
2758 /**
2759 * Set chart type at once.<br><br>
2760 * If this option is specified, the type will be applied to every data. This setting can be overwritten by data.types.<br><br>
2761 * **Available Values:**
2762 * - area
2763 * - area-line-range
2764 * - area-spline
2765 * - area-spline-range
2766 * - area-step
2767 * - bar
2768 * - bubble
2769 * - donut
2770 * - gauge
2771 * - line
2772 * - pie
2773 * - radar
2774 * - scatter
2775 * - spline
2776 * - step
2777 * @name data․type
2778 * @memberof Options
2779 * @type {String}
2780 * @default line
2781 * @example
2782 * data: {
2783 * type: "bar"
2784 * }
2785 */
2786 data_type: undefined,
2787
2788 /**
2789 * Set chart type for each data.<br>
2790 * This setting overwrites data.type setting.
2791 * - **NOTE:** `radar` type can't be combined with other types.
2792 * @name data․types
2793 * @memberof Options
2794 * @type {Object}
2795 * @default {}
2796 * @example
2797 * data: {
2798 * types: {
2799 * data1: "bar",
2800 * data2: "spline"
2801 * }
2802 * }
2803 */
2804 data_types: {},
2805
2806 /**
2807 * Set labels options
2808 * @name data․labels
2809 * @memberof Options
2810 * @type {Object}
2811 * @property {Boolean} [data.labels=false] Show or hide labels on each data points
2812 * @property {Function} [data.labels.format={}] Set formatter function for data labels.<br>
2813 * The formatter function receives 4 arguments such as v, id, i, j and it must return a string that will be shown as the label. The arguments are:<br>
2814 * - `v` is the value of the data point where the label is shown.
2815 * - `id` is the id of the data where the label is shown.
2816 * - `i` is the index of the data point where the label is shown.
2817 * - `j` is the sub index of the data point where the label is shown.<br><br>
2818 * Formatter function can be defined for each data by specifying as an object and D3 formatter function can be set (ex. d3.format('$'))
2819 * @property {Number} [data.labels.position.x=0] x coordinate position, relative the original.
2820 * @property {NUmber} [data.labels.position.y=0] y coordinate position, relative the original.
2821 * @memberof Options
2822 * @type {Object}
2823 * @default {}
2824 * @see [Demo](https://naver.github.io/billboard.js/demo/#Data.DataLabel)
2825 * @see [Demo: labels format](https://naver.github.io/billboard.js/demo/#Data.DataLabelFormat)
2826 * @see [Demo: labels position](https://naver.github.io/billboard.js/demo/#Data.DataLabelPosition)
2827 * @example
2828 * data: {
2829 * labels: true,
2830 *
2831 * // or set specific options
2832 * labels: {
2833 * format: function(v, id, i, j) { ... },
2834 *
2835 * // it's possible to set for each data
2836 * format: {
2837 * data1: function(v, id, i, j) { ... },
2838 * ...
2839 * },
2840 * position: {
2841 * x: -10,
2842 * y: 10
2843 * }
2844 * }
2845 * }
2846 */
2847 data_labels: {},
2848 data_labels_position: {},
2849
2850 /**
2851 * This option changes the order of stacking data and pieces of pie/donut.
2852 * - If `null` specified, it will be the order the data loaded.
2853 * - If function specified, it will be used as [Array.sort compareFunction](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#Parameters)<br><br>
2854 *
2855 * **Available Values:**
2856 * - `desc`: In descending order
2857 * - `asc`: In ascending order
2858 * - `null`: It keeps the data load order
2859 * - `function(data1, data2) { ... }`: Array.sort compareFunction
2860 * @name data․order
2861 * @memberof Options
2862 * @type {String|Function|null}
2863 * @default desc
2864 * @see [Demo](https://naver.github.io/billboard.js/demo/#Data.DataOrder)
2865 * @example
2866 * data: {
2867 * // in descending order (default)
2868 * order: "desc"
2869 *
2870 * // in ascending order
2871 * order: "asc"
2872 *
2873 * // keeps data input order
2874 * order: null
2875 *
2876 * // specifying sort function
2877 * order: function(a, b) {
2878 * // param data passed format
2879 * {
2880 * id: "data1", id_org: "data1", values: [
2881 * {x: 5, value: 250, id: "data1", index: 5, name: "data1"},
2882 * ...
2883 * ]
2884 * }
2885 * }
2886 * }
2887 */
2888 data_order: "desc",
2889
2890 /**
2891 * Define regions for each data.<br>
2892 * The values must be an array for each data and it should include an object that has `start`, `end` and `style`.
2893 * - The object type should be as:
2894 * - start {Number}: Start data point number. If not set, the start will be the first data point.
2895 * - [end] {Number}: End data point number. If not set, the end will be the last data point.
2896 * - [style.dasharray="2 2"] {Object}: The first number specifies a distance for the filled area, and the second a distance for the unfilled area.
2897 * - **NOTE:** Currently this option supports only line chart and dashed style. If this option specified, the line will be dashed only in the regions.
2898 * @name data․regions
2899 * @memberof Options
2900 * @type {Object}
2901 * @default {}
2902 * @example
2903 * data: {
2904 * regions: {
2905 * data1: [{
2906 * start: 1,
2907 * end: 2,
2908 * style: {
2909 * dasharray: "5 2"
2910 * }
2911 * }, {
2912 * start: 3
2913 * }],
2914 * ...
2915 * }
2916 * }
2917 */
2918 data_regions: {},
2919
2920 /**
2921 * Set color converter function.<br><br>
2922 * This option should a function and the specified function receives color (e.g. '#ff0000') and d that has data parameters like id, value, index, etc. And it must return a string that represents color (e.g. '#00ff00').
2923 * @name data․color
2924 * @memberof Options
2925 * @type {Function}
2926 * @default undefined
2927 * @see [Demo](https://naver.github.io/billboard.js/demo/#Data.DataColor)
2928 * @example
2929 * data: {
2930 * color: function(color, d) { ... }
2931 * }
2932 */
2933 data_color: undefined,
2934
2935 /**
2936 * Set color for each data.
2937 * @name data․colors
2938 * @memberof Options
2939 * @type {Object}
2940 * @default {}
2941 * @example
2942 * data: {
2943 * colors: {
2944 * data1: "#ff0000",
2945 * data2: function(d) {
2946 * return "#000";
2947 * }
2948 * ...
2949 * }
2950 * }
2951 */
2952 data_colors: {},
2953
2954 /**
2955 * Hide each data when the chart appears.<br><br>
2956 * If true specified, all of data will be hidden. If multiple ids specified as an array, those will be hidden.
2957 * @name data․hide
2958 * @memberof Options
2959 * @type {Boolean|Array}
2960 * @default false
2961 * @example
2962 * data: {
2963 * // all of data will be hidden
2964 * hide: true
2965 *
2966 * // specified data will be hidden
2967 * hide: ["data1", ...]
2968 * }
2969 */
2970 data_hide: !1,
2971
2972 /**
2973 * Filter values to be shown
2974 * The data value is the same as the returned by `.data()`.
2975 * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter
2976 * @name data․filter
2977 * @memberof Options
2978 * @type {Function}
2979 * @default undefined
2980 * @example
2981 * data: {
2982 * // filter for id value
2983 * filter: function(v) {
2984 * // v: [{id: "data1", id_org: "data1", values: [
2985 * // {x: 0, value: 130, id: "data2", index: 0}, ...]
2986 * // }, ...]
2987 * return v.id !== "data1";
2988 * }
2989 */
2990 data_filter: undefined,
2991
2992 /**
2993 * Set the stacking to be normalized
2994 * - **NOTE:**
2995 * - For stacking, '[data.groups](#.data%25E2%2580%25A4groups)' option should be set
2996 * - y Axis will be set in percentage value (0 ~ 100%)
2997 * - Must have postive values
2998 * @name data․stack․normalize
2999 * @memberof Options
3000 * @type {Boolean}
3001 * @default false
3002 * @see [Demo](https://naver.github.io/billboard.js/demo/#Data.DataStackNormalized)
3003 * @example
3004 * data: {
3005 * stack: {
3006 * normalize: true
3007 * }
3008 * }
3009 */
3010 data_stack_normalize: !1,
3011
3012 /**
3013 * Set data selection enabled<br><br>
3014 * If this option is set true, we can select the data points and get/set its state of selection by API (e.g. select, unselect, selected).
3015 * @name data․selection․enabled
3016 * @memberof Options
3017 * @type {Boolean}
3018 * @default false
3019 * @see [Demo](https://naver.github.io/billboard.js/demo/#Data.DataSelection)
3020 * @example
3021 * data: {
3022 * selection: {
3023 * enabled: true
3024 * }
3025 * }
3026 */
3027 data_selection_enabled: !1,
3028
3029 /**
3030 * Set grouped selection enabled.<br><br>
3031 * If this option set true, multiple data points that have same x value will be selected by one selection.
3032 * @name data․selection․grouped
3033 * @memberof Options
3034 * @type {Boolean}
3035 * @default false
3036 * @example
3037 * data: {
3038 * selection: {
3039 * grouped: true
3040 * }
3041 * }
3042 */
3043 data_selection_grouped: !1,
3044
3045 /**
3046 * Set a callback for each data point to determine if it's selectable or not.<br><br>
3047 * The callback will receive d as an argument and it has some parameters like id, value, index. This callback should return boolean.
3048 * @name data․selection․isselectable
3049 * @memberof Options
3050 * @type {Function}
3051 * @default function() { return true; }
3052 * @example
3053 * data: {
3054 * selection: {
3055 * isselectable: function(d) { ... }
3056 * }
3057 * }
3058 */
3059 data_selection_isselectable: function data_selection_isselectable() {
3060 return !0;
3061 },
3062
3063 /**
3064 * Set multiple data points selection enabled.<br><br>
3065 * If this option set true, multile data points can have the selected state at the same time. If false set, only one data point can have the selected state and the others will be unselected when the new data point is selected.
3066 * @name data․selection․multiple
3067 * @memberof Options
3068 * @type {Boolean}
3069 * @default true
3070 * @example
3071 * data: {
3072 * selection: {
3073 * multiple: false
3074 * }
3075 * }
3076 */
3077 data_selection_multiple: !0,
3078
3079 /**
3080 * Enable to select data points by dragging.
3081 * If this option set true, data points can be selected by dragging.
3082 * - **NOTE:** If this option set true, scrolling on the chart will be disabled because dragging event will handle the event.
3083 * @name data․selection․draggable
3084 * @memberof Options
3085 * @type {Boolean}
3086 * @default false
3087 * @example
3088 * data: {
3089 * selection: {
3090 * draggable: true
3091 * }
3092 * }
3093 */
3094 data_selection_draggable: !1,
3095
3096 /**
3097 * Set a callback for click event on each data point.<br><br>
3098 * This callback will be called when each data point clicked and will receive d and element as the arguments. d is the data clicked and element is the element clicked. In this callback, this will be the Chart object.
3099 * @name data․onclick
3100 * @memberof Options
3101 * @type {Function}
3102 * @default function() {}
3103 * @example
3104 * data: {
3105 * onclick: function(d, element) { ... }
3106 * }
3107 */
3108 data_onclick: function data_onclick() {},
3109
3110 /**
3111 * Set a callback for mouse/touch over event on each data point.<br><br>
3112 * This callback will be called when mouse cursor or via touch moves onto each data point and will receive d as the argument. d is the data where mouse cursor moves onto. In this callback, this will be the Chart object.
3113 * @name data․onover
3114 * @memberof Options
3115 * @type {Function}
3116 * @default function() {}
3117 * @example
3118 * data: {
3119 * onover: function(d) { ... }
3120 * }
3121 */
3122 data_onover: function data_onover() {},
3123
3124 /**
3125 * Set a callback for mouse/touch out event on each data point.<br><br>
3126 * This callback will be called when mouse cursor or via touch moves out each data point and will receive d as the argument. d is the data where mouse cursor moves out. In this callback, this will be the Chart object.
3127 * @name data․onout
3128 * @memberof Options
3129 * @type {Function}
3130 * @default function() {}
3131 * @example
3132 * data: {
3133 * onout: function(d) { ... }
3134 * }
3135 */
3136 data_onout: function data_onout() {},
3137
3138 /**
3139 * Set a callback for on data selection.
3140 * @name data․onselected
3141 * @memberof Options
3142 * @type {Function}
3143 * @default function() {}
3144 * @example
3145 * data: {
3146 * onselected: function(d, element) {
3147 * // d - ex) {x: 4, value: 150, id: "data1", index: 4, name: "data1"}
3148 * // element - <circle>
3149 * ...
3150 * }
3151 * }
3152 */
3153 data_onselected: function data_onselected() {},
3154
3155 /**
3156 * Set a callback for on data un-selection.
3157 * @name data․onunselected
3158 * @memberof Options
3159 * @type {Function}
3160 * @default function() {}
3161 * @example
3162 * data: {
3163 * onunselected: function(d, element) {
3164 * // d - ex) {x: 4, value: 150, id: "data1", index: 4, name: "data1"}
3165 * // element - <circle>
3166 * ...
3167 * }
3168 * }
3169 */
3170 data_onunselected: function data_onunselected() {},
3171
3172 /**
3173 * Set a callback for minimum data
3174 * - **NOTE:** For 'area-line-range' and 'area-spline-range', `mid` data will be taken for the comparison
3175 * @name data․onmin
3176 * @memberof Options
3177 * @type {Function}
3178 * @default undefined
3179 * @see [Demo](https://naver.github.io/billboard.js/demo/#Data.OnMinMaxCallback)
3180 * @example
3181 * onmin: function(data) {
3182 * // data - ex) [{x: 3, value: 400, id: "data1", index: 3}, ... ]
3183 * ...
3184 * }
3185 */
3186 data_onmin: undefined,
3187
3188 /**
3189 * Set a callback for maximum data
3190 * - **NOTE:** For 'area-line-range' and 'area-spline-range', `mid` data will be taken for the comparison
3191 * @name data․onmax
3192 * @memberof Options
3193 * @type {Function}
3194 * @default undefined
3195 * @see [Demo](https://naver.github.io/billboard.js/demo/#Data.OnMinMaxCallback)
3196 * @example
3197 * onmax: function(data) {
3198 * // data - ex) [{x: 3, value: 400, id: "data1", index: 3}, ... ]
3199 * ...
3200 * }
3201 */
3202 data_onmax: undefined,
3203
3204 /**
3205 * Load a CSV or JSON file from a URL. NOTE that this will not work if loading via the "file://" protocol as the most browsers will block XMLHTTPRequests.
3206 * @name data․url
3207 * @memberof Options
3208 * @type {String}
3209 * @default undefined
3210 * @see [Demo](https://naver.github.io/billboard.js/demo/#Data.LoadData)
3211 * @example
3212 * data: {
3213 * url: "/data/test.csv"
3214 * }
3215 */
3216 data_url: undefined,
3217
3218 /**
3219 * XHR header value
3220 * - **NOTE:** Should be used with `data.url` option
3221 * @name data․headers
3222 * @memberof Options
3223 * @type {String}
3224 * @default undefined
3225 * @see https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/setRequestHeader
3226 * @example
3227 * data: {
3228 * url: "/data/test.csv",
3229 * headers: {
3230 * "Content-Type": "text/xml",
3231 * ...
3232 * }
3233 * }
3234 */
3235 data_headers: undefined,
3236
3237 /**
3238 * Parse a JSON object for data. See also data.keys.
3239 * @name data․json
3240 * @memberof Options
3241 * @type {Object}
3242 * @default undefined
3243 * @see [data․keys](#.data%25E2%2580%25A4keys)
3244 * @see [Demo](https://naver.github.io/billboard.js/demo/#Data.JSONData)
3245 * @example
3246 * data: {
3247 * json: [
3248 * {name: "www.site1.com", upload: 200, download: 200, total: 400},
3249 * {name: "www.site2.com", upload: 100, download: 300, total: 400},
3250 * {name: "www.site3.com", upload: 300, download: 200, total: 500},
3251 * {name: "www.site4.com", upload: 400, download: 100, total: 500}
3252 * ],
3253 * keys: {
3254 * // x: "name", // it's possible to specify 'x' when category axis
3255 * value: ["upload", "download"]
3256 * }
3257 * }
3258 */
3259 data_json: undefined,
3260
3261 /**
3262 * Load data from a multidimensional array, with the first element containing the data names, the following containing related data in that order.
3263 * @name data․rows
3264 * @memberof Options
3265 * @type {Array}
3266 * @default undefined
3267 * @see [Demo](https://naver.github.io/billboard.js/demo/#Data.RowOrientedData)
3268 * @example
3269 * data: {
3270 * rows: [
3271 * ["A", "B", "C"],
3272 * [90, 120, 300],
3273 * [40, 160, 240],
3274 * [50, 200, 290],
3275 * [120, 160, 230],
3276 * [80, 130, 300],
3277 * [90, 220, 320]
3278 * ]
3279 * }
3280 *
3281 * // for 'range' types('area-line-range' or 'area-spline-range'), data should contain:
3282 * // - an array of [high, mid, low] data following the order
3283 * // - or an object with 'high', 'mid' and 'low' key value
3284 * data: {
3285 * rows: [
3286 * ["data1", "data2"],
3287 * [
3288 * // or {high:150, mid: 140, low: 110}, 120
3289 * [150, 140, 110], 120
3290 * ],
3291 * [[155, 130, 115], 55],
3292 * [[160, 135, 120], 60]
3293 * ],
3294 * types: {
3295 * data1: "area-line-range",
3296 * data2: "line"
3297 * }
3298 * }
3299 */
3300 data_rows: undefined,
3301
3302 /**
3303 * Load data from a multidimensional array, with each element containing an array consisting of a datum name and associated data values.
3304 * @name data․columns
3305 * @memberof Options
3306 * @type {Array}
3307 * @default undefined
3308 * @see [Demo](https://naver.github.io/billboard.js/demo/#Data.ColumnOrientedData)
3309 * @example
3310 * data: {
3311 * columns: [
3312 * ["data1", 30, 20, 50, 40, 60, 50],
3313 * ["data2", 200, 130, 90, 240, 130, 220],
3314 * ["data3", 300, 200, 160, 400, 250, 250]
3315 * ]
3316 * }
3317 *
3318 * // for 'range' types('area-line-range' or 'area-spline-range'), data should contain:
3319 * // - an array of [high, mid, low] data following the order
3320 * // - or an object with 'high', 'mid' and 'low' key value
3321 * data: {
3322 * columns: [
3323 * ["data1",
3324 * [150, 140, 110], // or {high:150, mid: 140, low: 110}
3325 * [150, 140, 110],
3326 * [150, 140, 110]
3327 * ]
3328 * ],
3329 * type: "area-line-range"
3330 * }
3331 */
3332 data_columns: undefined,
3333
3334 /**
3335 * Used if loading JSON via data.url.
3336 * @name data․mimeType
3337 * @memberof Options
3338 * @type {String}
3339 * @default undefined
3340 * @example
3341 * data: {
3342 * mimeType: "json"
3343 * }
3344 */
3345 data_mimeType: undefined,
3346
3347 /**
3348 * Choose which JSON object keys correspond to desired data.
3349 * @name data․keys
3350 * @memberof Options
3351 * @type {String}
3352 * @default undefined
3353 * @example
3354 * data: {
3355 * json: [
3356 * {name: "www.site1.com", upload: 200, download: 200, total: 400},
3357 * {name: "www.site2.com", upload: 100, download: 300, total: 400},
3358 * {name: "www.site3.com", upload: 300, download: 200, total: 500},
3359 * {name: "www.site4.com", upload: 400, download: 100, total: 500}
3360 * ],
3361 * keys: {
3362 * // x: "name", // it's possible to specify 'x' when category axis
3363 * value: ["upload", "download"]
3364 * }
3365 * }
3366 */
3367 data_keys: undefined,
3368
3369 /**
3370 * Set text displayed when empty data.
3371 * @name data․empty․label․text
3372 * @memberof Options
3373 * @type {String}
3374 * @default ""
3375 * @example
3376 * data: {
3377 * empty: {
3378 * label: {
3379 * text: "No Data"
3380 * }
3381 * }
3382 * }
3383 */
3384 data_empty_label_text: "",
3385
3386 /**
3387 * Set subchart options
3388 * @name subchart
3389 * @memberof Options
3390 * @type {Object}
3391 * @property {Boolean} [subchart.show=false] Show sub chart on the bottom of the chart.
3392 * @property {Boolean} [subchart.size.height] Change the height of the subchart.
3393 * @property {Boolean} [subchart.onbrush] Set callback for brush event.<br>
3394 * Specified function receives the current zoomed x domain.
3395 * @see [Demo](https://naver.github.io/billboard.js/demo/#Interaction.SubChart)
3396 * @example
3397 * subchart: {
3398 * show: true,
3399 * size: {
3400 * height: 20
3401 * },
3402 * onbrush: function(domain) { ... }
3403 * }
3404 */
3405 subchart_show: !1,
3406 subchart_size_height: 60,
3407 subchart_axis_x_show: !0,
3408 subchart_onbrush: function subchart_onbrush() {},
3409
3410 /**
3411 * Set color of the data values
3412 * @name color
3413 * @memberof Options
3414 * @type {Object}
3415 * @property {Array} [color.pattern] custom color pattern
3416 * @property {Function} [color.tiles] if defined, allows use svg's patterns to fill data area. It should return an array of [SVGPatternElement](https://developer.mozilla.org/en-US/docs/Web/API/SVGPatternElement).
3417 * - **NOTE:** The pattern element's id will be defined as `bb-colorize-pattern-$COLOR-VALUE`.<br>
3418 * ex. When color pattern value is `['red', '#fff']` and defined 2 patterns,then ids for pattern elements are:<br>
3419 * - `bb-colorize-pattern-red`
3420 * - `bb-colorize-pattern-fff`
3421 * @property {Object} [color.threshold] color threshold for gauge and tooltip color
3422 * @property {String} [color.threshold.unit] If set to `value`, the threshold will be based on the data value. Otherwise it'll be based on equation of the `threshold.max` option value.
3423 * @property {Array} [color.threshold.values] Threshold values for each steps
3424 * @property {Array} [color.threshold.max=100] The base value to determine threshold step value condition. When the given value is 15 and max 10, then the value for threshold is `15*100/10`.
3425 * @example
3426 * color: {
3427 * pattern: ["#1f77b4", "#aec7e8", ...],
3428 *
3429 * // Set colors' patterns
3430 * // it should return an array of SVGPatternElement
3431 * tiles: function() {
3432 * var pattern = document.createElementNS("http://www.w3.org/2000/svg", "pattern");
3433 * var g = document.createElementNS("http://www.w3.org/2000/svg", "g");
3434 * var circle1 = document.createElementNS("http://www.w3.org/2000/svg", "circle");
3435 *
3436 * pattern.setAttribute("patternUnits", "userSpaceOnUse");
3437 * pattern.setAttribute("width", "32");
3438 * pattern.setAttribute("height", "32");
3439 *
3440 * g.style.fill = "#000";
3441 * g.style.opacity = "0.2";
3442 *
3443 * circle1.setAttribute("cx", "3");
3444 * circle1.setAttribute("cy", "3");
3445 * circle1.setAttribute("r", "3");
3446 *
3447 * g.appendChild(circle1);
3448 * pattern.appendChild(g);
3449 *
3450 * return [pattern];
3451 * },
3452 *
3453 * // for threshold usage, pattern values should be set for each steps
3454 * pattern: ["grey", "green", "yellow", "orange", "red"],
3455 * threshold: {
3456 * unit: "value",
3457 * values: [10, 20, 30, 40, 50], // when the value is 20, 'green' will be set and the value is 40, 'orange' will be set.
3458 * max: 30 // the equation for max is: value*100/30
3459 * }
3460 * }
3461 */
3462 color_pattern: [],
3463 color_tiles: undefined,
3464 color_threshold: {},
3465
3466 /**
3467 * Legend options
3468 * @name legend
3469 * @memberof Options
3470 * @type {Object}
3471 * @property {Boolean} [legend.show=true] Show or hide legend.
3472 * @property {Boolean} [legend.hide=false] Hide legend
3473 * If true given, all legend will be hidden. If string or array given, only the legend that has the id will be hidden.
3474 * @property {String|HTMLElement} [legend.contents.bindto=undefined] Set CSS selector or element reference to bind legend items.
3475 * @property {String|Function} [legend.contents.template=undefined] Set item's template.<br>
3476 * - If set `string` value, within template the 'color' and 'title' can be replaced using template-like syntax string:
3477 * - {=COLOR}: data color value
3478 * - {=TITLE}: data title value
3479 * - If set `function` value, will pass following arguments to the given function:
3480 * - title {String}: data's id value
3481 * - color {String}: color string
3482 * - data {Array}: data array
3483 * @property {String} [legend.position=bottom] Change the position of legend.<br>
3484 * Available values are: `bottom`, `right` and `inset` are supported.
3485 * @property {Object} [legend.inset={anchor: 'top-left',x: 10,y: 0,step: undefined}] Change inset legend attributes.<br>
3486 * This option accepts object that has the keys `anchor`, `x`, `y` and `step`.
3487 * - **anchor** decides the position of the legend:
3488 * - top-left
3489 * - top-right
3490 * - bottom-left
3491 * - bottom-right
3492 * - **x** and **y**:
3493 * - set the position of the legend based on the anchor.
3494 * - **step**:
3495 * - defines the max step the legend has (e.g. If 2 set and legend has 3 legend item, the legend 2 columns).
3496 * @property {Boolean} [legend.equally=false] Set to all items have same width size.
3497 * @property {Boolean} [legend.padding=0] Set padding value
3498 * @property {Function} [legend.item.onclick=undefined] Set click event handler to the legend item.
3499 * @property {Function} [legend.item.onover=undefined] Set mouse/touch over event handler to the legend item.
3500 * @property {Function} [legend.item.onout=undefined] Set mouse/touch out event handler to the legend item.
3501 * @property {Number} [legend.item.tile.width=10] Set width of item tile element
3502 * @property {Number} [legend.item.tile.height=10] Set height of item tile element
3503 * @property {Boolean} [legend.usePoint=false] Whether to use custom points in legend.
3504 * @see [Demo: position](https://naver.github.io/billboard.js/demo/#Legend.LegendPosition)
3505 * @see [Demo: contents.template](https://naver.github.io/billboard.js/demo/#Legend.LegendTemplate1)
3506 * @see [Demo: usePoint](https://naver.github.io/billboard.js/demo/#Legend.usePoint)
3507 * @example
3508 * legend: {
3509 * show: true,
3510 * hide: true,
3511 * //or hide: "data1"
3512 * //or hide: ["data1", "data2"]
3513 * contents: {
3514 * bindto: "#legend", // <ul id='legend'></ul>
3515 *
3516 * // will be as: <li style='background-color:#1f77b4'>data1</li>
3517 * template: "<li style='background-color:{=COLOR}'>{=TITLE}</li>"
3518 *
3519 * // or using function
3520 * template: function(id, color, data) {
3521 * // if you want omit some legend, return falsy value
3522 * if (title !== "data1") {
3523 * return "<li style='background-color:"+ color +">"+ title +"</li>";
3524 * }
3525 * }
3526 * },
3527 * position: "bottom", // bottom, right, inset
3528 * inset: {
3529 * anchor: "top-right" // top-left, top-right, bottom-left, bottom-right
3530 * x: 20,
3531 * y: 10,
3532 * step: 2
3533 * },
3534 * equally: false,
3535 * padding: 10,
3536 * item: {
3537 * onclick: function(id) { ... },
3538 * onover: function(id) { ... },
3539 * onout: function(id) { ... },
3540 *
3541 * // set tile's size
3542 * tile: {
3543 * width: 20,
3544 * height: 15
3545 * }
3546 * },
3547 * usePoint: true
3548 * }
3549 */
3550 legend_show: !0,
3551 legend_hide: !1,
3552 legend_contents_bindto: undefined,
3553 legend_contents_template: undefined,
3554 legend_position: "bottom",
3555 legend_inset_anchor: "top-left",
3556 legend_inset_x: 10,
3557 legend_inset_y: 0,
3558 legend_inset_step: undefined,
3559 legend_item_onclick: undefined,
3560 legend_item_onover: undefined,
3561 legend_item_onout: undefined,
3562 legend_equally: !1,
3563 legend_padding: 0,
3564 legend_item_tile_width: 10,
3565 legend_item_tile_height: 10,
3566 legend_usePoint: !1,
3567
3568 /**
3569 * Switch x and y axis position.
3570 * @name axis․rotated
3571 * @memberof Options
3572 * @type {Boolean}
3573 * @default false
3574 * @example
3575 * axis: {
3576 * rotated: true
3577 * }
3578 */
3579 axis_rotated: !1,
3580
3581 /**
3582 * Set clip-path attribute for x axis element
3583 * @name axis․x․clipPath
3584 * @memberof Options
3585 * @type {Boolean}
3586 * @default true
3587 * @see [Demo]()
3588 * @example
3589 * // don't set 'clip-path' attribute
3590 * clipPath: false
3591 */
3592 axis_x_clipPath: !0,
3593
3594 /**
3595 * Show or hide x axis.
3596 * @name axis․x․show
3597 * @memberof Options
3598 * @type {Boolean}
3599 * @default true
3600 * @example
3601 * axis: {
3602 * x: {
3603 * show: false
3604 * }
3605 * }
3606 */
3607 axis_x_show: !0,
3608
3609 /**
3610 * Set type of x axis.<br><br>
3611 * **Available Values:**
3612 * - timeseries
3613 * - category
3614 * - indexed
3615 * @name axis․x․type
3616 * @memberof Options
3617 * @type {String}
3618 * @default indexed
3619 * @see [Demo: indexed](https://naver.github.io/billboard.js/demo/#Chart.AreaChart)
3620 * @see [Demo: timeseries](https://naver.github.io/billboard.js/demo/#Chart.TimeseriesChart)
3621 * @see [Demo: category](https://naver.github.io/billboard.js/demo/#Data.CategoryData)
3622 * @example
3623 * axis: {
3624 * x: {
3625 * type: "timeseries"
3626 * }
3627 * }
3628 */
3629 axis_x_type: "indexed",
3630
3631 /**
3632 * Set how to treat the timezone of x values.<br>
3633 * If true, treat x value as localtime. If false, convert to UTC internally.
3634 * @name axis․x․localtime
3635 * @memberof Options
3636 * @type {Boolean}
3637 * @default true
3638 * @example
3639 * axis: {
3640 * x: {
3641 * localtime: false
3642 * }
3643 * }
3644 */
3645 axis_x_localtime: !0,
3646
3647 /**
3648 * Set category names on category axis.
3649 * This must be an array that includes category names in string. If category names are included in the date by data.x option, this is not required.
3650 * @name axis․x․categories
3651 * @memberof Options
3652 * @type {Array}
3653 * @default []
3654 * @example
3655 * axis: {
3656 * x: {
3657 * categories: ["Category 1", "Category 2", ...]
3658 * }
3659 * }
3660 */
3661 axis_x_categories: [],
3662
3663 /**
3664 * Centerise ticks on category axis.
3665 * @name axis․x․tick․centered
3666 * @memberof Options
3667 * @type {Boolean}
3668 * @default false
3669 * @example
3670 * axis: {
3671 * x: {
3672 * tick: {
3673 * centered: true
3674 * }
3675 * }
3676 * }
3677 */
3678 axis_x_tick_centered: !1,
3679
3680 /**
3681 * A function to format tick value. Format string is also available for timeseries data.
3682 * @name axis․x․tick․format
3683 * @memberof Options
3684 * @type {Function}
3685 * @default undefined
3686 * @example
3687 * axis: {
3688 * x: {
3689 * tick: {
3690 * // for timeseries, a 'datetime' object is given as parameter
3691 * format: function(x) {
3692 * return x.getFullYear();
3693 * }
3694 *
3695 * // for category, index(Number) and categoryName(String) are given as parameter
3696 * format: function(index, categoryName) {
3697 * return categoryName.substr(0, 10);
3698 * }
3699 * }
3700 * }
3701 * }
3702 */
3703 axis_x_tick_format: undefined,
3704
3705 /**
3706 * Setting for culling ticks.<br><br>
3707 * If true is set, the ticks will be culled, then only limitted tick text will be shown. This option does not hide the tick lines. If false is set, all of ticks will be shown.<br><br>
3708 * We can change the number of ticks to be shown by axis.x.tick.culling.max.
3709 * @name axis․x․tick․culling
3710 * @memberof Options
3711 * @type {Boolean}
3712 * @default
3713 * - true for indexed axis and timeseries axis
3714 * - false for category axis
3715 * @example
3716 * axis: {
3717 * x: {
3718 * tick: {
3719 * culling: false
3720 * }
3721 * }
3722 * }
3723 */
3724 axis_x_tick_culling: {},
3725
3726 /**
3727 * The number of tick texts will be adjusted to less than this value.
3728 * @name axis․x․tick․culling․max
3729 * @memberof Options
3730 * @type {Number}
3731 * @default 10
3732 * @example
3733 * axis: {
3734 * x: {
3735 * tick: {
3736 * culling: {
3737 * max: 5
3738 * }
3739 * }
3740 * }
3741 * }
3742 */
3743 axis_x_tick_culling_max: 10,
3744
3745 /**
3746 * The number of x axis ticks to show.<br><br>
3747 * This option hides tick lines together with tick text. If this option is used on timeseries axis, the ticks position will be determined precisely and not nicely positioned (e.g. it will have rough second value).
3748 * @name axis․x․tick․count
3749 * @memberof Options
3750 * @type {Number}
3751 * @default undefined
3752 * @example
3753 * axis: {
3754 * x: {
3755 * tick: {
3756 * count: 5
3757 * }
3758 * }
3759 * }
3760 */
3761 axis_x_tick_count: undefined,
3762
3763 /**
3764 * Set the x Axis tick text's position relatively its original position
3765 * @name axis․x․tick․text․position
3766 * @memberof Options
3767 * @type {Object}
3768 * @default {x: 0, y:0}
3769 * @example
3770 * axis: {
3771 * x: {
3772 * tick: {
3773 * text: {
3774 * position: {
3775 * x: 10,
3776 * y: 10
3777 * }
3778 * }
3779 * }
3780 * }
3781 * }
3782 */
3783 axis_x_tick_text_position: {
3784 x: 0,
3785 y: 0
3786 },
3787
3788 /**
3789 * Fit x axis ticks.<br><br>
3790 * If true set, the ticks will be positioned nicely. If false set, the ticks will be positioned according to x value of the data points.
3791 * @name axis․x․tick․fit
3792 * @memberof Options
3793 * @type {Boolean}
3794 * @default true
3795 * @example
3796 * axis: {
3797 * x: {
3798 * tick: {
3799 * fit: false
3800 * }
3801 * }
3802 * }
3803 */
3804 axis_x_tick_fit: !0,
3805
3806 /**
3807 * Set the x values of ticks manually.<br><br>
3808 * If this option is provided, the position of the ticks will be determined based on those values. This option works with timeseries data and the x values will be parsed accoding to the type of the value and data.xFormat option.
3809 * @name axis․x․tick․values
3810 * @memberof Options
3811 * @type {Array}
3812 * @default null
3813 * @example
3814 * axis: {
3815 * x: {
3816 * tick: {
3817 * values: [1, 2, 4, 8, 16, 32, ...]
3818 * }
3819 * }
3820 * }
3821 */
3822 axis_x_tick_values: null,
3823
3824 /**
3825 * Rotate x axis tick text.<br>
3826 * If you set negative value, it will rotate to opposite direction.
3827 * @name axis․x․tick․rotate
3828 * @memberof Options
3829 * @type {Number}
3830 * @default 0
3831 * @see [Demo](https://naver.github.io/billboard.js/demo/#Axis.RotateXAxisTickText)
3832 * @example
3833 * axis: {
3834 * x: {
3835 * tick: {
3836 * rotate: 60
3837 * }
3838 * }
3839 * }
3840 */
3841 axis_x_tick_rotate: 0,
3842
3843 /**
3844 * Show x axis outer tick.
3845 * @name axis․x․tick․outer
3846 * @memberof Options
3847 * @type {Boolean}
3848 * @default true
3849 * @example
3850 * axis: {
3851 * x: {
3852 * tick: {
3853 * outer: false
3854 * }
3855 * }
3856 * }
3857 */
3858 axis_x_tick_outer: !0,
3859
3860 /**
3861 * Set tick text to be multiline
3862 * - **NOTE:**
3863 * > When x tick text contains `\n`, it's used as line break and 'axis.x.tick.width' option is ignored.
3864 * @name axis․x․tick․multiline
3865 * @memberof Options
3866 * @type {Boolean}
3867 * @default true
3868 * @see [Demo](https://naver.github.io/billboard.js/demo/#Axis.XAxisTickMultiline)
3869 * @example
3870 * axis: {
3871 * x: {
3872 * tick: {
3873 * multiline: false
3874 * }
3875 * }
3876 * }
3877 * @example
3878 * // example of line break with '\n'
3879 * // In this case, 'axis.x.tick.width' is ignored
3880 * data: {
3881 * x: "x",
3882 * columns: [
3883 * ["x", "long\ntext", "Another\nLong\nText"],
3884 * ...
3885 * ],
3886 * }
3887 */
3888 axis_x_tick_multiline: !0,
3889
3890 /**
3891 * Set tick width
3892 * - **NOTE:**
3893 * > When x tick text contains `\n`, this option is ignored.
3894 * @name axis․x․tick․width
3895 * @memberof Options
3896 * @type {Number}
3897 * @default null
3898 * @example
3899 * axis: {
3900 * x: {
3901 * tick: {
3902 * width: 50
3903 * }
3904 * }
3905 * }
3906 */
3907 axis_x_tick_width: null,
3908
3909 /**
3910 * Set to display system tooltip(via 'title' attribute) for tick text
3911 * - **NOTE:** Only available for category axis type (`axis.x.type='category'`)
3912 * @name axis․x․tick․tooltip
3913 * @memberof Options
3914 * @type {Boolean}
3915 * @default false
3916 * @example
3917 * axis: {
3918 * x: {
3919 * tick: {
3920 * tooltip: true
3921 * }
3922 * }
3923 * }
3924 */
3925 axis_x_tick_tooltip: !1,
3926
3927 /**
3928 * Set max value of x axis range.
3929 * @name axis․x․max
3930 * @memberof Options
3931 * @type {Number}
3932 * @default undefined
3933 * @example
3934 * axis: {
3935 * x: {
3936 * max: 100
3937 * }
3938 * }
3939 */
3940 axis_x_max: undefined,
3941
3942 /**
3943 * Set min value of x axis range.
3944 * @name axis․x․min
3945 * @memberof Options
3946 * @type {Number}
3947 * @default undefined
3948 * @example
3949 * axis: {
3950 * x: {
3951 * min: -100
3952 * }
3953 * }
3954 */
3955 axis_x_min: undefined,
3956
3957 /**
3958 * Set padding for x axis.<br><br>
3959 * If this option is set, the range of x axis will increase/decrease according to the values.
3960 * If no padding is needed in the rage of x axis, 0 should be set.
3961 * - **NOTE:**
3962 * The padding values aren't based on pixels. It differs according axis types<br>
3963 * - **category:** The unit of tick value
3964 * ex. the given value `1`, is same as the width of 1 tick width
3965 * - **timeseries:** Numeric time value
3966 * ex. the given value `1000*60*60*24`, which is numeric time equivalent of a day, is same as the width of 1 tick width
3967 * @name axis․x․padding
3968 * @memberof Options
3969 * @type {Object}
3970 * @default {}
3971 * @example
3972 * axis: {
3973 * x: {
3974 * padding: {
3975 * // when axis type is 'category'
3976 * left: 1, // set left padding width of equivalent value of a tick's width
3977 * right: 0.5 // set right padding width as half of equivalent value of tick's width
3978 *
3979 * // when axis type is 'timeseries'
3980 * left: 1000*60*60*24, // set left padding width of equivalent value of a day tick's width
3981 * right: 1000*60*60*12 // set right padding width as half of equivalent value of a day tick's width
3982 * }
3983 * }
3984 * }
3985 */
3986 axis_x_padding: {},
3987
3988 /**
3989 * Set height of x axis.<br><br>
3990 * The height of x axis can be set manually by this option. If you need more space for x axis, please use this option for that. The unit is pixel.
3991 * @name axis․x․height
3992 * @memberof Options
3993 * @type {Number}
3994 * @default undefined
3995 * @example
3996 * axis: {
3997 * x: {
3998 * height: 20
3999 * }
4000 * }
4001 */
4002 axis_x_height: undefined,
4003
4004 /**
4005 * Set default extent for subchart and zoom. This can be an array or function that returns an array.
4006 * @name axis․x․extent
4007 * @memberof Options
4008 * @type {Array}
4009 * @default undefined
4010 * @example
4011 * axis: {
4012 * x: {
4013 * // [[x0, y0], [x1, y1]], where [x0, y0] is the top-left corner and [x1, y1] is the bottom-right corner
4014 * // https://github.com/d3/d3-brush/blob/master/src/brush.js#L521
4015 * extent: [
4016 * [0, 0], [200, 60]
4017 * ]
4018 * }
4019 * }
4020 */
4021 axis_x_extent: undefined,
4022
4023 /**
4024 * Set label on x axis.<br><br>
4025 * You can set x axis label and change its position by this option. string and object can be passed and we can change the poisiton by passing object that has position key. Available position differs according to the axis direction (vertical or horizontal). If string set, the position will be the default.
4026 * - **If it's horizontal axis:**
4027 * - inner-right [default]
4028 * - inner-center
4029 * - inner-left
4030 * - outer-right
4031 * - outer-center
4032 * - outer-left
4033 * - **If it's vertical axis:**
4034 * - inner-top [default]
4035 * - inner-middle
4036 * - inner-bottom
4037 * - outer-top
4038 * - outer-middle
4039 * - outer-bottom
4040 * @name axis․x․label
4041 * @memberof Options
4042 * @type {String|Object}
4043 * @default undefined
4044 * @example
4045 * axis: {
4046 * x: {
4047 * label: "Your X Axis"
4048 * }
4049 * }
4050 *
4051 * axis: {
4052 * x: {
4053 * label: {
4054 * text: "Your X Axis",
4055 * position: "outer-center"
4056 * }
4057 * }
4058 * }
4059 */
4060 axis_x_label: {},
4061
4062 /**
4063 * Set additional axes for x Axis.
4064 * - **NOTE:** Axis' scale is based on x Axis value
4065 *
4066 * Each axis object should consist with following options:
4067 *
4068 * | Name | Type | Default | Description |
4069 * | --- | --- | --- | --- |
4070 * | tick.outer | Boolean | true | Show outer tick |
4071 * | tick.format | Function | - | Set formatter for tick text |
4072 * | tick.count | Number | - | Set the number of y axis ticks |
4073 * | tick.values | Array | - | Set tick values manually |
4074 * @name axis․x․axes
4075 * @memberof Options
4076 * @type {Array}
4077 * @see [Demo](https://naver.github.io/billboard.js/demo/#Axis.MultiAxes)
4078 * @example
4079 * x: {
4080 * axes: [
4081 * {
4082 * tick: {
4083 * outer: false,
4084 * format: function(x) {
4085 * return x + "%";
4086 * },
4087 * count: 2,
4088 * values: [10, 20, 30]
4089 * }
4090 * },
4091 * ...
4092 * ]
4093 * }
4094 */
4095 axis_x_axes: [],
4096
4097 /**
4098 * Set clip-path attribute for y axis element
4099 * @name axis․y․clipPath
4100 * @memberof Options
4101 * @type {Boolean}
4102 * @default true
4103 * @example
4104 * // don't set 'clip-path' attribute
4105 * clipPath: false
4106 */
4107 axis_y_clipPath: !0,
4108
4109 /**
4110 * Show or hide y axis.
4111 * @name axis․y․show
4112 * @memberof Options
4113 * @type {Boolean}
4114 * @default true
4115 * @example
4116 * axis: {
4117 * y: {
4118 * show: false
4119 * }
4120 * }
4121 */
4122 axis_y_show: !0,
4123
4124 /**
4125 * Set type of y axis.<br><br>
4126 * **Available Values:**
4127 * - timeseries
4128 * - category
4129 * - indexed
4130 * @name axis․y․type
4131 * @memberof Options
4132 * @type {String}
4133 * @default undefined
4134 * @example
4135 * axis: {
4136 * y: {
4137 * type: "timeseries"
4138 * }
4139 * }
4140 */
4141 axis_y_type: undefined,
4142
4143 /**
4144 * Set max value of y axis.
4145 * - **NOTE:** Padding will be added based on this value, so if you don't need the padding, please set axis.y.padding to disable it (e.g. axis.y.padding = 0).
4146 * @name axis․y․max
4147 * @memberof Options
4148 * @type {Number}
4149 * @default undefined
4150 * @example
4151 * axis: {
4152 * y: {
4153 * max: 1000
4154 * }
4155 * }
4156 */
4157 axis_y_max: undefined,
4158
4159 /**
4160 * Set min value of y axis.
4161 * - **NOTE:**
4162 * Padding will be added based on this value, so if you don't need the padding, please set axis.y.padding to disable it (e.g. axis.y.padding = 0).
4163 * @name axis․y․min
4164 * @memberof Options
4165 * @type {Number}
4166 * @default undefined
4167 * @example
4168 * axis: {
4169 * y: {
4170 * min: 1000
4171 * }
4172 * }
4173 */
4174 axis_y_min: undefined,
4175
4176 /**
4177 * Change the direction of y axis.<br><br>
4178 * If true set, the direction will be from the top to the bottom.
4179 * @name axis․y․inverted
4180 * @memberof Options
4181 * @type {Boolean}
4182 * @default false
4183 * @example
4184 * axis: {
4185 * y: {
4186 * inverted: true
4187 * }
4188 * }
4189 */
4190 axis_y_inverted: !1,
4191
4192 /**
4193 * Set center value of y axis.
4194 * @name axis․y․center
4195 * @memberof Options
4196 * @type {Number}
4197 * @default undefined
4198 * @example
4199 * axis: {
4200 * y: {
4201 * center: 0
4202 * }
4203 * }
4204 */
4205 axis_y_center: undefined,
4206
4207 /**
4208 * Show y axis inside of the chart.
4209 * @name axis․y․inner
4210 * @memberof Options
4211 * @type {Boolean}
4212 * @default false
4213 * @example
4214 * axis: {
4215 * y: {
4216 * inner: true
4217 * }
4218 * }
4219 */
4220 axis_y_inner: !1,
4221
4222 /**
4223 * Set label on y axis.<br><br>
4224 * You can set y axis label and change its position by this option. This option works in the same way as axis.x.label.
4225 * @name axis․y․label
4226 * @memberof Options
4227 * @type {String|Object}
4228 * @default {}
4229 * @example
4230 * axis: {
4231 * y: {
4232 * label: "Your Y Axis"
4233 * }
4234 * }
4235 *
4236 * axis: {
4237 * y: {
4238 * label: {
4239 * text: "Your Y Axis",
4240 * position: "outer-middle"
4241 * }
4242 * }
4243 * }
4244 */
4245 axis_y_label: {},
4246
4247 /**
4248 * Set formatter for y axis tick text.<br><br>
4249 * This option accepts d3.format object as well as a function you define.
4250 * @name axis․y․tick․format
4251 * @memberof Options
4252 * @type {Function}
4253 * @default undefined
4254 * @example
4255 * axis: {
4256 * y: {
4257 * tick: {
4258 * format: function(x) {
4259 * return x.getFullYear();
4260 * }
4261 * }
4262 * }
4263 * }
4264 */
4265 axis_y_tick_format: undefined,
4266
4267 /**
4268 * Show y axis outer tick.
4269 * @name axis․y․tick․outer
4270 * @memberof Options
4271 * @type {Boolean}
4272 * @default true
4273 * @example
4274 * axis: {
4275 * y: {
4276 * tick: {
4277 * outer: false
4278 * }
4279 * }
4280 * }
4281 */
4282 axis_y_tick_outer: !0,
4283
4284 /**
4285 * Set y axis tick values manually.
4286 * @name axis․y․tick․values
4287 * @memberof Options
4288 * @type {Array}
4289 * @default null
4290 * @example
4291 * axis: {
4292 * y: {
4293 * tick: {
4294 * values: [100, 1000, 10000]
4295 * }
4296 * }
4297 * }
4298 */
4299 axis_y_tick_values: null,
4300 axis_y_tick_rotate: 0,
4301
4302 /**
4303 * Set the number of y axis ticks.<br><br>
4304 * - **NOTE:** The position of the ticks will be calculated precisely, so the values on the ticks will not be rounded nicely. In the case, axis.y.tick.format or axis.y.tick.values will be helpful.
4305 * @name axis․y․tick․count
4306 * @memberof Options
4307 * @type {Number}
4308 * @default undefined
4309 * @example
4310 * axis: {
4311 * y: {
4312 * tick: {
4313 * count: 5
4314 * }
4315 * }
4316 * }
4317 */
4318 axis_y_tick_count: undefined,
4319
4320 /**
4321 * Set the y Axis tick text's position relatively its original position
4322 * @name axis․y․tick․text․position
4323 * @memberof Options
4324 * @type {Object}
4325 * @default {x: 0, y:0}
4326 * @example
4327 * axis: {
4328 * y: {
4329 * tick: {
4330 * text: {
4331 * position: {
4332 * x: 10,
4333 * y: 10
4334 * }
4335 * }
4336 * }
4337 * }
4338 * }
4339 */
4340 axis_y_tick_text_position: {
4341 x: 0,
4342 y: 0
4343 },
4344
4345 /**
4346 * Set the number of y axis ticks.<br><br>
4347 * - **NOTE:** The position of the ticks will be calculated precisely, so the values on the ticks will not be rounded nicely. In the case, axis.y.tick.format or axis.y.tick.values will be helpful.
4348 * @name axis․y․tick․time
4349 * @memberof Options
4350 * @private
4351 * @type {Object}
4352 * @property {Function} [time.value] D3's time interval function (https://github.com/d3/d3-time#intervals)
4353 * @example
4354 * axis: {
4355 * y: {
4356 * tick: {
4357 * time: {
4358 * // ticks at 15-minute intervals
4359 * // https://github.com/d3/d3-scale/blob/master/README.md#time_ticks
4360 * value: d3.timeMinute.every(15)
4361 * }
4362 * }
4363 * }
4364 * }
4365 */
4366 // @TODO: not fully implemented yet
4367 axis_y_tick_time_value: undefined,
4368
4369 /**
4370 * Set padding for y axis.<br><br>
4371 * You can set padding for y axis to create more space on the edge of the axis.
4372 * This option accepts object and it can include top and bottom. top, bottom will be treated as pixels.
4373 *
4374 * - **NOTE:** For area and bar type charts, [area.zerobased](#.area) or [bar.zerobased](#.bar) options should be set to 'false` to get padded bottom.
4375 * @name axis․y․padding
4376 * @memberof Options
4377 * @type {Object}
4378 * @default {}
4379 * @example
4380 * axis: {
4381 * y: {
4382 * padding: {
4383 * top: 0,
4384 * bottom: 0
4385 * }
4386 * }
4387 * }
4388 */
4389 axis_y_padding: {},
4390
4391 /**
4392 * Set default range of y axis.<br><br>
4393 * This option set the default value for y axis when there is no data on init.
4394 * @name axis․y․default
4395 * @memberof Options
4396 * @type {Array}
4397 * @default undefined
4398 * @example
4399 * axis: {
4400 * y: {
4401 * default: [0, 1000]
4402 * }
4403 * }
4404 */
4405 axis_y_default: undefined,
4406
4407 /**
4408 * Set additional axes for y Axis.
4409 * - **NOTE:** Axis' scale is based on y Axis value
4410 *
4411 * Each axis object should consist with following options:
4412 *
4413 * | Name | Type | Default | Description |
4414 * | --- | --- | --- | --- |
4415 * | tick.outer | Boolean | true | Show outer tick |
4416 * | tick.format | Function | - | Set formatter for tick text |
4417 * | tick.count | Number | - | Set the number of y axis ticks |
4418 * | tick.values | Array | - | Set tick values manually |
4419 * @name axis․y․axes
4420 * @memberof Options
4421 * @type {Array}
4422 * @see [Demo](https://naver.github.io/billboard.js/demo/#Axis.MultiAxes)
4423 * @example
4424 * y: {
4425 * axes: [
4426 * {
4427 * tick: {
4428 * outer: false,
4429 * format: function(x) {
4430 * return x + "%";
4431 * },
4432 * count: 2,
4433 * values: [10, 20, 30]
4434 * }
4435 * },
4436 * ...
4437 * ]
4438 * }
4439 */
4440 axis_y_axes: [],
4441
4442 /**
4443 * Show or hide y2 axis.
4444 * @name axis․y2․show
4445 * @memberof Options
4446 * @type {Boolean}
4447 * @default false
4448 * @example
4449 * axis: {
4450 * y2: {
4451 * show: true
4452 * }
4453 * }
4454 */
4455 axis_y2_show: !1,
4456
4457 /**
4458 * Set max value of y2 axis.
4459 * @name axis․y2․max
4460 * @memberof Options
4461 * @type {Number}
4462 * @default undefined
4463 * @example
4464 * axis: {
4465 * y2: {
4466 * max: 1000
4467 * }
4468 * }
4469 */
4470 axis_y2_max: undefined,
4471
4472 /**
4473 * Set min value of y2 axis.
4474 * @name axis․y2․min
4475 * @memberof Options
4476 * @type {Number}
4477 * @default undefined
4478 * @example
4479 * axis: {
4480 * y2: {
4481 * min: -1000
4482 * }
4483 * }
4484 */
4485 axis_y2_min: undefined,
4486
4487 /**
4488 * Change the direction of y2 axis.<br><br>
4489 * If true set, the direction will be from the top to the bottom.
4490 * @name axis․y2․inverted
4491 * @memberof Options
4492 * @type {Boolean}
4493 * @default false
4494 * @example
4495 * axis: {
4496 * y2: {
4497 * inverted: true
4498 * }
4499 * }
4500 */
4501 axis_y2_inverted: !1,
4502
4503 /**
4504 * Set center value of y2 axis.
4505 * @name axis․y2․center
4506 * @memberof Options
4507 * @type {Number}
4508 * @default undefined
4509 * @example
4510 * axis: {
4511 * y2: {
4512 * center: 0
4513 * }
4514 * }
4515 */
4516 axis_y2_center: undefined,
4517
4518 /**
4519 * Show y2 axis inside of the chart.
4520 * @name axis․y2․inner
4521 * @memberof Options
4522 * @type {Boolean}
4523 * @default false
4524 * @example
4525 * axis: {
4526 * y2: {
4527 * inner: true
4528 * }
4529 * }
4530 */
4531 axis_y2_inner: !1,
4532
4533 /**
4534 * Set label on y2 axis.<br><br>
4535 * You can set y2 axis label and change its position by this option. This option works in the same way as axis.x.label.
4536 * @name axis․y2․label
4537 * @memberof Options
4538 * @type {String|Object}
4539 * @default {}
4540 * @example
4541 * axis: {
4542 * y2: {
4543 * label: "Your Y2 Axis"
4544 * }
4545 * }
4546 *
4547 * axis: {
4548 * y2: {
4549 * label: {
4550 * text: "Your Y2 Axis",
4551 * position: "outer-middle"
4552 * }
4553 * }
4554 * }
4555 */
4556 axis_y2_label: {},
4557
4558 /**
4559 * Set formatter for y2 axis tick text.<br><br>
4560 * This option works in the same way as axis.y.format.
4561 * @name axis․y2․tick․format
4562 * @memberof Options
4563 * @type {Function}
4564 * @default undefined
4565 * @example
4566 * axis: {
4567 * y2: {
4568 * tick: {
4569 * format: d3.format("$,")
4570 * //or format: function(d) { return "$" + d; }
4571 * }
4572 * }
4573 * }
4574 */
4575 axis_y2_tick_format: undefined,
4576
4577 /**
4578 * Show or hide y2 axis outer tick.
4579 * @name axis․y2․tick․outer
4580 * @memberof Options
4581 * @type {Boolean}
4582 * @default true
4583 * @example
4584 * axis: {
4585 * y2: {
4586 * tick: {
4587 * outer: false
4588 * }
4589 * }
4590 * }
4591 */
4592 axis_y2_tick_outer: !0,
4593
4594 /**
4595 * Set y2 axis tick values manually.
4596 * @name axis․y2․tick․values
4597 * @memberof Options
4598 * @type {Array}
4599 * @default null
4600 * @example
4601 * axis: {
4602 * y2: {
4603 * tick: {
4604 * values: [100, 1000, 10000]
4605 * }
4606 * }
4607 * }
4608 */
4609 axis_y2_tick_values: null,
4610
4611 /**
4612 * Set the number of y2 axis ticks.
4613 * - **NOTE:** This works in the same way as axis.y.tick.count.
4614 * @name axis․y2․tick․count
4615 * @memberof Options
4616 * @type {Number}
4617 * @default undefined
4618 * @example
4619 * axis: {
4620 * y2: {
4621 * tick: {
4622 * count: 5
4623 * }
4624 * }
4625 * }
4626 */
4627 axis_y2_tick_count: undefined,
4628
4629 /**
4630 * Set the y2 Axis tick text's position relatively its original position
4631 * @name axis․y2․tick․text․position
4632 * @memberof Options
4633 * @type {Object}
4634 * @default {x: 0, y:0}
4635 * @example
4636 * axis: {
4637 * y2: {
4638 * tick: {
4639 * text: {
4640 * position: {
4641 * x: 10,
4642 * y: 10
4643 * }
4644 * }
4645 * }
4646 * }
4647 * }
4648 */
4649 axis_y2_tick_text_position: {
4650 x: 0,
4651 y: 0
4652 },
4653
4654 /**
4655 * Set the number of y2 axis ticks.
4656 * - **NOTE:** This works in the same way as axis.y.tick.count.
4657 * @name axis․y2․padding
4658 * @memberof Options
4659 * @type {Object}
4660 * @default {}
4661 * @example
4662 * axis: {
4663 * y2: {
4664 * padding: {
4665 * top: 100,
4666 * bottom: 100
4667 * }
4668 * }
4669 * }
4670 */
4671 axis_y2_padding: {},
4672
4673 /**
4674 * Set default range of y2 axis.<br><br>
4675 * This option set the default value for y2 axis when there is no data on init.
4676 * @name axis․y2․default
4677 * @memberof Options
4678 * @type {Array}
4679 * @default undefined
4680 * @example
4681 * axis: {
4682 * y2: {
4683 * default: [0, 1000]
4684 * }
4685 * }
4686 */
4687 axis_y2_default: undefined,
4688
4689 /**
4690 * Set additional axes for y2 Axis.
4691 * - **NOTE:** Axis' scale is based on y2 Axis value
4692 *
4693 * Each axis object should consist with following options:
4694 *
4695 * | Name | Type | Default | Description |
4696 * | --- | --- | --- | --- |
4697 * | tick.outer | Boolean | true | Show outer tick |
4698 * | tick.format | Function | - | Set formatter for tick text |
4699 * | tick.count | Number | - | Set the number of y axis ticks |
4700 * | tick.values | Array | - | Set tick values manually |
4701 * @name axis․y2․axes
4702 * @memberof Options
4703 * @type {Array}
4704 * @see [Demo](https://naver.github.io/billboard.js/demo/#Axis.MultiAxes)
4705 * @example
4706 * y2: {
4707 * axes: [
4708 * {
4709 * tick: {
4710 * outer: false,
4711 * format: function(x) {
4712 * return x + "%";
4713 * },
4714 * count: 2,
4715 * values: [10, 20, 30]
4716 * }
4717 * },
4718 * ...
4719 * ]
4720 * }
4721 */
4722 axis_y2_axes: [],
4723
4724 /**
4725 * Set related options
4726 * @name grid
4727 * @memberof Options
4728 * @type {Object}
4729 * @property {Boolean} [front=false] Set 'grid & focus lines' to be positioned over grid lines and chart elements.
4730 * @property {Boolean} [x.show=false] Show grids along x axis.
4731 * @property {Array} [x.lines=[]] Show additional grid lines along x axis.<br>
4732 * This option accepts array including object that has value, text, position and class. text, position and class are optional. For position, start, middle and end (default) are available.
4733 * If x axis is category axis, value can be category name. If x axis is timeseries axis, value can be date string, Date object and unixtime integer.
4734 * @property {Boolean} [y.show=false] Show grids along x axis.
4735 * @property {Array} [y.lines=[]] Show additional grid lines along y axis.<br>
4736 * This option accepts array including object that has value, text, position and class.
4737 * @property {Number} [y.ticks=10] Number of y grids to be shown.
4738 * @property {Boolean} [focus.show=true] Show grids when focus.
4739 * @property {Boolean} [lines.front=true] Set grid lines to be positioned over chart elements.
4740 * @default undefined
4741 * @see [Demo](https://naver.github.io/billboard.js/demo/#Grid.GridLines)
4742 * @see [Demo: X Grid Lines](https://naver.github.io/billboard.js/demo/#Grid.OptionalXGridLines)
4743 * @see [Demo: Y Grid Lines](https://naver.github.io/billboard.js/demo/#Grid.OptionalYGridLines)
4744 * @example
4745 * grid: {
4746 * x: {
4747 * show: true,
4748 * lines: [
4749 * {value: 2, text: "Label on 2"},
4750 * {value: 5, text: "Label on 5", class: "label-5"}
4751 * {value: 6, text: "Label on 6", position: "start"}
4752 * ]
4753 * },
4754 * y: {
4755 * show: true,
4756 * lines: [
4757 * {value: 100, text: "Label on 100"},
4758 * {value: 200, text: "Label on 200", class: "label-200"}
4759 * {value: 300, text: "Label on 300", position: 'middle'}
4760 * ],
4761 * ticks: 5
4762 * },
4763 * front: true,
4764 * focus: {
4765 * show: false
4766 * },
4767 * lines: {
4768 * front: false
4769 * }
4770 * }
4771 */
4772 grid_x_show: !1,
4773 grid_x_type: "tick",
4774 grid_x_lines: [],
4775 grid_y_show: !1,
4776 grid_y_lines: [],
4777 grid_y_ticks: 10,
4778 grid_focus_show: !0,
4779 grid_front: !1,
4780 grid_lines_front: !0,
4781
4782 /**
4783 * Set point options
4784 * @name point
4785 * @memberof Options
4786 * @type {Object}
4787 * @property {Boolean} [point.show=true] Whether to show each point in line.
4788 * @property {Number|Function} [point.r=2.5] The radius size of each point.<br>
4789 * - **NOTE:** Disabled for 'bubble' type
4790 * @property {Boolean} [point.focus.expand.enabled=true] Whether to expand each point on focus.
4791 * @property {Boolean} [point.focus.expand.r=point.r*1.75] The radius size of each point on focus.<br>
4792 * - **NOTE:** For 'bubble' type, the default is `bubbleSize*1.15`
4793 * @property {Number} [point.select.r=point.r*4] The radius size of each point on selected.
4794 * @property {String} [point.type="circle"] The type of point to be drawn<br>
4795 * - **NOTE:**
4796 * - If chart has 'bubble' type, only circle can be used.
4797 * - For IE, non circle point expansions are not supported due to lack of transform support.
4798 * - **Available Values:**
4799 * - circle
4800 * - rectangle
4801 * @property {Array} [point.pattern=[]] The type of point or svg shape as string, to be drawn for each line<br>
4802 * - **NOTE:**
4803 * - This is an `experimental` feature and can have some unexpected behaviors.
4804 * - If chart has 'bubble' type, only circle can be used.
4805 * - For IE, non circle point expansions are not supported due to lack of transform support.
4806 * - **Available Values:**
4807 * - circle
4808 * - rectangle
4809 * - svg shape tag interpreted as string<br>
4810 * (ex. `<polygon points='2.5 0 0 5 5 5'></polygon>`)
4811 * @see [Demo: point type](https://naver.github.io/billboard.js/demo/#Point.RectanglePoints)
4812 * @example
4813 * point: {
4814 * show: false,
4815 * r: 5,
4816 *
4817 * // or customize the radius
4818 * r: function(d) {
4819 * ...
4820 * return r;
4821 * },
4822 *
4823 * focus: {
4824 * expand: {
4825 * enabled: true,
4826 * r: 1
4827 * }
4828 * },
4829 * select: {
4830 * r: 3
4831 * },
4832 *
4833 * // valid values are "circle" or "rectangle"
4834 * type: "rectangle",
4835 *
4836 * // or indicate as pattern
4837 * pattern: [
4838 * "circle",
4839 * "rectangle",
4840 * "<polygon points='0 6 4 0 -4 0'></polygon>"
4841 * ],
4842 * }
4843 */
4844 point_show: !0,
4845 point_r: 2.5,
4846 point_sensitivity: 10,
4847 point_focus_expand_enabled: !0,
4848 point_focus_expand_r: undefined,
4849 point_pattern: [],
4850 point_select_r: undefined,
4851 point_type: "circle",
4852
4853 /**
4854 * Set line options
4855 * @name line
4856 * @memberof Options
4857 * @type {Object}
4858 * @property {Boolean} [line.connectNull=false] Set if null data point will be connected or not.<br>
4859 * If true set, the region of null data will be connected without any data point. If false set, the region of null data will not be connected and get empty.
4860 * @property {Array} [line.classes=undefined] If set, used to set a css class on each line.
4861 * @property {Boolean} [line.step.type=step] Change step type for step chart.<br>
4862 * **Available values:**
4863 * - step
4864 * - step-before
4865 * - step-after
4866 * @property {Boolean|Array} [line.point=true] Set to false to not draw points on linecharts. Or pass an array of line ids to draw points for.
4867 * @example
4868 * line: {
4869 * connectNull: true,
4870 * classes: [
4871 * "line-class1",
4872 * "line-class2"
4873 * ],
4874 * step: {
4875 * type: "step-after"
4876 * },
4877 *
4878 * // hide all data points ('point.show=false' also has similar effect)
4879 * point: false,
4880 *
4881 * // show data points for only indicated datas
4882 * point: [
4883 * "data1", "data3"
4884 * ]
4885 * }
4886 */
4887 line_connectNull: !1,
4888 line_step_type: "step",
4889 line_classes: undefined,
4890 line_point: !0,
4891
4892 /**
4893 * Set bar options
4894 * @name bar
4895 * @memberof Options
4896 * @type {Object}
4897 * @property {Number} [bar.padding=0] The padding pixel value between each bar.
4898 * @property {Number} [bar.radius] Set the radius of bar edge in pixel.<br>- **NOTE:** Only for non-stacking bars.
4899 * @property {Number} [bar.radius.ratio] Set the radius ratio of bar edge in relative the bar's width.
4900 * @property {Number} [bar.width] Change the width of bar chart.
4901 * @property {Number} [bar.width.ratio=0.6] Change the width of bar chart by ratio.
4902 * @property {Number} [bar.width.max] The maximum width value for ratio.
4903 * @property {Boolean} [bar.zerobased=true] Set if min or max value will be 0 on bar chart.
4904 * @see [Demo: bar padding](https://naver.github.io/billboard.js/demo/#BarChartOptions.BarPadding)
4905 * @see [Demo: bar radius](https://naver.github.io/billboard.js/demo/#BarChartOptions.BarRadius)
4906 * @see [Demo: bar width](https://naver.github.io/billboard.js/demo/#BarChartOptions.BarWidth)
4907 * @example
4908 * bar: {
4909 * padding: 1,
4910 *
4911 * // the 'radius' option can be used only for non-stacking bars
4912 * radius: 10,
4913 * // or
4914 * radius: {
4915 * ratio: 0.5
4916 * }
4917 *
4918 * width: 10,
4919 * // or
4920 * width: {
4921 * ratio: 0.2,
4922 * max: 20
4923 * },
4924 *
4925 * zerobased: false
4926 * }
4927 */
4928 bar_padding: 0,
4929 bar_radius: undefined,
4930 bar_radius_ratio: undefined,
4931 bar_width: undefined,
4932 bar_width_ratio: .6,
4933 bar_width_max: undefined,
4934 bar_zerobased: !0,
4935
4936 /**
4937 * Set bubble options
4938 * @name bubble
4939 * @memberof Options
4940 * @type {Object}
4941 * @property {Number|Function} [bubble.maxR=35] Set the max bubble radius value
4942 * @example
4943 * bubble: {
4944 * // ex) If 100 is the highest value among data bound, the representation bubble of 100 will have radius of 50.
4945 * // And the lesser will have radius relatively from tha max value.
4946 * maxR: 50,
4947 *
4948 * // or set radius callback
4949 * maxR: function(d) {
4950 * // ex. of d param - {x: Fri Oct 06 2017 00:00:00 GMT+0900, value: 80, id: "data2", index: 5}
4951 * ...
4952 * return Math.sqrt(d.value * 2);
4953 * }
4954 * }
4955 */
4956 bubble_maxR: 35,
4957
4958 /**
4959 * Set area options
4960 * @name area
4961 * @memberof Options
4962 * @type {Object}
4963 * @property {Boolean} [area.zerobased=true] Set if min or max value will be 0 on area chart.
4964 * @property {Boolean} [area.above=false]
4965 * @example
4966 * area: {
4967 * zerobased: false,
4968 * above: true
4969 * }
4970 */
4971 area_zerobased: !0,
4972 area_above: !1,
4973
4974 /**
4975 * Set pie options
4976 * @name pie
4977 * @memberof Options
4978 * @type {Object}
4979 * @property {Boolean} [pie.label.show=true] Show or hide label on each pie piece.
4980 * @property {Function} [pie.label.format] Set formatter for the label on each pie piece.
4981 * @property {Number} [pie.label.threshold=0.05] Set threshold to show/hide labels.
4982 * @property {Number|Function} [pie.label.ratio=undefined] Set ratio of labels position.
4983 * @property {Boolean|Object} [pie.expand=true] Enable or disable expanding pie pieces.
4984 * @property {Number} [pie.expand.duration=50] Set expand transition time in ms.
4985 * @property {Number} [pie.innerRadius=0] Sets the inner radius of pie arc.
4986 * @property {Number} [pie.padAngle=0] Set padding between data.
4987 * @property {Number} [pie.padding=0] Sets the gap between pie arcs.
4988 * @example
4989 * pie: {
4990 * label: {
4991 * show: false,
4992 * format: function(value, ratio, id) {
4993 * return d3.format("$")(value);
4994 * },
4995 * threshold: 0.1,
4996 *
4997 * // set ratio callback. Should return ratio value
4998 * ratio: function(d, radius, h) {
4999 * ...
5000 * return ratio;
5001 * },
5002 * // or set ratio number
5003 * ratio: 0.5
5004 * },
5005 *
5006 * // disable expand transition for interaction
5007 * expand: false,
5008 *
5009 * // set duration of expand transition to 500ms.
5010 * expand: {
5011 * duration: 500
5012 * },
5013 *
5014 * innerRadius: 0,
5015 * padAngle: 0.1,
5016 * padding: 0
5017 * }
5018 */
5019 pie_label_show: !0,
5020 pie_label_format: undefined,
5021 pie_label_threshold: .05,
5022 pie_label_ratio: undefined,
5023 pie_expand: {},
5024 pie_expand_duration: 50,
5025 pie_innerRadius: 0,
5026 pie_padAngle: 0,
5027 pie_padding: 0,
5028
5029 /**
5030 * Set gauge options
5031 * @name gauge
5032 * @memberof Options
5033 * @type {Object}
5034 * @property {Boolean} [gauge.fullCircle=false] Show full circle as donut. When set to 'true', the max label will not be showed due to start and end points are same location.
5035 * @property {Boolean} [gauge.label.show=true] Show or hide label on gauge.
5036 * @property {Function} [gauge.label.format] Set formatter for the label on gauge. Label text can be multilined with `\n` character.
5037 * @property {Function} [gauge.label.extents] Set customized min/max label text.
5038 * @property {Boolean} [gauge.expand=true] Enable or disable expanding gauge.
5039 * @property {Number} [gauge.expand.duration=50] Set the expand transition time in milliseconds.
5040 * @property {Number} [gauge.min=0] Set min value of the gauge.
5041 * @property {Number} [gauge.max=100] Set max value of the gauge.
5042 * @property {Number} [gauge.startingAngle=-1 * Math.PI / 2]
5043 * @property {String} [gauge.units] Set units of the gauge.
5044 * @property {Number} [gauge.width] Set width of gauge chart.
5045 * @example
5046 * gauge: {
5047 * fullCircle: false,
5048 * label: {
5049 * show: false,
5050 * format: function(value, ratio) {
5051 * return value;
5052 *
5053 * // to multiline, return with '\n' character
5054 * // return value +"%\nLine1\n2Line2";
5055 * },
5056 * extents: function(value, isMax) {
5057 * return (isMax ? "Max:" : "Min:") + value;
5058 * }
5059 * },
5060 * expand: false,
5061 *
5062 * // or set duration
5063 * expand: {
5064 * duration: 20
5065 * },
5066 * min: -100,
5067 * max: 200,
5068 * units: "%",
5069 * width: 10
5070 * }
5071 */
5072 gauge_fullCircle: !1,
5073 gauge_label_show: !0,
5074 gauge_label_format: undefined,
5075 gauge_min: 0,
5076 gauge_max: 100,
5077 gauge_startingAngle: -1 * Math.PI / 2,
5078 gauge_label_extents: undefined,
5079 gauge_units: undefined,
5080 gauge_width: undefined,
5081 gauge_expand: {},
5082 gauge_expand_duration: 50,
5083
5084 /**
5085 * Set donut options
5086 * @name donut
5087 * @memberof Options
5088 * @type {Object}
5089 * @property {Boolean} [donut.label.show=true] Show or hide label on each donut piece.
5090 * @property {Function} [donut.label.format] Set formatter for the label on each donut piece.
5091 * @property {Number} [donut.label.threshold=0.05] Set threshold to show/hide labels.
5092 * @property {Number|Function} [donut.label.ratio=undefined] Set ratio of labels position.
5093 * @property {Boolean} [donut.expand=true] Enable or disable expanding donut pieces.
5094 * @property {Number} [donut.width] Set width of donut chart.
5095 * @property {String} [donut.title=""] Set title of donut chart. Use `\n` character to enter line break.
5096 * @property {Number} [donut.padAngle=0] Set padding between data.
5097 * @example
5098 * donut: {
5099 * label: {
5100 * show: false,
5101 * format: function(value, ratio, id) {
5102 * return d3.format("$")(value);
5103 * },
5104 * threshold: 0.1,
5105 *
5106 * // set ratio callback. Should return ratio value
5107 * ratio: function(d, radius, h) {
5108 * ...
5109 * return ratio;
5110 * },
5111 * // or set ratio number
5112 * ratio: 0.5
5113 * },
5114 * expand: false,
5115 * width: 10,
5116 * padAngle: 0.2,
5117 * title: "Donut Title"
5118 *
5119 * // title with line break
5120 * title: "Title1\nTitle2"
5121 * }
5122 */
5123 donut_label_show: !0,
5124 donut_label_format: undefined,
5125 donut_label_threshold: .05,
5126 donut_label_ratio: undefined,
5127 donut_width: undefined,
5128 donut_title: "",
5129 donut_expand: {},
5130 donut_expand_duration: 50,
5131 donut_padAngle: 0,
5132
5133 /**
5134 * Set spline options
5135 * - **Available interpolation type values:**
5136 * - basis (d3.curveBasis)
5137 * - basis-closed (d3.curveBasisClosed)
5138 * - basis-open (d3.curveBasisOpen)
5139 * - bundle (d3.curveBundle)
5140 * - cardinal (d3.curveCardinal)
5141 * - cardinal-closed (d3.curveCardinalClosed)
5142 * - cardinal-open (d3.curveCardinalOpen)
5143 * - catmull-rom (d3.curveCatmullRom)
5144 * - catmull-rom-closed (d3.curveCatmullRomClosed)
5145 * - catmull-rom-open (d3.curveCatmullRomOpen)
5146 * - monotone-x (d3.curveMonotoneX)
5147 * - monotone-y (d3.curveMonotoneY)
5148 * - natural (d3.curveNatural)
5149 * - linear-closed (d3.curveLinearClosed)
5150 * - linear (d3.curveLinear)
5151 * - step (d3.curveStep)
5152 * - step-after (d3.curveStepAfter)
5153 * - step-before (d3.curveStepBefore)
5154 * @name spline
5155 * @memberof Options
5156 * @type {Object}
5157 * @property {String} [spline.interpolation.type="cardinal"]
5158 * @see [Interpolation (d3 v4)](http://bl.ocks.org/emmasaunders/c25a147970def2b02d8c7c2719dc7502)
5159 * @example
5160 * spline: {
5161 * interpolation: {
5162 * type: "cardinal"
5163 * }
5164 * }
5165 */
5166 spline_interpolation_type: "cardinal",
5167
5168 /**
5169 * Set radar options
5170 * @name radar
5171 * @memberof Options
5172 * @type {Object}
5173 * @property {Number} [radar.axis.max=undefined] The max value of axis. If not given, it'll take the max value from the given data.
5174 * @property {Boolean} [radar.axis.line.show=true] Show or hide axis line.
5175 * @property {Boolean} [radar.axis.text.show=true] Show or hide axis text.
5176 * @property {Boolean} [radar.direction.clockwise=false] Set the direction to be drawn.
5177 * @property {Number} [radar.level.depth=3] Set the level depth.
5178 * @property {Boolean} [radar.level.show=true] Show or hide level.
5179 * @property {Function} [radar.level.text.format=(x) => (x % 1 === 0 ? x : x.toFixed(2))] Set format function for the level value.
5180 * @property {Boolean} [radar.level.text.show=true] Show or hide level text.
5181 * @property {Number} [radar.size.ratio=0.87] Set size ratio.
5182 * @see [Demo](https://naver.github.io/billboard.js/demo/#Chart.RadarChart)
5183 * @see [Demo: radar axis](https://naver.github.io/billboard.js/demo/#RadarChartOptions.RadarAxis)
5184 * @see [Demo: radar level](https://naver.github.io/billboard.js/demo/#RadarChartOptions.RadarLevel)
5185 * @see [Demo: radar size](https://naver.github.io/billboard.js/demo/#RadarChartOptions.RadarSize)
5186 * @example
5187 * radar: {
5188 * axis: {
5189 * max: 50,
5190 * line: {
5191 * show: false
5192 * },
5193 * text: {
5194 * show: false
5195 * }
5196 * },
5197 * direction: {
5198 * clockwise: true
5199 * },
5200 * level: {
5201 * show: false,
5202 * text: {
5203 * format: function(x) {
5204 * return x + "%";
5205 * },
5206 * show: true
5207 * }
5208 * },
5209 * size: {
5210 * ratio: 0.7
5211 * }
5212 * }
5213 */
5214 radar_axis_max: undefined,
5215 radar_axis_line_show: !0,
5216 radar_axis_text_show: !0,
5217 radar_level_depth: 3,
5218 radar_level_show: !0,
5219 radar_level_text_format: function radar_level_text_format(x) {
5220 return x % 1 === 0 ? x : x.toFixed(2);
5221 },
5222 radar_level_text_show: !0,
5223 radar_size_ratio: .87,
5224 radar_direction_clockwise: !1,
5225
5226 /**
5227 * Show rectangles inside the chart.<br><br>
5228 * This option accepts array including object that has axis, start, end and class. The keys start, end and class are optional.
5229 * axis must be x, y or y2. start and end should be the value where regions start and end. If not specified, the edge values will be used. If timeseries x axis, date string, Date object and unixtime integer can be used. If class is set, the region element will have it as class.
5230 * @name regions
5231 * @memberof Options
5232 * @type {Array}
5233 * @default []
5234 * @example
5235 * regions: [
5236 * {
5237 * axis: "x",
5238 * start: 1,
5239 * end: 4,
5240 * class: "region-1-4"
5241 * }
5242 * ]
5243 */
5244 regions: [],
5245
5246 /**
5247 * Tooltip options
5248 * @name tooltip
5249 * @memberof Options
5250 * @type {Object}
5251 * @property {Boolean} [tooltip.show=true] Show or hide tooltip.<br>
5252 * @property {Boolean} [tooltip.grouped=true] Set if tooltip is grouped or not for the data points.
5253 * - **NOTE:** The overlapped data points will be displayed as grouped even if set false.
5254 * @property {Boolean} [tooltip.linked=false] Set if tooltips on all visible charts with like x points are shown together when one is shown.
5255 * @property {String} [tooltip.linked.name=""] Groping name for linked tooltip.<br>If specified, linked tooltip will be groped interacting to be worked only with the same name.
5256 * @property {Function} [tooltip.format.title] Set format for the title of tooltip.<br>
5257 * Specified function receives x of the data point to show.
5258 * @property {Function} [tooltip.format.name] Set format for the name of each data in tooltip.<br>
5259 * Specified function receives name, ratio, id and index of the data point to show. ratio will be undefined if the chart is not donut/pie/gauge.
5260 * @property {Function} [tooltip.format.value] Set format for the value of each data in tooltip.<br>
5261 * Specified function receives name, ratio, id and index of the data point to show. ratio will be undefined if the chart is not donut/pie/gauge.
5262 * If undefined returned, the row of that value will be skipped.
5263 * @property {Function} [tooltip.position] Set custom position for the tooltip.<br>
5264 * This option can be used to modify the tooltip position by returning object that has top and left.
5265 * @property {Function} [tooltip.contents] Set custom HTML for the tooltip.<br>
5266 * Specified function receives data, defaultTitleFormat, defaultValueFormat and color of the data point to show. If tooltip.grouped is true, data includes multiple data points.
5267 * @property {Boolean} [tooltip.init.show=false] Show tooltip at the initialization.
5268 * @property {Number} [tooltip.init.x=0] Set x Axis index to be shown at the initialization.
5269 * @property {Object} [tooltip.init.position={top: "0px",left: "50px"}] Set the position of tooltip at the initialization.
5270 * @property {Function} [tooltip.onshow] Set a callback that will be invoked before the tooltip is shown.
5271 * @property {Function} [tooltip.onhide] Set a callback that will be invoked before the tooltip is hidden.
5272 * @property {Function} [tooltip.onshown] Set a callback that will be invoked after the tooltip is shown
5273 * @property {Function} [tooltip.onhidden] Set a callback that will be invoked after the tooltip is hidden.
5274 * @property {String|Function|null} [tooltip.order=null] Set tooltip data display order.<br><br>
5275 * **Available Values:**
5276 * - `desc`: In descending data value order
5277 * - `asc`: In ascending data value order
5278 * - `null`: It keeps the data display order<br>
5279 * **NOTE:** When `data.groups` is set, the order will follow as the stacked graph order.<br>
5280 * If want to order as data bound, set any value rather than asc, desc or null. (ex. empty string "")
5281 * - `function(data1, data2) { ... }`: [Array.sort compareFunction](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#Parameters)
5282 * @example
5283 * tooltip: {
5284 * show: true,
5285 * grouped: false,
5286 * format: {
5287 * title: function(x) { return "Data " + x; },
5288 * name: function(name, ratio, id, index) { return name; },
5289 * value: function(value, ratio, id, index) { return ratio; }
5290 * },
5291 * position: function(data, width, height, element) {
5292 * return {top: 0, left: 0}
5293 * },
5294 * contents: function(d, defaultTitleFormat, defaultValueFormat, color) {
5295 * return ... // formatted html as you want
5296 * },
5297 *
5298 * // sort tooltip data value display in ascending order
5299 * order: "asc",
5300 *
5301 * // specifying sort function
5302 * order: function(a, b) {
5303 * // param data passed format
5304 * {x: 5, value: 250, id: "data1", index: 5, name: "data1"}
5305 * ...
5306 * },
5307 *
5308 * // show at the initialization
5309 * init: {
5310 * show: true,
5311 * x: 2,
5312 * position: {
5313 * top: "150px",
5314 * left: "250px"
5315 * }
5316 * },
5317 *
5318 * // fires prior tooltip is shown
5319 * onshow: function() { ...},
5320 * // fires prior tooltip is hidden
5321 * onhide: function() { ... },
5322 * // fires after tooltip is shown
5323 * onshown: function() { ... },
5324 * // fires after tooltip is hidden
5325 * onhidden: function() { ... },
5326 *
5327 * // Link any tooltips when multiple charts are on the screen where same x coordinates are available
5328 * // Useful for timeseries correlation
5329 * linked: true,
5330 *
5331 * // Specify name to interact those with the same name only.
5332 * linked: {
5333 * name: "some-group"
5334 * }
5335 * }
5336 */
5337 tooltip_show: !0,
5338 tooltip_grouped: !0,
5339 tooltip_format_title: undefined,
5340 tooltip_format_name: undefined,
5341 tooltip_format_value: undefined,
5342 tooltip_position: undefined,
5343 tooltip_contents: function tooltip_contents(d, defaultTitleFormat, defaultValueFormat, color) {
5344 return this.getTooltipContent ? this.getTooltipContent(d, defaultTitleFormat, defaultValueFormat, color) : "";
5345 },
5346 tooltip_init_show: !1,
5347 tooltip_init_x: 0,
5348 tooltip_init_position: {
5349 top: "0px",
5350 left: "50px"
5351 },
5352 tooltip_linked: !1,
5353 tooltip_linked_name: "",
5354 tooltip_onshow: function tooltip_onshow() {},
5355 tooltip_onhide: function tooltip_onhide() {},
5356 tooltip_onshown: function tooltip_onshown() {},
5357 tooltip_onhidden: function tooltip_onhidden() {},
5358 tooltip_order: null,
5359
5360 /**
5361 * Set title options
5362 * @name title
5363 * @memberof Options
5364 * @type {Object}
5365 * @property {String} [title.text]
5366 * @property {Number} [title.padding.top=0]
5367 * @property {Number} [title.padding.right=0]
5368 * @property {Number} [title.padding.bottom=0]
5369 * @property {Number} [title.padding.left=0]
5370 * @property {String} [title.position=top-center]
5371 * @example
5372 * title: {
5373 * text: "Title Text",
5374 * padding: {
5375 * top: 10,
5376 * right: 10,
5377 * bottom: 10,
5378 * left: 10
5379 * },
5380 * position: "top-center"
5381 * }
5382 */
5383 title_text: undefined,
5384 title_padding: {
5385 top: 0,
5386 right: 0,
5387 bottom: 0,
5388 left: 0
5389 },
5390 title_position: "top-center"
5391 };
5392};
5393
5394
5395// CONCATENATED MODULE: ./src/config/config.js
5396/**
5397 * Copyright (c) 2017 ~ present NAVER Corp.
5398 * billboard.js project is licensed under the MIT license
5399 */
5400
5401
5402
5403extend(ChartInternal_ChartInternal.prototype, {
5404 getOptions: function getOptions() {
5405 return new Options_Options();
5406 },
5407
5408 /**
5409 * Load configuration option
5410 * @param {Object} config User's generation config value
5411 * @private
5412 */
5413 loadConfig: function loadConfig(config) {
5414 var target,
5415 keys,
5416 read,
5417 thisConfig = this.config,
5418 find = function () {
5419 var key = keys.shift();
5420 return key && target && isObjectType(target) && key in target ? (target = target[key], find()) : key ? undefined : target;
5421 };
5422
5423 Object.keys(thisConfig).forEach(function (key) {
5424 target = config, keys = key.split("_"), read = find(), isDefined(read) && (thisConfig[key] = read);
5425 });
5426 }
5427});
5428// CONCATENATED MODULE: ./src/internals/scale.js
5429/**
5430 * Copyright (c) 2017 ~ present NAVER Corp.
5431 * billboard.js project is licensed under the MIT license
5432 */
5433
5434
5435
5436extend(ChartInternal_ChartInternal.prototype, {
5437 getScale: function getScale(min, max, forTimeseries) {
5438 return (forTimeseries ? Object(external_commonjs_d3_scale_commonjs2_d3_scale_amd_d3_scale_root_d3_["scaleTime"])() : Object(external_commonjs_d3_scale_commonjs2_d3_scale_amd_d3_scale_root_d3_["scaleLinear"])()).range([min, max]);
5439 },
5440
5441 /**
5442 * Get x Axis scale function
5443 * @param {Number} min
5444 * @param {Number} max
5445 * @param {Number} domain
5446 * @param {Function} offset The offset getter to be sum
5447 * @return {Function} scale
5448 * @private
5449 */
5450 getX: function getX(min, max, domain, offset) {
5451 var $$ = this,
5452 scale = $$.zoomScale || $$.getScale(min, max, $$.isTimeSeries());
5453 return $$.getCustomizedScale(domain ? scale.domain(domain) : scale, offset);
5454 },
5455
5456 /**
5457 * Get y Axis scale function
5458 * @param {Number} min
5459 * @param {Number} max
5460 * @param {Number} domain
5461 * @return {Function} scale
5462 * @private
5463 */
5464 getY: function getY(min, max, domain) {
5465 var scale = this.getScale(min, max, this.isTimeSeriesY());
5466 return domain && scale.domain(domain), scale;
5467 },
5468
5469 /**
5470 * Get customized scale
5471 * @param {d3.scaleLinear|d3.scaleTime} scaleValue
5472 * @param {Function} offsetValue Offset getter to be sum
5473 * @return {} scale
5474 * @private
5475 */
5476 getCustomizedScale: function getCustomizedScale(scaleValue, offsetValue) {
5477 var $$ = this,
5478 offset = offsetValue || function () {
5479 return $$.xAxis.tickOffset();
5480 },
5481 scale = function (d, raw) {
5482 var v = scaleValue(d) + offset();
5483 return raw ? v : Math.ceil(v);
5484 };
5485
5486 // copy original scale methods
5487 for (var key in scaleValue) scale[key] = scaleValue[key];
5488
5489 return scale.orgDomain = function () {
5490 return scaleValue.domain();
5491 }, scale.orgScale = function () {
5492 return scaleValue;
5493 }, $$.isCategorized() && (scale.domain = function (domainValue) {
5494 var domain = domainValue;
5495 return arguments.length ? (scaleValue.domain(domain), scale) : (domain = this.orgDomain(), [domain[0], domain[1] + 1]);
5496 }), scale;
5497 },
5498 getYScale: function getYScale(id) {
5499 return this.axis.getId(id) === "y2" ? this.y2 : this.y;
5500 },
5501 getSubYScale: function getSubYScale(id) {
5502 return this.axis.getId(id) === "y2" ? this.subY2 : this.subY;
5503 },
5504
5505 /**
5506 * Update scale
5507 * @private
5508 * @param {Boolean} withoutTransitionAtInit - param is given at the init rendering
5509 */
5510 updateScales: function updateScales(withoutTransitionAtInit) {
5511 var $$ = this,
5512 config = $$.config,
5513 isRotated = config.axis_rotated,
5514 isInit = !$$.x;
5515 // update edges
5516 // update scales
5517 // update axes
5518 // update for arc
5519 $$.xMin = isRotated ? 1 : 0, $$.xMax = isRotated ? $$.height : $$.width, $$.yMin = isRotated ? 0 : $$.height, $$.yMax = isRotated ? $$.width : 1, $$.subXMin = $$.xMin, $$.subXMax = $$.xMax, $$.subYMin = isRotated ? 0 : $$.height2, $$.subYMax = isRotated ? $$.width2 : 1, $$.x = $$.getX($$.xMin, $$.xMax, isInit ? undefined : $$.x.orgDomain(), function () {
5520 return $$.xAxis.tickOffset();
5521 }), $$.y = $$.getY($$.yMin, $$.yMax, isInit ? config.axis_y_default : $$.y.domain()), $$.y2 = $$.getY($$.yMin, $$.yMax, isInit ? config.axis_y2_default : $$.y2.domain()), $$.subX = $$.getX($$.xMin, $$.xMax, $$.orgXDomain, function (d) {
5522 return d % 1 ? 0 : $$.subXAxis.tickOffset();
5523 }), $$.subY = $$.getY($$.subYMin, $$.subYMax, isInit ? config.axis_y_default : $$.subY.domain()), $$.subY2 = $$.getY($$.subYMin, $$.subYMax, isInit ? config.axis_y2_default : $$.subY2.domain()), $$.xAxisTickFormat = $$.axis.getXAxisTickFormat(), $$.xAxisTickValues = $$.axis.getXAxisTickValues(), $$.yAxisTickValues = $$.axis.getYAxisTickValues(), $$.y2AxisTickValues = $$.axis.getY2AxisTickValues(), $$.xAxis = $$.axis.getXAxis("x", $$.x, $$.xOrient, $$.xAxisTickFormat, $$.xAxisTickValues, config.axis_x_tick_outer, withoutTransitionAtInit), $$.subXAxis = $$.axis.getXAxis("subx", $$.subX, $$.subXOrient, $$.xAxisTickFormat, $$.xAxisTickValues, config.axis_x_tick_outer), $$.yAxis = $$.axis.getYAxis("y", $$.y, $$.yOrient, config.axis_y_tick_format, $$.yAxisTickValues, config.axis_y_tick_outer), $$.y2Axis = $$.axis.getYAxis("y2", $$.y2, $$.y2Orient, config.axis_y2_tick_format, $$.y2AxisTickValues, config.axis_y2_tick_outer), $$.updateArc && $$.updateArc();
5524 }
5525});
5526// CONCATENATED MODULE: ./src/internals/domain.js
5527/**
5528 * Copyright (c) 2017 ~ present NAVER Corp.
5529 * billboard.js project is licensed under the MIT license
5530 */
5531 // selection
5532
5533
5534
5535extend(ChartInternal_ChartInternal.prototype, {
5536 getYDomainMinMax: function getYDomainMinMax(targets, type) {
5537 var $$ = this,
5538 config = $$.config,
5539 isMin = type === "min",
5540 dataGroups = config.data_groups,
5541 ids = $$.mapToIds(targets),
5542 f = isMin ? external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["min"] : external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["max"],
5543 ys = $$.getValuesAsIdKeyed(targets);
5544 return dataGroups.length > 0 && function () {
5545 for (var idsInGroup, _ret, hasValue = $$["has".concat(isMin ? "Negative" : "Positive", "ValueInTargets")](targets), _loop = function (j, _idsInGroup) {
5546 if (_idsInGroup = _idsInGroup.filter(function (v) {
5547 return ids.indexOf(v) >= 0;
5548 }), _idsInGroup.length === 0) return idsInGroup = _idsInGroup, "continue";
5549 var baseId = _idsInGroup[0],
5550 baseAxisId = $$.axis.getId(baseId);
5551 hasValue && ys[baseId] && (ys[baseId] = ys[baseId].map(function (v) {
5552 return (isMin ? v < 0 : v > 0) ? v : 0;
5553 }));
5554
5555 for (var id, _ret2, _loop2 = function (k, id) {
5556 if (!ys[id]) return "continue";
5557 var axisId = $$.axis.getId(id);
5558 ys[id].forEach(function (v, i) {
5559 var val = +v,
5560 meetCondition = isMin ? val > 0 : val < 0;
5561 axisId !== baseAxisId || hasValue && meetCondition || (ys[baseId][i] += val);
5562 });
5563 }, k = 1; id = _idsInGroup[k]; k++) _ret2 = _loop2(k, id), _ret2 === "continue";
5564
5565 idsInGroup = _idsInGroup;
5566 }, j = 0; idsInGroup = dataGroups[j]; j++) _ret = _loop(j, idsInGroup), _ret === "continue";
5567 }(), f(Object.keys(ys).map(function (key) {
5568 return f(ys[key]);
5569 }));
5570 },
5571 getYDomainMin: function getYDomainMin(targets) {
5572 return this.getYDomainMinMax(targets, "min");
5573 },
5574 getYDomainMax: function getYDomainMax(targets) {
5575 return this.getYDomainMinMax(targets, "max");
5576 },
5577 getYDomain: function getYDomain(targets, axisId, xDomain) {
5578 var $$ = this,
5579 config = $$.config;
5580 if ($$.isStackNormalized()) return [0, 100];
5581 var lengths,
5582 targetsByAxisId = targets.filter(function (t) {
5583 return $$.axis.getId(t.id) === axisId;
5584 }),
5585 yTargets = xDomain ? $$.filterByXDomain(targetsByAxisId, xDomain) : targetsByAxisId,
5586 yMin = axisId === "y2" ? config.axis_y2_min : config.axis_y_min,
5587 yMax = axisId === "y2" ? config.axis_y2_max : config.axis_y_max,
5588 yDomainMin = $$.getYDomainMin(yTargets),
5589 yDomainMax = $$.getYDomainMax(yTargets),
5590 center = axisId === "y2" ? config.axis_y2_center : config.axis_y_center,
5591 isZeroBased = $$.hasType("bar", yTargets) && config.bar_zerobased || $$.hasType("area", yTargets) && config.area_zerobased,
5592 isInverted = axisId === "y2" ? config.axis_y2_inverted : config.axis_y_inverted,
5593 showHorizontalDataLabel = $$.hasDataLabel() && config.axis_rotated,
5594 showVerticalDataLabel = $$.hasDataLabel() && !config.axis_rotated;
5595 if (yDomainMin = isValue(yMin) ? yMin : isValue(yMax) ? yDomainMin < yMax ? yDomainMin : yMax - 10 : yDomainMin, yDomainMax = isValue(yMax) ? yMax : isValue(yMin) ? yMin < yDomainMax ? yDomainMax : yMin + 10 : yDomainMax, yTargets.length === 0) // use current domain if target of axisId is none
5596 return axisId === "y2" ? $$.y2.domain() : $$.y.domain();
5597 isNaN(yDomainMin) && (yDomainMin = 0), isNaN(yDomainMax) && (yDomainMax = yDomainMin), yDomainMin === yDomainMax && (yDomainMin < 0 ? yDomainMax = 0 : yDomainMin = 0);
5598 var isAllPositive = yDomainMin >= 0 && yDomainMax >= 0,
5599 isAllNegative = yDomainMin <= 0 && yDomainMax <= 0;
5600 (isValue(yMin) && isAllPositive || isValue(yMax) && isAllNegative) && (isZeroBased = !1), isZeroBased && (isAllPositive && (yDomainMin = 0), isAllNegative && (yDomainMax = 0));
5601 var domainLength = Math.abs(yDomainMax - yDomainMin),
5602 paddingTop = domainLength * .1,
5603 paddingBottom = domainLength * .1;
5604
5605 if (isDefined(center)) {
5606 var yDomainAbs = Math.max(Math.abs(yDomainMin), Math.abs(yDomainMax));
5607 yDomainMax = center + yDomainAbs, yDomainMin = center - yDomainAbs;
5608 } // add padding for data label
5609
5610
5611 if (showHorizontalDataLabel) {
5612 lengths = $$.getDataLabelLength(yDomainMin, yDomainMax, "width");
5613 var diff = diffDomain($$.y.range()),
5614 ratio = [lengths[0] / diff, lengths[1] / diff];
5615 paddingTop += domainLength * (ratio[1] / (1 - ratio[0] - ratio[1])), paddingBottom += domainLength * (ratio[0] / (1 - ratio[0] - ratio[1]));
5616 } else showVerticalDataLabel && (lengths = $$.getDataLabelLength(yDomainMin, yDomainMax, "height"), paddingTop += $$.axis.convertPixelsToAxisPadding(lengths[1], domainLength), paddingBottom += $$.axis.convertPixelsToAxisPadding(lengths[0], domainLength));
5617
5618 axisId === "y" && notEmpty(config.axis_y_padding) && (paddingTop = $$.axis.getPadding(config.axis_y_padding, "top", paddingTop, domainLength), paddingBottom = $$.axis.getPadding(config.axis_y_padding, "bottom", paddingBottom, domainLength)), axisId === "y2" && notEmpty(config.axis_y2_padding) && (paddingTop = $$.axis.getPadding(config.axis_y2_padding, "top", paddingTop, domainLength), paddingBottom = $$.axis.getPadding(config.axis_y2_padding, "bottom", paddingBottom, domainLength)), isZeroBased && (isAllPositive && (paddingBottom = yDomainMin), isAllNegative && (paddingTop = -yDomainMax));
5619 var domain = [yDomainMin - paddingBottom, yDomainMax + paddingTop];
5620 return isInverted ? domain.reverse() : domain;
5621 },
5622 getXDomainMinMax: function getXDomainMinMax(targets, type) {
5623 var $$ = this,
5624 value = $$.config["axis_x_".concat(type)],
5625 f = type === "min" ? external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["min"] : external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["max"];
5626 return isDefined(value) ? $$.isTimeSeries() ? $$.parseDate(value) : value : f(targets, function (t) {
5627 return f(t.values, function (v) {
5628 return v.x;
5629 });
5630 });
5631 },
5632 getXDomainMin: function getXDomainMin(targets) {
5633 return this.getXDomainMinMax(targets, "min");
5634 },
5635 getXDomainMax: function getXDomainMax(targets) {
5636 return this.getXDomainMinMax(targets, "max");
5637 },
5638 getXDomainPadding: function getXDomainPadding(domain) {
5639 var maxDataCount,
5640 padding,
5641 $$ = this,
5642 config = $$.config,
5643 diff = domain[1] - domain[0],
5644 xPadding = config.axis_x_padding;
5645 $$.isCategorized() ? padding = 0 : $$.hasType("bar") ? (maxDataCount = $$.getMaxDataCount(), padding = maxDataCount > 1 ? diff / (maxDataCount - 1) / 2 : .5) : padding = diff * .01;
5646 var left = padding,
5647 right = padding;
5648 return isObject(xPadding) && notEmpty(xPadding) ? (left = isValue(xPadding.left) ? xPadding.left : padding, right = isValue(xPadding.right) ? xPadding.right : padding) : isNumber(config.axis_x_padding) && (left = xPadding, right = xPadding), {
5649 left: left,
5650 right: right
5651 };
5652 },
5653 getXDomain: function getXDomain(targets) {
5654 var $$ = this,
5655 xDomain = [$$.getXDomainMin(targets), $$.getXDomainMax(targets)],
5656 firstX = xDomain[0],
5657 lastX = xDomain[1],
5658 padding = $$.getXDomainPadding(xDomain),
5659 min = 0,
5660 max = 0;
5661 return firstX - lastX !== 0 || $$.isCategorized() || ($$.isTimeSeries() ? (firstX = new Date(firstX.getTime() * .5), lastX = new Date(lastX.getTime() * 1.5)) : (firstX = firstX === 0 ? 1 : firstX * .5, lastX = lastX === 0 ? -1 : lastX * 1.5)), (firstX || firstX === 0) && (min = $$.isTimeSeries() ? new Date(firstX.getTime() - padding.left) : firstX - padding.left), (lastX || lastX === 0) && (max = $$.isTimeSeries() ? new Date(lastX.getTime() + padding.right) : lastX + padding.right), [min, max];
5662 },
5663 updateXDomain: function updateXDomain(targets, withUpdateXDomain, withUpdateOrgXDomain, withTrim, domain) {
5664 var $$ = this,
5665 config = $$.config,
5666 zoomEnabled = config.zoom_enabled;
5667
5668 if (withUpdateOrgXDomain && ($$.x.domain(domain || Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["extent"])($$.getXDomain(targets))), $$.orgXDomain = $$.x.domain(), zoomEnabled && $$.zoom.updateScaleExtent(), $$.subX.domain($$.x.domain()), $$.brush && $$.brush.scale($$.subX)), withUpdateXDomain) {
5669 var domainValue = domain || !$$.brush || brushEmpty($$) ? $$.orgXDomain : getBrushSelection($$).map($$.subX.invert);
5670 $$.x.domain(domainValue), zoomEnabled && $$.zoom.updateScaleExtent();
5671 } // Trim domain when too big by zoom mousemove event
5672
5673
5674 return withTrim && $$.x.domain($$.trimXDomain($$.x.orgDomain())), $$.x.domain();
5675 },
5676 trimXDomain: function trimXDomain(domain) {
5677 var zoomDomain = this.getZoomDomain(),
5678 min = zoomDomain[0],
5679 max = zoomDomain[1];
5680 return domain[0] <= min && (domain[1] = +domain[1] + (min - domain[0]), domain[0] = min), max <= domain[1] && (domain[0] = +domain[0] - (domain[1] - max), domain[1] = max), domain;
5681 }
5682});
5683// EXTERNAL MODULE: external {"commonjs":"d3-collection","commonjs2":"d3-collection","amd":"d3-collection","root":"d3"}
5684var external_commonjs_d3_collection_commonjs2_d3_collection_amd_d3_collection_root_d3_ = __webpack_require__(18);
5685
5686// CONCATENATED MODULE: ./src/data/data.js
5687
5688
5689/**
5690 * Copyright (c) 2017 ~ present NAVER Corp.
5691 * billboard.js project is licensed under the MIT license
5692 */
5693
5694
5695
5696
5697
5698extend(ChartInternal_ChartInternal.prototype, {
5699 isX: function isX(key) {
5700 var $$ = this,
5701 config = $$.config,
5702 dataKey = config.data_x && key === config.data_x,
5703 existValue = notEmpty(config.data_xs) && util_hasValue(config.data_xs, key);
5704 return dataKey || existValue;
5705 },
5706 isNotX: function isNotX(key) {
5707 return !this.isX(key);
5708 },
5709 isStackNormalized: function isStackNormalized() {
5710 var config = this.config;
5711 return config.data_stack_normalize && config.data_groups.length;
5712 },
5713 isGrouped: function isGrouped(id) {
5714 return this.config.data_groups.map(function (v) {
5715 return v.indexOf(id) >= 0;
5716 })[0];
5717 },
5718 getXKey: function getXKey(id) {
5719 var $$ = this,
5720 config = $$.config;
5721 return config.data_x ? config.data_x : notEmpty(config.data_xs) ? config.data_xs[id] : null;
5722 },
5723 getXValuesOfXKey: function getXValuesOfXKey(key, targets) {
5724 var xValues,
5725 $$ = this,
5726 ids = targets && notEmpty(targets) ? $$.mapToIds(targets) : [];
5727 return ids.forEach(function (id) {
5728 $$.getXKey(id) === key && (xValues = $$.data.xs[id]);
5729 }), xValues;
5730 },
5731
5732 /**
5733 * Get index number based on given x Axis value
5734 * @param {Date|Number|String} x x Axis to be compared
5735 * @param {Array} basedX x Axis list to be based on
5736 * @return {Number} index number
5737 * @private
5738 */
5739 getIndexByX: function getIndexByX(x, basedX) {
5740 var $$ = this;
5741 return basedX ? basedX.indexOf(isString(x) ? x : +x) : ($$.filterByX($$.data.targets, x)[0] || {
5742 index: null
5743 }).index;
5744 },
5745 getXValue: function getXValue(id, i) {
5746 var $$ = this;
5747 return id in $$.data.xs && $$.data.xs[id] && isValue($$.data.xs[id][i]) ? $$.data.xs[id][i] : i;
5748 },
5749 getOtherTargetXs: function getOtherTargetXs() {
5750 var $$ = this,
5751 idsForX = Object.keys($$.data.xs);
5752 return idsForX.length ? $$.data.xs[idsForX[0]] : null;
5753 },
5754 getOtherTargetX: function getOtherTargetX(index) {
5755 var xs = this.getOtherTargetXs();
5756 return xs && index < xs.length ? xs[index] : null;
5757 },
5758 addXs: function addXs(xs) {
5759 var $$ = this;
5760 Object.keys(xs).forEach(function (id) {
5761 $$.config.data_xs[id] = xs[id];
5762 });
5763 },
5764 hasMultipleX: function hasMultipleX(xs) {
5765 // https://github.com/d3/d3-collection
5766 return Object(external_commonjs_d3_collection_commonjs2_d3_collection_amd_d3_collection_root_d3_["set"])(Object.keys(xs).map(function (id) {
5767 return xs[id];
5768 })).size() > 1;
5769 },
5770 isMultipleX: function isMultipleX() {
5771 return notEmpty(this.config.data_xs) || !this.config.data_xSort || this.hasType("bubble") || this.hasType("scatter");
5772 },
5773 addName: function addName(data) {
5774 var name,
5775 $$ = this;
5776 return data && (name = $$.config.data_names[data.id], data.name = name === undefined ? data.id : name), data;
5777 },
5778 getAllValuesOnIndex: function getAllValuesOnIndex(index) {
5779 var $$ = this;
5780 return $$.filterTargetsToShow($$.data.targets).map(function (t) {
5781 return $$.addName($$.getValueOnIndex(t.values, index));
5782 });
5783 },
5784 getValueOnIndex: function getValueOnIndex(values, index) {
5785 var valueOnIndex = values.filter(function (v) {
5786 return v.index === index;
5787 });
5788 return valueOnIndex.length ? valueOnIndex[0] : null;
5789 },
5790 updateTargetX: function updateTargetX(targets, x) {
5791 var $$ = this;
5792 targets.forEach(function (t) {
5793 t.values.forEach(function (v, i) {
5794 v.x = $$.generateTargetX(x[i], t.id, i);
5795 }), $$.data.xs[t.id] = x;
5796 });
5797 },
5798 updateTargetXs: function updateTargetXs(targets, xs) {
5799 var $$ = this;
5800 targets.forEach(function (t) {
5801 xs[t.id] && $$.updateTargetX([t], xs[t.id]);
5802 });
5803 },
5804 generateTargetX: function generateTargetX(rawX, id, index) {
5805 var $$ = this,
5806 x = $$.isCategorized() ? index : rawX || index;
5807 return $$.isTimeSeries() ? x = rawX ? $$.parseDate(rawX) : $$.parseDate($$.getXValue(id, index)) : $$.isCustomX() && !$$.isCategorized() && (x = isValue(rawX) ? +rawX : $$.getXValue(id, index)), x;
5808 },
5809 cloneTarget: function cloneTarget(target) {
5810 return {
5811 id: target.id,
5812 id_org: target.id_org,
5813 values: target.values.map(function (d) {
5814 return {
5815 x: d.x,
5816 value: d.value,
5817 id: d.id
5818 };
5819 })
5820 };
5821 },
5822 updateXs: function updateXs() {
5823 var $$ = this;
5824 $$.data.targets.length && ($$.xs = [], $$.data.targets[0].values.forEach(function (v) {
5825 $$.xs[v.index] = v.x;
5826 }));
5827 },
5828 getPrevX: function getPrevX(i) {
5829 var x = this.xs[i - 1];
5830 return isDefined(x) ? x : null;
5831 },
5832 getNextX: function getNextX(i) {
5833 var x = this.xs[i + 1];
5834 return isDefined(x) ? x : null;
5835 },
5836
5837 /**
5838 * Get base value isAreaRangeType
5839 * @param data Data object
5840 * @return {Number}
5841 * @private
5842 */
5843 getBaseValue: function getBaseValue(data) {
5844 var $$ = this,
5845 value = data.value;
5846 return value && $$.isAreaRangeType(data) && (value = $$.getAreaRangeData(data, "mid")), value;
5847 },
5848
5849 /**
5850 * Get min/max value from the data
5851 * @private
5852 * @param {Array} data array data to be evaluated
5853 * @return {{min: {Number}, max: {Number}}}
5854 */
5855 getMinMaxValue: function getMinMaxValue(data) {
5856 var min,
5857 max,
5858 getBaseValue = this.getBaseValue.bind(this);
5859 return (data || this.data.targets.map(function (t) {
5860 return t.values;
5861 })).forEach(function (v) {
5862 min = Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["min"])([min, Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["min"])(v, getBaseValue)]), max = Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["max"])([max, Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["max"])(v, getBaseValue)]);
5863 }), {
5864 min: min,
5865 max: max
5866 };
5867 },
5868
5869 /**
5870 * Get the min/max data
5871 * @private
5872 * @return {{min: Array, max: Array}}
5873 */
5874 getMinMaxData: function getMinMaxData() {
5875 var $$ = this,
5876 cacheKey = "$minMaxData",
5877 minMaxData = $$.getCache(cacheKey);
5878
5879 if (!minMaxData) {
5880 var data = $$.data.targets.map(function (t) {
5881 return t.values;
5882 }),
5883 minMax = $$.getMinMaxValue(data),
5884 min = [],
5885 max = [];
5886 // update the cached data
5887 data.forEach(function (v) {
5888 var minData = $$.getFilteredDataByValue(v, minMax.min),
5889 maxData = $$.getFilteredDataByValue(v, minMax.max);
5890 minData.length && (min = min.concat(minData)), maxData.length && (max = max.concat(maxData));
5891 }), $$.addCache(cacheKey, minMaxData = {
5892 min: min,
5893 max: max
5894 });
5895 }
5896
5897 return minMaxData;
5898 },
5899
5900 /**
5901 * Get sum of data per index
5902 * @private
5903 * @return {Array}
5904 */
5905 getTotalPerIndex: function getTotalPerIndex() {
5906 var $$ = this,
5907 sum = $$.getCache("$totalPerIndex");
5908 return $$.isStackNormalized() && !sum && (sum = [], $$.data.targets.forEach(function (row) {
5909 row.values.forEach(function (v, i) {
5910 sum[i] || (sum[i] = 0), sum[i] += isNumber(v.value) ? v.value : 0;
5911 });
5912 })), sum;
5913 },
5914
5915 /**
5916 * Get total data sum
5917 * @private
5918 * @return {Number}
5919 */
5920 getTotalDataSum: function getTotalDataSum() {
5921 var $$ = this,
5922 cacheKey = "$totalDataSum",
5923 totalDataSum = $$.getCache(cacheKey);
5924
5925 if (!totalDataSum) {
5926 var total = 0;
5927 $$.data.targets.map(function (t) {
5928 return t.values;
5929 }).forEach(function (v) {
5930 total += Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["sum"])(v, function (t) {
5931 return t.value;
5932 });
5933 }), $$.addCache(cacheKey, totalDataSum = total);
5934 }
5935
5936 return totalDataSum;
5937 },
5938
5939 /**
5940 * Get filtered data by value
5941 * @param {Object} data
5942 * @param {Number} value
5943 * @return {Array} filtered array data
5944 * @private
5945 */
5946 getFilteredDataByValue: function getFilteredDataByValue(data, value) {
5947 var _this = this;
5948
5949 return data.filter(function (t) {
5950 return _this.getBaseValue(t) === value;
5951 });
5952 },
5953
5954 /**
5955 * Return the max length of the data
5956 * @return {Number} max data length
5957 * @private
5958 */
5959 getMaxDataCount: function getMaxDataCount() {
5960 return Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["max"])(this.data.targets, function (t) {
5961 return t.values.length;
5962 });
5963 },
5964 getMaxDataCountTarget: function getMaxDataCountTarget(targets) {
5965 var maxTarget,
5966 length = targets.length,
5967 max = 0;
5968 return length > 1 ? targets.forEach(function (t) {
5969 t.values.length > max && (maxTarget = t, max = t.values.length);
5970 }) : maxTarget = length ? targets[0] : null, maxTarget;
5971 },
5972 mapToIds: function mapToIds(targets) {
5973 return targets.map(function (d) {
5974 return d.id;
5975 });
5976 },
5977 mapToTargetIds: function mapToTargetIds(ids) {
5978 var $$ = this;
5979 return ids ? isArray(ids) ? ids.concat() : [ids] : $$.mapToIds($$.data.targets);
5980 },
5981 hasTarget: function hasTarget(targets, id) {
5982 var ids = this.mapToIds(targets);
5983
5984 for (var val, i = 0; val = ids[i]; i++) if (val === id) return !0;
5985
5986 return !1;
5987 },
5988 isTargetToShow: function isTargetToShow(targetId) {
5989 return this.hiddenTargetIds.indexOf(targetId) < 0;
5990 },
5991 isLegendToShow: function isLegendToShow(targetId) {
5992 return this.hiddenLegendIds.indexOf(targetId) < 0;
5993 },
5994 filterTargetsToShow: function filterTargetsToShow(targets) {
5995 var $$ = this;
5996 return targets.filter(function (t) {
5997 return $$.isTargetToShow(t.id);
5998 });
5999 },
6000 mapTargetsToUniqueXs: function mapTargetsToUniqueXs(targets) {
6001 var $$ = this,
6002 xs = Object(external_commonjs_d3_collection_commonjs2_d3_collection_amd_d3_collection_root_d3_["set"])(Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["merge"])(targets.map(function (t) {
6003 return t.values.map(function (v) {
6004 return +v.x;
6005 });
6006 }))).values();
6007 return xs = $$.isTimeSeries() ? xs.map(function (x) {
6008 return new Date(+x);
6009 }) : xs.map(function (x) {
6010 return +x;
6011 }), xs.sort(function (a, b) {
6012 return a < b ? -1 : a > b ? 1 : a >= b ? 0 : NaN;
6013 });
6014 },
6015 addHiddenTargetIds: function addHiddenTargetIds(targetIds) {
6016 this.hiddenTargetIds = this.hiddenTargetIds.concat(targetIds);
6017 },
6018 removeHiddenTargetIds: function removeHiddenTargetIds(targetIds) {
6019 this.hiddenTargetIds = this.hiddenTargetIds.filter(function (id) {
6020 return targetIds.indexOf(id) < 0;
6021 });
6022 },
6023 addHiddenLegendIds: function addHiddenLegendIds(targetIds) {
6024 this.hiddenLegendIds = this.hiddenLegendIds.concat(targetIds);
6025 },
6026 removeHiddenLegendIds: function removeHiddenLegendIds(targetIds) {
6027 this.hiddenLegendIds = this.hiddenLegendIds.filter(function (id) {
6028 return targetIds.indexOf(id) < 0;
6029 });
6030 },
6031 getValuesAsIdKeyed: function getValuesAsIdKeyed(targets) {
6032 var $$ = this,
6033 ys = {},
6034 isMultipleX = $$.isMultipleX(),
6035 xs = isMultipleX ? $$.mapTargetsToUniqueXs(targets).map(function (v) {
6036 return isString(v) ? v : +v;
6037 }) : null;
6038 return targets.forEach(function (t) {
6039 var data = [];
6040 t.values.forEach(function (v) {
6041 var value = v.value;
6042 isArray(value) ? data.push.apply(data, toConsumableArray_default()(value)) : isObject(value) && "high" in value ? data.push.apply(data, toConsumableArray_default()(Object.values(value))) : isMultipleX ? data[$$.getIndexByX(v.x, xs)] = value : data.push(value);
6043 }), ys[t.id] = data;
6044 }), ys;
6045 },
6046 checkValueInTargets: function checkValueInTargets(targets, checker) {
6047 var values,
6048 ids = Object.keys(targets);
6049
6050 for (var i = 0; i < ids.length; i++) {
6051 values = targets[ids[i]].values;
6052
6053 for (var j = 0; j < values.length; j++) if (checker(values[j].value)) return !0;
6054 }
6055
6056 return !1;
6057 },
6058 hasNegativeValueInTargets: function hasNegativeValueInTargets(targets) {
6059 return this.checkValueInTargets(targets, function (v) {
6060 return v < 0;
6061 });
6062 },
6063 hasPositiveValueInTargets: function hasPositiveValueInTargets(targets) {
6064 return this.checkValueInTargets(targets, function (v) {
6065 return v > 0;
6066 });
6067 },
6068 _checkOrder: function _checkOrder(type) {
6069 var config = this.config;
6070 return isString(config.data_order) && config.data_order.toLowerCase() === type;
6071 },
6072 isOrderDesc: function isOrderDesc() {
6073 return this._checkOrder("desc");
6074 },
6075 isOrderAsc: function isOrderAsc() {
6076 return this._checkOrder("asc");
6077 },
6078
6079 /**
6080 * Sort targets data
6081 * @param {Array} targetsValue
6082 * @return {Array}
6083 * @private
6084 */
6085 orderTargets: function orderTargets(targetsValue) {
6086 var $$ = this,
6087 config = $$.config,
6088 targets = toConsumableArray_default()(targetsValue),
6089 orderAsc = $$.isOrderAsc(),
6090 orderDesc = $$.isOrderDesc();
6091
6092 // TODO: accept name array for order
6093 return orderAsc || orderDesc ? targets.sort(function (t1, t2) {
6094 var reducer = function (p, c) {
6095 return p + Math.abs(c.value);
6096 },
6097 t1Sum = t1.values.reduce(reducer, 0),
6098 t2Sum = t2.values.reduce(reducer, 0);
6099
6100 return orderAsc ? t2Sum - t1Sum : t1Sum - t2Sum;
6101 }) : isFunction(config.data_order) && targets.sort(config.data_order), targets;
6102 },
6103 filterByX: function filterByX(targets, x) {
6104 return Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["merge"])(targets.map(function (t) {
6105 return t.values;
6106 })).filter(function (v) {
6107 return v.x - x === 0;
6108 });
6109 },
6110 filterRemoveNull: function filterRemoveNull(data) {
6111 var _this2 = this;
6112
6113 return data.filter(function (d) {
6114 return isValue(_this2.getBaseValue(d));
6115 });
6116 },
6117 filterByXDomain: function filterByXDomain(targets, xDomain) {
6118 return targets.map(function (t) {
6119 return {
6120 id: t.id,
6121 id_org: t.id_org,
6122 values: t.values.filter(function (v) {
6123 return xDomain[0] <= v.x && v.x <= xDomain[1];
6124 })
6125 };
6126 });
6127 },
6128 hasDataLabel: function hasDataLabel() {
6129 var dataLabels = this.config.data_labels;
6130 return isBoolean(dataLabels) && dataLabels || isObjectType(dataLabels) && notEmpty(dataLabels);
6131 },
6132 getDataLabelLength: function getDataLabelLength(min, max, key) {
6133 var $$ = this,
6134 lengths = [0, 0];
6135 return $$.selectChart.select("svg").selectAll(".dummy").data([min, max]).enter().append("text").text(function (d) {
6136 return $$.dataLabelFormat(d.id)(d);
6137 }).each(function (d, i) {
6138 lengths[i] = this.getBoundingClientRect()[key] * 1.3;
6139 }).remove(), lengths;
6140 },
6141 isNoneArc: function isNoneArc(d) {
6142 return this.hasTarget(this.data.targets, d.id);
6143 },
6144 isArc: function isArc(d) {
6145 return "data" in d && this.hasTarget(this.data.targets, d.data.id);
6146 },
6147 findSameXOfValues: function findSameXOfValues(values, index) {
6148 var i,
6149 targetX = values[index].x,
6150 sames = [];
6151
6152 for (i = index - 1; i >= 0 && !(targetX !== values[i].x); i--) sames.push(values[i]);
6153
6154 for (i = index; i < values.length && !(targetX !== values[i].x); i++) sames.push(values[i]);
6155
6156 return sames;
6157 },
6158 findClosestFromTargets: function findClosestFromTargets(targets, pos) {
6159 var $$ = this,
6160 candidates = targets.map(function (target) {
6161 return $$.findClosest(target.values, pos);
6162 });
6163 // map to array of closest points of each target
6164 // decide closest point and return
6165 return $$.findClosest(candidates, pos);
6166 },
6167 findClosest: function findClosest(values, pos) {
6168 var closest,
6169 $$ = this,
6170 minDist = $$.config.point_sensitivity;
6171 return values.filter(function (v) {
6172 return v && $$.isBarType(v.id);
6173 }).forEach(function (v) {
6174 var shape = $$.main.select(".".concat(config_classes.bars).concat($$.getTargetSelectorSuffix(v.id), " .").concat(config_classes.bar, "-").concat(v.index)).node();
6175 !closest && $$.isWithinBar(shape) && (closest = v);
6176 }), values.filter(function (v) {
6177 return v && !$$.isBarType(v.id);
6178 }).forEach(function (v) {
6179 var d = $$.dist(v, pos);
6180 d < minDist && (minDist = d, closest = v);
6181 }), closest;
6182 },
6183 dist: function dist(data, pos) {
6184 var $$ = this,
6185 isRotated = $$.config.axis_rotated,
6186 xIndex = isRotated ? 1 : 0,
6187 yIndex = isRotated ? 0 : 1,
6188 y = $$.circleY(data, data.index),
6189 x = $$.x(data.x);
6190 return Math.sqrt(Math.pow(x - pos[xIndex], 2) + Math.pow(y - pos[yIndex], 2));
6191 },
6192
6193 /**
6194 * Convert data for step type
6195 * @param {Array} values Object data values
6196 * @return {Array}
6197 * @private
6198 */
6199 convertValuesToStep: function convertValuesToStep(values) {
6200 var $$ = this,
6201 config = $$.config,
6202 isRotated = config.axis_rotated,
6203 stepType = config.line_step_type,
6204 isCategorized = $$.isCategorized(),
6205 converted = isArray(values) ? values.concat() : [values];
6206 if (!isRotated && !isCategorized) return values; // insert & append cloning first/last value to be fully rendered covering on each gap sides
6207
6208 var id = converted[0].id,
6209 x = converted[0].x - 1,
6210 value = converted[0].value; // insert
6211
6212 return isCategorized && converted.unshift({
6213 x: x,
6214 value: value,
6215 id: id
6216 }), stepType === "step-after" && converted.unshift({
6217 x: x - 1,
6218 value: value,
6219 id: id
6220 }), x = converted.length, value = converted[x - 1].value, isCategorized && converted.push({
6221 x: x,
6222 value: value,
6223 id: id
6224 }), stepType === "step-before" && converted.push({
6225 x: x + 1,
6226 value: value,
6227 id: id
6228 }), converted;
6229 },
6230 convertValuesToRange: function convertValuesToRange(values) {
6231 var converted = isArray(values) ? values.concat() : [values],
6232 ranges = [];
6233 return converted.forEach(function (range) {
6234 var x = range.x,
6235 id = range.id;
6236 ranges.push({
6237 x: x,
6238 id: id,
6239 value: range.value[0]
6240 }), ranges.push({
6241 x: x,
6242 id: id,
6243 value: range.value[2]
6244 });
6245 }), ranges;
6246 },
6247 updateDataAttributes: function updateDataAttributes(name, attrs) {
6248 var $$ = this,
6249 config = $$.config,
6250 current = config["data_".concat(name)];
6251 return isUndefined(attrs) ? current : (Object.keys(attrs).forEach(function (id) {
6252 current[id] = attrs[id];
6253 }), $$.redraw({
6254 withLegend: !0
6255 }), current);
6256 },
6257 getAreaRangeData: function getAreaRangeData(d, type) {
6258 var value = d.value;
6259
6260 if (isArray(value)) {
6261 var index = ["high", "mid", "low"].indexOf(type);
6262 return index === -1 ? null : value[index];
6263 }
6264
6265 return value[type];
6266 },
6267
6268 /**
6269 * Get ratio value
6270 * @param {String} type Ratio for given type
6271 * @param {Object} d Data value object
6272 * @param {Boolean} asPercent Convert the return as percent or not
6273 * @return {Number} Ratio value
6274 * @private
6275 */
6276 getRatio: function getRatio(type, d, asPercent) {
6277 var $$ = this,
6278 config = $$.config,
6279 api = $$.api,
6280 ratio = 0;
6281
6282 if (d && api.data.shown.call(api).length) {
6283 var dataValues = api.data.values.bind(api);
6284 if (ratio = d.ratio || d.value, type === "arc") {
6285 // if has padAngle set, calculate rate based on value
6286 if ($$.pie.padAngle()()) {
6287 var total = $$.getTotalDataSum();
6288 $$.hiddenTargetIds.length && (total -= Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["sum"])(dataValues($$.hiddenTargetIds))), ratio = d.value / total;
6289 } else ratio = (d.endAngle - d.startAngle) / (Math.PI * ($$.hasType("gauge") && !config.gauge_fullCircle ? 1 : 2));
6290 } else if (type === "index") {
6291 var _total = this.getTotalPerIndex();
6292
6293 if ($$.hiddenTargetIds.length) {
6294 var hiddenSum = dataValues($$.hiddenTargetIds, !1);
6295 hiddenSum.length && (hiddenSum = hiddenSum.reduce(function (acc, curr) {
6296 return acc.map(function (v, i) {
6297 return (isNumber(v) ? v : 0) + curr[i];
6298 });
6299 }), _total = _total.map(function (v, i) {
6300 return v - hiddenSum[i];
6301 }));
6302 }
6303
6304 d.ratio = isNumber(d.value) && _total && _total[d.index] > 0 ? d.value / _total[d.index] : 0, ratio = d.ratio;
6305 } else type === "radar" && (ratio = parseFloat(Math.max(d.value, 0)) / $$.maxValue * config.radar_size_ratio);
6306 }
6307
6308 return asPercent && ratio ? ratio * 100 : ratio;
6309 }
6310});
6311// EXTERNAL MODULE: external {"commonjs":"d3-dsv","commonjs2":"d3-dsv","amd":"d3-dsv","root":"d3"}
6312var external_commonjs_d3_dsv_commonjs2_d3_dsv_amd_d3_dsv_root_d3_ = __webpack_require__(19);
6313
6314// CONCATENATED MODULE: ./src/data/data.convert.js
6315/**
6316 * Copyright (c) 2017 ~ present NAVER Corp.
6317 * billboard.js project is licensed under the MIT license
6318 */
6319
6320
6321
6322
6323extend(ChartInternal_ChartInternal.prototype, {
6324 convertUrlToData: function convertUrlToData(url) {
6325 var _this = this,
6326 mimeType = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "csv",
6327 headers = arguments.length > 2 ? arguments[2] : undefined,
6328 keys = arguments.length > 3 ? arguments[3] : undefined,
6329 done = arguments.length > 4 ? arguments[4] : undefined,
6330 req = new XMLHttpRequest();
6331
6332 if (headers) for (var header, _arr = Object.keys(headers), _i = 0; _i < _arr.length; _i++) header = _arr[_i], req.setRequestHeader(header, headers[header]);
6333 req.open("GET", url), req.onreadystatechange = function () {
6334 if (req.readyState === 4) if (req.status === 200) {
6335 var response = req.responseText;
6336 response && done.call(_this, _this["convert".concat(capitalize(mimeType), "ToData")](mimeType === "json" ? JSON.parse(response) : response, keys));
6337 } else throw new Error("".concat(url, ": Something went wrong loading!"));
6338 }, req.send();
6339 },
6340 _convertCsvTsvToData: function _convertCsvTsvToData(parser, xsv) {
6341 var d,
6342 rows = parser.rows(xsv);
6343 return rows.length === 1 ? (d = [{}], rows[0].forEach(function (id) {
6344 d[0][id] = null;
6345 })) : d = parser.parse(xsv), d;
6346 },
6347 convertCsvToData: function convertCsvToData(xsv) {
6348 return this._convertCsvTsvToData({
6349 rows: external_commonjs_d3_dsv_commonjs2_d3_dsv_amd_d3_dsv_root_d3_["csvParseRows"],
6350 parse: external_commonjs_d3_dsv_commonjs2_d3_dsv_amd_d3_dsv_root_d3_["csvParse"]
6351 }, xsv);
6352 },
6353 convertTsvToData: function convertTsvToData(tsv) {
6354 return this._convertCsvTsvToData({
6355 rows: external_commonjs_d3_dsv_commonjs2_d3_dsv_amd_d3_dsv_root_d3_["tsvParseRows"],
6356 parse: external_commonjs_d3_dsv_commonjs2_d3_dsv_amd_d3_dsv_root_d3_["tsvParse"]
6357 }, tsv);
6358 },
6359 convertJsonToData: function convertJsonToData(json, keysParam) {
6360 var targetKeys,
6361 data,
6362 _this2 = this,
6363 config = this.config,
6364 newRows = [];
6365
6366 if (isArray(json)) {
6367 var keys = keysParam || config.data_keys;
6368 keys.x ? (targetKeys = keys.value.concat(keys.x), config.data_x = keys.x) : targetKeys = keys.value, newRows.push(targetKeys), json.forEach(function (o) {
6369 var newRow = [];
6370
6371 var _iteratorNormalCompletion = !0,
6372 _didIteratorError = !1,
6373 _iteratorError = undefined;
6374
6375 try {
6376 for (var _step, _iterator = targetKeys[Symbol.iterator](); !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = !0) {
6377 var key = _step.value,
6378 v = _this2.findValueInJson(o, key);
6379
6380 isUndefined(v) && (v = null), newRow.push(v);
6381 }
6382 } catch (err) {
6383 _didIteratorError = !0, _iteratorError = err;
6384 } finally {
6385 try {
6386 _iteratorNormalCompletion || _iterator.return == null || _iterator.return();
6387 } finally {
6388 if (_didIteratorError) throw _iteratorError;
6389 }
6390 }
6391
6392 newRows.push(newRow);
6393 }), data = this.convertRowsToData(newRows);
6394 } else Object.keys(json).forEach(function (key) {
6395 var tmp = json[key].concat();
6396 tmp.unshift(key), newRows.push(tmp);
6397 }), data = this.convertColumnsToData(newRows);
6398
6399 return data;
6400 },
6401 findValueInJson: function findValueInJson(object, path) {
6402 if (object[path] !== undefined) return object[path];
6403 var convertedPath = path.replace(/\[(\w+)\]/g, ".$1"),
6404 pathArray = convertedPath.replace(/^\./, "").split("."),
6405 target = object; // convert indexes to properties (replace [] with .)
6406
6407 var _iteratorNormalCompletion2 = !0,
6408 _didIteratorError2 = !1,
6409 _iteratorError2 = undefined;
6410
6411 try {
6412 for (var _step2, _iterator2 = pathArray[Symbol.iterator](); !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = !0) {
6413 var k = _step2.value;
6414 if (k in target) target = target[k];else {
6415 target = undefined;
6416 break;
6417 }
6418 }
6419 } catch (err) {
6420 _didIteratorError2 = !0, _iteratorError2 = err;
6421 } finally {
6422 try {
6423 _iteratorNormalCompletion2 || _iterator2.return == null || _iterator2.return();
6424 } finally {
6425 if (_didIteratorError2) throw _iteratorError2;
6426 }
6427 }
6428
6429 return target;
6430 },
6431 convertRowsToData: function convertRowsToData(rows) {
6432 var keys = rows[0],
6433 newRows = [];
6434
6435 for (var i = 1, len1 = rows.length; i < len1; i++) {
6436 var newRow = {};
6437
6438 for (var j = 0, len2 = rows[i].length; j < len2; j++) {
6439 if (isUndefined(rows[i][j])) throw new Error("Source data is missing a component at (".concat(i, ", ").concat(j, ")!"));
6440 newRow[keys[j]] = rows[i][j];
6441 }
6442
6443 newRows.push(newRow);
6444 }
6445
6446 return newRows;
6447 },
6448 convertColumnsToData: function convertColumnsToData(columns) {
6449 var newRows = [];
6450
6451 for (var i = 0, len1 = columns.length; i < len1; i++) {
6452 var key = columns[i][0];
6453
6454 for (var j = 1, len2 = columns[i].length; j < len2; j++) {
6455 if (isUndefined(newRows[j - 1]) && (newRows[j - 1] = {}), isUndefined(columns[i][j])) throw new Error("Source data is missing a component at (".concat(i, ", ").concat(j, ")!"));
6456 newRows[j - 1][key] = columns[i][j];
6457 }
6458 }
6459
6460 return newRows;
6461 },
6462 convertDataToTargets: function convertDataToTargets(data, appendXs) {
6463 var xsData,
6464 _this3 = this,
6465 $$ = this,
6466 config = $$.config,
6467 ids = Object(external_commonjs_d3_collection_commonjs2_d3_collection_amd_d3_collection_root_d3_["keys"])(data[0]).filter($$.isNotX, $$),
6468 xs = Object(external_commonjs_d3_collection_commonjs2_d3_collection_amd_d3_collection_root_d3_["keys"])(data[0]).filter($$.isX, $$);
6469
6470 ids.forEach(function (id) {
6471 var xKey = _this3.getXKey(id);
6472
6473 _this3.isCustomX() || _this3.isTimeSeries() ? xs.indexOf(xKey) >= 0 ? xsData = (appendXs && $$.data.xs[id] || []).concat(data.map(function (d) {
6474 return d[xKey];
6475 }).filter(isValue).map(function (rawX, i) {
6476 return $$.generateTargetX(rawX, id, i);
6477 })) : config.data_x ? xsData = _this3.getOtherTargetXs() : notEmpty(config.data_xs) && (xsData = $$.getXValuesOfXKey(xKey, $$.data.targets)) : xsData = data.map(function (d, i) {
6478 return i;
6479 }), xsData && (_this3.data.xs[id] = xsData);
6480 }), ids.forEach(function (id) {
6481 if (!xsData) throw new Error("x is not defined for id = \"".concat(id, "\"."));
6482 });
6483 // convert to target
6484 var targets = ids.map(function (id, index) {
6485 var convertedId = config.data_idConverter(id),
6486 xKey = $$.getXKey(id),
6487 isCategorized = $$.isCustomX() && $$.isCategorized(),
6488 hasCategory = isCategorized && data.map(function (v) {
6489 return v.x;
6490 }).every(function (v) {
6491 return config.axis_x_categories.indexOf(v) > -1;
6492 });
6493 return {
6494 id: convertedId,
6495 id_org: id,
6496 values: data.map(function (d, i) {
6497 var x,
6498 rawX = d[xKey],
6499 value = d[id];
6500 return value = value === null || isNaN(value) ? isArray(value) || isObject(value) && value.high ? value : null : +d[id], isCategorized && index === 0 && !isUndefined(rawX) ? (!hasCategory && index === 0 && i === 0 && (config.axis_x_categories = []), x = config.axis_x_categories.indexOf(rawX), x === -1 && (x = config.axis_x_categories.length, config.axis_x_categories.push(rawX))) : x = $$.generateTargetX(rawX, id, i), (isUndefined(d[id]) || $$.data.xs[id].length <= i) && (x = undefined), {
6501 x: x,
6502 value: value,
6503 id: convertedId
6504 };
6505 }).filter(function (v) {
6506 return isDefined(v.x);
6507 })
6508 };
6509 }); // finish targets
6510
6511 return targets.forEach(function (t) {
6512 config.data_xSort && (t.values = t.values.sort(function (v1, v2) {
6513 var x1 = v1.x || v1.x === 0 ? v1.x : Infinity,
6514 x2 = v2.x || v2.x === 0 ? v2.x : Infinity;
6515 return x1 - x2;
6516 })), t.values.forEach(function (v, i) {
6517 var index = $$.data.targets ? $$.getIndexByX(v.x) : null;
6518 v.index = index === null ? i : index;
6519 }), $$.data.xs[t.id].sort(function (v1, v2) {
6520 return v1 - v2;
6521 });
6522 }), $$.hasNegativeValue = $$.hasNegativeValueInTargets(targets), $$.hasPositiveValue = $$.hasPositiveValueInTargets(targets), config.data_type && $$.setTargetType($$.mapToIds(targets).filter(function (id) {
6523 return !(id in config.data_types);
6524 }), config.data_type), targets.forEach(function (d) {
6525 return $$.addCache(d.id_org, d, !0);
6526 }), targets;
6527 }
6528});
6529// CONCATENATED MODULE: ./src/data/data.load.js
6530/**
6531 * Copyright (c) 2017 ~ present NAVER Corp.
6532 * billboard.js project is licensed under the MIT license
6533 */
6534
6535
6536
6537extend(ChartInternal_ChartInternal.prototype, {
6538 load: function load(rawTargets, args) {
6539 var $$ = this,
6540 targets = rawTargets;
6541 // Set targets
6542 // Redraw with new targets
6543 targets && (args.filter && (targets = targets.filter(args.filter)), (args.type || args.types) && targets.forEach(function (t) {
6544 var type = args.types && args.types[t.id] || args.type;
6545 $$.setTargetType(t.id, type);
6546 }), $$.data.targets.forEach(function (d) {
6547 for (var i = 0; i < targets.length; i++) if (d.id === targets[i].id) {
6548 d.values = targets[i].values, targets.splice(i, 1);
6549 break;
6550 }
6551 }), $$.data.targets = $$.data.targets.concat(targets)), $$.updateTargets($$.data.targets), $$.redraw({
6552 withUpdateOrgXDomain: !0,
6553 withUpdateXDomain: !0,
6554 withLegend: !0
6555 }), args.done && args.done();
6556 },
6557 loadFromArgs: function loadFromArgs(args) {
6558 var data,
6559 $$ = this;
6560 // reset internally cached data
6561 $$.resetCache(), args.data ? data = args.data : args.url ? $$.convertUrlToData(args.url, args.mimeType, args.headers, args.keys, function (d) {
6562 $$.load($$.convertDataToTargets(d), args);
6563 }) : args.json ? data = $$.convertJsonToData(args.json, args.keys) : args.rows ? data = $$.convertRowsToData(args.rows) : args.columns && (data = $$.convertColumnsToData(args.columns)), $$.load(data ? $$.convertDataToTargets(data) : null, args);
6564 },
6565 unload: function unload(rawTargetIds, customDoneCb) {
6566 var $$ = this,
6567 done = customDoneCb,
6568 targetIds = rawTargetIds;
6569 // If no target, call done and return
6570 return $$.resetCache(), done || (done = function () {}), targetIds = targetIds.filter(function (id) {
6571 return $$.hasTarget($$.data.targets, id);
6572 }), targetIds && targetIds.length !== 0 ? void ($$.svg.selectAll(targetIds.map(function (id) {
6573 return $$.selectorTarget(id);
6574 })).transition().style("opacity", "0").remove().call($$.endall, done), targetIds.forEach(function (id) {
6575 $$.withoutFadeIn[id] = !1, $$.legend && $$.legend.selectAll(".".concat(config_classes.legendItem).concat($$.getTargetSelectorSuffix(id))).remove(), $$.data.targets = $$.data.targets.filter(function (t) {
6576 return t.id !== id;
6577 });
6578 })) : void done();
6579 }
6580});
6581// CONCATENATED MODULE: ./src/internals/category.js
6582/**
6583 * Copyright (c) 2017 ~ present NAVER Corp.
6584 * billboard.js project is licensed under the MIT license
6585 */
6586
6587
6588extend(ChartInternal_ChartInternal.prototype, {
6589 /**
6590 * Category Name
6591 * @private
6592 * @param {Number} index
6593 * @returns {String} gategory Name
6594 */
6595 categoryName: function categoryName(i) {
6596 var config = this.config;
6597 return i < config.axis_x_categories.length ? config.axis_x_categories[i] : i;
6598 }
6599});
6600// EXTERNAL MODULE: external {"commonjs":"d3-drag","commonjs2":"d3-drag","amd":"d3-drag","root":"d3"}
6601var external_commonjs_d3_drag_commonjs2_d3_drag_amd_d3_drag_root_d3_ = __webpack_require__(20);
6602
6603// CONCATENATED MODULE: ./src/interactions/interaction.js
6604/**
6605 * Copyright (c) 2017 ~ present NAVER Corp.
6606 * billboard.js project is licensed under the MIT license
6607 */
6608
6609
6610
6611
6612
6613extend(ChartInternal_ChartInternal.prototype, {
6614 /**
6615 * Initialize the area that detects the event.
6616 * Add a container for the zone that detects the event.
6617 * @private
6618 */
6619 initEventRect: function initEventRect() {
6620 var $$ = this;
6621 $$.main.select(".".concat(config_classes.chart)).append("g").attr("class", config_classes.eventRects).style("fill-opacity", "0");
6622 },
6623
6624 /**
6625 * Redraws the area that detects the event.
6626 * @private
6627 */
6628 redrawEventRect: function redrawEventRect() {
6629 var eventRectUpdate,
6630 $$ = this,
6631 config = $$.config,
6632 zoomEnabled = config.zoom_enabled,
6633 isMultipleX = $$.isMultipleX(),
6634 eventRects = $$.main.select(".".concat(config_classes.eventRects)).style("cursor", zoomEnabled && (zoomEnabled === !0 || zoomEnabled.type === "wheel") ? config.axis_rotate ? "ns-resize" : "ew-resize" : null).classed(config_classes.eventRectsMultiple, isMultipleX).classed(config_classes.eventRectsSingle, !isMultipleX);
6635 if (eventRects.selectAll(".".concat(config_classes.eventRect)).remove(), $$.eventRect = eventRects.selectAll(".".concat(config_classes.eventRect)), isMultipleX) eventRectUpdate = $$.eventRect.data([0]), eventRectUpdate = $$.generateEventRectsForMultipleXs(eventRectUpdate.enter()).merge(eventRectUpdate);else {
6636 // Set data and update $$.eventRect
6637 var maxDataCountTarget = $$.getMaxDataCountTarget($$.data.targets);
6638 eventRects.datum(maxDataCountTarget ? maxDataCountTarget.values : []), $$.eventRect = eventRects.selectAll(".".concat(config_classes.eventRect)), eventRectUpdate = $$.eventRect.data(function (d) {
6639 return d;
6640 }), eventRectUpdate.exit().remove(), eventRectUpdate = $$.generateEventRectsForSingleX(eventRectUpdate.enter()).merge(eventRectUpdate);
6641 }
6642 $$.updateEventRect(eventRectUpdate), $$.inputType !== "touch" || $$.svg.on("touchstart.eventRect") || $$.hasArcType() || $$.bindTouchOnEventRect(isMultipleX);
6643 },
6644 bindTouchOnEventRect: function bindTouchOnEventRect(isMultipleX) {
6645 var startPx,
6646 $$ = this,
6647 config = $$.config,
6648 getEventRect = function () {
6649 var touch = external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["event"].changedTouches[0];
6650 return Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(document.elementFromPoint(touch.clientX, touch.clientY));
6651 },
6652 getIndex = function (eventRect) {
6653 var index = eventRect && eventRect.attr("class") && eventRect.attr("class").replace(new RegExp("(".concat(config_classes.eventRect, "-?|s)"), "g"), "") * 1;
6654 return (isNaN(index) || index === null) && (index = -1), index;
6655 },
6656 selectRect = function (context) {
6657 if (isMultipleX) $$.selectRectForMultipleXs(context);else {
6658 var eventRect = getEventRect(),
6659 index = getIndex(eventRect);
6660 $$.setOver(index), index === -1 ? $$.unselectRect() : $$.selectRectForSingle(context, eventRect, index);
6661 }
6662 },
6663 preventDefault = config.interaction_inputType_touch.preventDefault,
6664 isPrevented = isBoolean(preventDefault) && preventDefault || !1,
6665 preventThreshold = !isNaN(preventDefault) && preventDefault || null,
6666 preventEvent = function (event) {
6667 var eventType = event.type,
6668 touch = event.changedTouches[0],
6669 currentXY = touch["client".concat(config.axis_rotated ? "Y" : "X")];
6670 eventType === "touchstart" ? isPrevented ? event.preventDefault() : preventThreshold !== null && (startPx = currentXY) : eventType === "touchmove" && (isPrevented || startPx === !0 || preventThreshold !== null && Math.abs(startPx - currentXY) >= preventThreshold) && (startPx = !0, event.preventDefault());
6671 };
6672
6673 // bind touch events
6674 $$.svg.on("touchstart.eventRect touchmove.eventRect", function () {
6675 var eventRect = getEventRect();
6676
6677 if (!eventRect.empty() && eventRect.classed(config_classes.eventRect)) {
6678 if ($$.dragging || $$.flowing || $$.hasArcType()) return;
6679 preventEvent(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["event"]), selectRect(this);
6680 } else $$.unselectRect();
6681 }).on("touchend.eventRect", function () {
6682 var eventRect = getEventRect();
6683
6684 if (!eventRect.empty() && eventRect.classed(config_classes.eventRect)) {
6685 if ($$.hasArcType() || !$$.toggleShape || $$.cancelClick) return void ($$.cancelClick && ($$.cancelClick = !1)); // Call event handler
6686
6687 var index = getIndex(eventRect);
6688 isMultipleX || index === -1 || $$.main.selectAll(".".concat(config_classes.shape, "-").concat(index)).each(function (d2) {
6689 return config.data_onout.call($$.api, d2);
6690 });
6691 }
6692 });
6693 },
6694
6695 /**
6696 * Updates the location and size of the eventRect.
6697 * @private
6698 * @param {Object} d3.select(CLASS.eventRects) object.
6699 */
6700 updateEventRect: function updateEventRect(eventRectUpdate) {
6701 var x,
6702 y,
6703 w,
6704 h,
6705 $$ = this,
6706 config = $$.config,
6707 xScale = $$.zoomScale || $$.x,
6708 eventRectData = eventRectUpdate || $$.eventRect.data(),
6709 isRotated = config.axis_rotated;
6710 if ($$.isMultipleX()) // TODO: rotated not supported yet
6711 x = 0, y = 0, w = $$.width, h = $$.height;else {
6712 var rectW, rectX;
6713 if ($$.isCategorized()) rectW = $$.getEventRectWidth(), rectX = function (d) {
6714 return xScale(d.x) - rectW / 2;
6715 };else {
6716 $$.updateXs();
6717
6718 var getPrevNextX = function (d) {
6719 var index = d.index;
6720 return {
6721 prev: $$.getPrevX(index),
6722 next: $$.getNextX(index)
6723 };
6724 };
6725
6726 rectW = function (d) {
6727 var x = getPrevNextX(d); // if there this is a single data point make the eventRect full width (or height)
6728
6729 return x.prev === null && x.next === null ? isRotated ? $$.height : $$.width : (x.prev === null && (x.prev = xScale.domain()[0]), x.next === null && (x.next = xScale.domain()[1]), Math.max(0, (xScale(x.next) - xScale(x.prev)) / 2));
6730 }, rectX = function (d) {
6731 var x = getPrevNextX(d),
6732 thisX = $$.data.xs[d.id][d.index];
6733 // if there this is a single data point position the eventRect at 0
6734 return x.prev === null && x.next === null ? 0 : (x.prev === null && (x.prev = xScale.domain()[0]), (xScale(thisX) + xScale(x.prev)) / 2);
6735 };
6736 }
6737 x = isRotated ? 0 : rectX, y = isRotated ? rectX : 0, w = isRotated ? $$.width : rectW, h = isRotated ? rectW : $$.height;
6738 }
6739 eventRectData.attr("class", $$.classEvent.bind($$)).attr("x", x).attr("y", y).attr("width", w).attr("height", h);
6740 },
6741 selectRectForSingle: function selectRectForSingle(context, eventRect, index) {
6742 var $$ = this,
6743 config = $$.config,
6744 isSelectionEnabled = config.data_selection_enabled,
6745 isSelectionGrouped = config.data_selection_grouped,
6746 isTooltipGrouped = config.tooltip_grouped,
6747 selectedData = $$.getAllValuesOnIndex(index);
6748 isTooltipGrouped && ($$.showTooltip(selectedData, context), $$.showXGridFocus(selectedData), !isSelectionEnabled || isSelectionGrouped) || $$.main.selectAll(".".concat(config_classes.shape, "-").concat(index)).each(function () {
6749 Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this).classed(config_classes.EXPANDED, !0), isSelectionEnabled && eventRect.style("cursor", isSelectionGrouped ? "pointer" : null), isTooltipGrouped || ($$.hideXGridFocus(), $$.hideTooltip(), !isSelectionGrouped && $$.expandCirclesBars(index));
6750 }).filter(function (d) {
6751 return $$.isWithinShape(this, d);
6752 }).call(function (selected) {
6753 var d = selected.data();
6754 isSelectionEnabled && (isSelectionGrouped || config.data_selection_isselectable(d)) && eventRect.style("cursor", "pointer"), isTooltipGrouped || ($$.showTooltip(d, context), $$.showXGridFocus(d), $$.unexpandCircles(), selected.each(function (d) {
6755 return $$.expandCirclesBars(index, d.id);
6756 }));
6757 });
6758 },
6759 expandCirclesBars: function expandCirclesBars(index, id, reset) {
6760 var $$ = this,
6761 config = $$.config;
6762 config.point_focus_expand_enabled && $$.expandCircles(index, id, reset), $$.expandBars(index, id, reset);
6763 },
6764 selectRectForMultipleXs: function selectRectForMultipleXs(context) {
6765 var $$ = this,
6766 config = $$.config,
6767 targetsToShow = $$.filterTargetsToShow($$.data.targets);
6768
6769 // do nothing when dragging
6770 if (!($$.dragging || $$.hasArcType(targetsToShow))) {
6771 var mouse = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["mouse"])(context),
6772 closest = $$.findClosestFromTargets(targetsToShow, mouse);
6773 if ($$.mouseover && (!closest || closest.id !== $$.mouseover.id) && (config.data_onout.call($$.api, $$.mouseover), $$.mouseover = undefined), !closest) return void $$.unselectRect();
6774 var sameXData = $$.isBubbleType(closest) || $$.isScatterType(closest) || !config.tooltip_grouped ? [closest] : $$.filterByX(targetsToShow, closest.x),
6775 selectedData = sameXData.map(function (d) {
6776 return $$.addName(d);
6777 }); // show tooltip when cursor is close to some point
6778
6779 $$.showTooltip(selectedData, context), $$.expandCirclesBars(closest.index, closest.id, !0), $$.showXGridFocus(selectedData), ($$.isBarType(closest.id) || $$.dist(closest, mouse) < config.point_sensitivity) && ($$.svg.select(".".concat(config_classes.eventRect)).style("cursor", "pointer"), !$$.mouseover && (config.data_onover.call($$.api, closest), $$.mouseover = closest));
6780 }
6781 },
6782
6783 /**
6784 * Unselect EventRect.
6785 * @private
6786 */
6787 unselectRect: function unselectRect() {
6788 var $$ = this;
6789 $$.svg.select(".".concat(config_classes.eventRect)).style("cursor", null), $$.hideXGridFocus(), $$.hideTooltip(), $$._handleLinkedCharts(!1), $$.unexpandCircles(), $$.unexpandBars();
6790 },
6791 setOver: function setOver(index) {
6792 var $$ = this,
6793 config = $$.config;
6794 // Call event handler
6795 $$.expandCirclesBars(index, null, !0), index !== -1 && $$.main.selectAll(".".concat(config_classes.shape, "-").concat(index)).each(function (d2) {
6796 return config.data_onover.call($$.api, d2);
6797 });
6798 },
6799
6800 /**
6801 * Return draggable selection function
6802 * @return {Function}
6803 * @private
6804 */
6805 getDraggableSelection: function getDraggableSelection() {
6806 var $$ = this,
6807 config = $$.config;
6808 return config.interaction_enabled && config.data_selection_draggable && $$.drag ? Object(external_commonjs_d3_drag_commonjs2_d3_drag_amd_d3_drag_root_d3_["drag"])().on("drag", function () {
6809 $$.drag(Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["mouse"])(this));
6810 }).on("start", function () {
6811 $$.dragstart(Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["mouse"])(this));
6812 }).on("end", function () {
6813 $$.dragend();
6814 }) : function () {};
6815 },
6816
6817 /**
6818 * Create eventRect for each data on the x-axis.
6819 * Register touch and drag events.
6820 * @private
6821 * @param {Object} d3.select(CLASS.eventRects) object.
6822 * @returns {Object} d3.select(CLASS.eventRects) object.
6823 */
6824 generateEventRectsForSingleX: function generateEventRectsForSingleX(eventRectEnter) {
6825 var $$ = this,
6826 config = $$.config,
6827 rect = eventRectEnter.append("rect").attr("class", $$.classEvent.bind($$)).style("cursor", config.data_selection_enabled && config.data_selection_grouped ? "pointer" : null).on("click", function (d) {
6828 $$.clickHandlerForSingleX.bind(this)(d, $$);
6829 }).call($$.getDraggableSelection());
6830 return $$.inputType === "mouse" && rect.on("mouseover", function (d) {
6831 $$.dragging || $$.flowing || $$.hasArcType() || $$.setOver(d.index);
6832 }).on("mousemove", function (d) {
6833 // do nothing while dragging/flowing
6834 if (!($$.dragging || $$.flowing || $$.hasArcType())) {
6835 var index = d.index,
6836 eventRect = $$.svg.select(".".concat(config_classes.eventRect, "-").concat(index));
6837 $$.isStepType(d) && $$.config.line_step_type === "step-after" && Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["mouse"])(this)[0] < $$.x($$.getXValue(d.id, index)) && (index -= 1), index === -1 ? $$.unselectRect() : $$.selectRectForSingle(this, eventRect, index);
6838 }
6839 }).on("mouseout", function (d) {
6840 // chart is destroyed
6841 if ($$.config && !$$.hasArcType()) {
6842 var index = d.index;
6843 $$.unselectRect(), $$.main.selectAll(".".concat(config_classes.shape, "-").concat(index)).each(function (d2) {
6844 return config.data_onout.call($$.api, d2);
6845 });
6846 }
6847 }), rect;
6848 },
6849 clickHandlerForSingleX: function clickHandlerForSingleX(d, ctx) {
6850 var $$ = ctx,
6851 config = $$.config;
6852 if ($$.hasArcType() || !$$.toggleShape || $$.cancelClick) return void ($$.cancelClick && ($$.cancelClick = !1));
6853 var index = d.index;
6854 $$.main.selectAll(".".concat(config_classes.shape, "-").concat(index)).each(function (d2) {
6855 (config.data_selection_grouped || $$.isWithinShape(this, d2)) && ($$.toggleShape(this, d2, index), config.data_onclick.call($$.api, d2, this));
6856 });
6857 },
6858
6859 /**
6860 * Create an eventRect,
6861 * Register touch and drag events.
6862 * @private
6863 * @param {Object} d3.select(CLASS.eventRects) object.
6864 * @returns {Object} d3.select(CLASS.eventRects) object.
6865 */
6866 generateEventRectsForMultipleXs: function generateEventRectsForMultipleXs(eventRectEnter) {
6867 var $$ = this,
6868 rect = eventRectEnter.append("rect").attr("x", 0).attr("y", 0).attr("width", $$.width).attr("height", $$.height).attr("class", config_classes.eventRect).on("click", function () {
6869 $$.clickHandlerForMultipleXS.bind(this)($$);
6870 }).call($$.getDraggableSelection());
6871 return $$.inputType === "mouse" && rect.on("mouseover mousemove", function () {
6872 $$.selectRectForMultipleXs(this);
6873 }).on("mouseout", function () {
6874 !$$.config || $$.hasArcType() || $$.unselectRect();
6875 }), rect;
6876 },
6877 clickHandlerForMultipleXS: function clickHandlerForMultipleXS(ctx) {
6878 var $$ = ctx,
6879 config = $$.config,
6880 targetsToShow = $$.filterTargetsToShow($$.data.targets);
6881
6882 if (!$$.hasArcType(targetsToShow)) {
6883 var mouse = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["mouse"])(this),
6884 closest = $$.findClosestFromTargets(targetsToShow, mouse);
6885 !closest || ($$.isBarType(closest.id) || $$.dist(closest, mouse) < config.point_sensitivity) && $$.main.selectAll(".".concat(config_classes.shapes).concat($$.getTargetSelectorSuffix(closest.id))).selectAll(".".concat(config_classes.shape, "-").concat(closest.index)).each(function () {
6886 (config.data_selection_grouped || $$.isWithinShape(this, closest)) && ($$.toggleShape(this, closest, closest.index), config.data_onclick.call($$.api, closest, this));
6887 });
6888 } // select if selection enabled
6889
6890 },
6891
6892 /**
6893 * Dispatch a mouse event.
6894 * @private
6895 * @param {String} type event type
6896 * @param {Number} index Index of eventRect
6897 * @param {Array} mouse x and y coordinate value
6898 */
6899 dispatchEvent: function dispatchEvent(type, index, mouse) {
6900 var $$ = this,
6901 selector = ".".concat($$.isMultipleX() ? config_classes.eventRect : "".concat(config_classes.eventRect, "-").concat(index)),
6902 eventRect = $$.main.select(selector).node(),
6903 _eventRect$getBoundin = eventRect.getBoundingClientRect(),
6904 width = _eventRect$getBoundin.width,
6905 left = _eventRect$getBoundin.left,
6906 top = _eventRect$getBoundin.top,
6907 x = left + (mouse ? mouse[0] : 0) + width / 2,
6908 y = top + (mouse ? mouse[1] : 0);
6909
6910 emulateEvent[/^(mouse|click)/.test(type) ? "mouse" : "touch"](eventRect, type, {
6911 screenX: x,
6912 screenY: y,
6913 clientX: x,
6914 clientY: y
6915 });
6916 }
6917});
6918// CONCATENATED MODULE: ./src/internals/size.js
6919/**
6920 * Copyright (c) 2017 ~ present NAVER Corp.
6921 * billboard.js project is licensed under the MIT license
6922 */
6923
6924
6925
6926extend(ChartInternal_ChartInternal.prototype, {
6927 getCurrentWidth: function getCurrentWidth() {
6928 var $$ = this;
6929 return $$.config.size_width || $$.getParentWidth();
6930 },
6931 getCurrentHeight: function getCurrentHeight() {
6932 var $$ = this,
6933 config = $$.config,
6934 h = config.size_height || $$.getParentHeight();
6935 return h > 0 ? h : 320 / ($$.hasType("gauge") && !config.gauge_fullCircle ? 2 : 1);
6936 },
6937
6938 /**
6939 * Get Axis size according its position
6940 * @param {String} id Axis id value - x, y or y2
6941 * @return {number} size Axis size value
6942 * @private
6943 */
6944 getAxisSize: function getAxisSize(id) {
6945 var $$ = this,
6946 config = $$.config,
6947 isRotated = config.axis_rotated;
6948 return isRotated && id === "x" || !isRotated && /y2?/.test(id) ? $$.getAxisWidthByAxisId(id, !0) : $$.getHorizontalAxisHeight(id);
6949 },
6950 getCurrentPaddingTop: function getCurrentPaddingTop() {
6951 var $$ = this,
6952 config = $$.config,
6953 axesLen = config.axis_y2_axes.length,
6954 padding = isValue(config.padding_top) ? config.padding_top : 0;
6955 return $$.title && $$.title.node() && (padding += $$.getTitlePadding()), axesLen && config.axis_rotated && (padding += $$.getHorizontalAxisHeight("y2") * axesLen), padding;
6956 },
6957 getCurrentPaddingBottom: function getCurrentPaddingBottom() {
6958 var $$ = this,
6959 config = $$.config,
6960 isRotated = config.axis_rotated,
6961 axisId = isRotated ? "y" : "x",
6962 axesLen = config["axis_".concat(axisId, "_axes")].length,
6963 padding = isValue(config.padding_bottom) ? config.padding_bottom : 0;
6964 return padding + (axesLen ? $$.getHorizontalAxisHeight(axisId) * axesLen : 0);
6965 },
6966 getCurrentPaddingLeft: function getCurrentPaddingLeft(withoutRecompute) {
6967 var padding,
6968 $$ = this,
6969 config = $$.config,
6970 isRotated = config.axis_rotated,
6971 axisId = isRotated ? "x" : "y",
6972 axesLen = config["axis_".concat(axisId, "_axes")].length,
6973 axisWidth = $$.getAxisWidthByAxisId(axisId, withoutRecompute);
6974 return padding = isValue(config.padding_left) ? config.padding_left : isRotated ? config.axis_x_show ? Math.max(ceil10(axisWidth), 40) : 1 : !config.axis_y_show || config.axis_y_inner ? $$.axis.getYAxisLabelPosition().isOuter ? 30 : 1 : ceil10(axisWidth), padding + axisWidth * axesLen;
6975 },
6976 getCurrentPaddingRight: function getCurrentPaddingRight() {
6977 var padding,
6978 $$ = this,
6979 config = $$.config,
6980 legendWidthOnRight = $$.isLegendRight ? $$.getLegendWidth() + 20 : 0,
6981 axesLen = config.axis_y2_axes.length,
6982 axisWidth = $$.getAxisWidthByAxisId("y2");
6983 return padding = isValue(config.padding_right) ? config.padding_right + 1 : config.axis_rotated ? 10 + legendWidthOnRight : !config.axis_y2_show || config.axis_y2_inner ? 2 + legendWidthOnRight + ($$.axis.getY2AxisLabelPosition().isOuter ? 20 : 0) : ceil10(axisWidth) + legendWidthOnRight, padding + axisWidth * axesLen;
6984 },
6985
6986 /**
6987 * Get the parent rect element's size
6988 * @param {String} key property/attribute name
6989 * @private
6990 */
6991 getParentRectValue: function getParentRectValue(key) {
6992 for (var v, offsetName = "offset".concat(capitalize(key)), parent = this.selectChart.node(); !v && parent && parent.tagName !== "BODY";) {
6993 try {
6994 v = parent.getBoundingClientRect()[key];
6995 } catch (e) {
6996 offsetName in parent && (v = parent[offsetName]);
6997 }
6998
6999 parent = parent.parentNode;
7000 }
7001
7002 if (key === "width") {
7003 // Sometimes element's width value is incorrect(ex. flex container)
7004 // In this case, use body's offsetWidth instead.
7005 var bodyWidth = document.body.offsetWidth;
7006 v > bodyWidth && (v = bodyWidth);
7007 }
7008
7009 return v;
7010 },
7011 getParentWidth: function getParentWidth() {
7012 return this.getParentRectValue("width");
7013 },
7014 getParentHeight: function getParentHeight() {
7015 var h = this.selectChart.style("height");
7016 return h.indexOf("px") > 0 ? +h.replace("px", "") : 0;
7017 },
7018 getSvgLeft: function getSvgLeft(withoutRecompute) {
7019 var $$ = this,
7020 config = $$.config,
7021 hasLeftAxisRect = config.axis_rotated || !config.axis_rotated && !config.axis_y_inner,
7022 leftAxisClass = config.axis_rotated ? config_classes.axisX : config_classes.axisY,
7023 leftAxis = $$.main.select(".".concat(leftAxisClass)).node(),
7024 svgRect = leftAxis && hasLeftAxisRect ? leftAxis.getBoundingClientRect() : {
7025 right: 0
7026 },
7027 chartRect = $$.selectChart.node().getBoundingClientRect(),
7028 hasArc = $$.hasArcType(),
7029 svgLeft = svgRect.right - chartRect.left - (hasArc ? 0 : $$.getCurrentPaddingLeft(withoutRecompute));
7030 return svgLeft > 0 ? svgLeft : 0;
7031 },
7032 getAxisWidthByAxisId: function getAxisWidthByAxisId(id, withoutRecompute) {
7033 var $$ = this,
7034 position = $$.axis.getLabelPositionById(id);
7035 return $$.axis.getMaxTickWidth(id, withoutRecompute) + (position.isInner ? 20 : 40);
7036 },
7037 getHorizontalAxisHeight: function getHorizontalAxisHeight(axisId) {
7038 var $$ = this,
7039 config = $$.config,
7040 h = 30;
7041 return axisId !== "x" || config.axis_x_show ? axisId === "x" && config.axis_x_height ? config.axis_x_height : axisId !== "y" || config.axis_y_show ? axisId !== "y2" || config.axis_y2_show ? (axisId === "x" && !config.axis_rotated && config.axis_x_tick_rotate && (h = 30 + $$.axis.getMaxTickWidth(axisId) * Math.cos(Math.PI * (90 - config.axis_x_tick_rotate) / 180)), axisId === "y" && config.axis_rotated && config.axis_y_tick_rotate && (h = 30 + $$.axis.getMaxTickWidth(axisId) * Math.cos(Math.PI * (90 - config.axis_y_tick_rotate) / 180)), h + ($$.axis.getLabelPositionById(axisId).isInner ? 0 : 10) + (axisId !== "y2" || config.axis_rotated ? 0 : -10)) : $$.rotated_padding_top : !config.legend_show || $$.isLegendRight || $$.isLegendInset ? 1 : 10 : 8; // Calculate x axis height when tick rotated
7042 },
7043 getEventRectWidth: function getEventRectWidth() {
7044 return Math.max(0, this.xAxis.tickInterval());
7045 }
7046});
7047// EXTERNAL MODULE: external {"commonjs":"d3-shape","commonjs2":"d3-shape","amd":"d3-shape","root":"d3"}
7048var external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_ = __webpack_require__(21);
7049
7050// CONCATENATED MODULE: ./src/shape/shape.js
7051/**
7052 * Copyright (c) 2017 ~ present NAVER Corp.
7053 * billboard.js project is licensed under the MIT license
7054 */
7055
7056
7057
7058
7059
7060extend(ChartInternal_ChartInternal.prototype, {
7061 getShapeIndices: function getShapeIndices(typeFilter) {
7062 var $$ = this,
7063 config = $$.config,
7064 indices = {},
7065 i = 0;
7066 return $$.filterTargetsToShow($$.data.targets.filter(typeFilter, $$)).forEach(function (d) {
7067 for (var groups, j = 0; groups = config.data_groups[j]; j++) if (!(groups.indexOf(d.id) < 0)) for (var _row4, _k4 = 0; _row4 = groups[_k4]; _k4++) if (_row4 in indices) {
7068 indices[d.id] = indices[_row4];
7069 break;
7070 }
7071
7072 isUndefined(indices[d.id]) && (indices[d.id] = i++);
7073 }), indices.__max__ = i - 1, indices;
7074 },
7075 getShapeX: function getShapeX(offset, targetsNum, indices, isSub) {
7076 var $$ = this,
7077 scale = isSub ? $$.subX : $$.zoomScale || $$.x,
7078 barPadding = $$.config.bar_padding;
7079 return function (d) {
7080 var index = d.id in indices ? indices[d.id] : 0,
7081 x = d.x || d.x === 0 ? scale(d.x) - offset * (targetsNum / 2 - index) : 0;
7082 return offset && x && targetsNum > 1 && barPadding && (index && (x += barPadding * index), targetsNum > 2 ? x -= (targetsNum - 1) * barPadding / 2 : targetsNum === 2 && (x -= barPadding / 2)), x;
7083 };
7084 },
7085 getShapeY: function getShapeY(isSub) {
7086 var $$ = this,
7087 isStackNormalized = $$.isStackNormalized();
7088 return function (d) {
7089 return (isSub ? $$.getSubYScale(d.id) : $$.getYScale(d.id))(isStackNormalized ? $$.getRatio("index", d, !0) : d.value);
7090 };
7091 },
7092 getShapeOffset: function getShapeOffset(typeFilter, indices, isSub) {
7093 var $$ = this,
7094 targets = $$.orderTargets($$.filterTargetsToShow($$.data.targets.filter(typeFilter, $$))),
7095 targetIds = targets.map(function (t) {
7096 return t.id;
7097 });
7098 return function (d, idx) {
7099 var scale = isSub ? $$.getSubYScale(d.id) : $$.getYScale(d.id),
7100 y0 = scale(0),
7101 offset = y0,
7102 i = idx;
7103 return targets.forEach(function (t) {
7104 var rowValues = $$.isStepType(d) ? $$.convertValuesToStep(t.values) : t.values,
7105 values = rowValues.map(function (v) {
7106 return $$.isStackNormalized() ? $$.getRatio("index", v, !0) : v.value;
7107 });
7108 t.id === d.id || indices[t.id] !== indices[d.id] || targetIds.indexOf(t.id) < targetIds.indexOf(d.id) && ((isUndefined(rowValues[i]) || +rowValues[i].x !== +d.x) && (i = -1, rowValues.forEach(function (v, j) {
7109 var x1 = v.x.constructor === Date ? +v.x : v.x,
7110 x2 = d.x.constructor === Date ? +d.x : d.x;
7111 x1 === x2 && (i = j);
7112 })), i in rowValues && rowValues[i].value * d.value >= 0 && (offset += scale(values[i]) - y0));
7113 }), offset;
7114 };
7115 },
7116 isWithinShape: function isWithinShape(that, d) {
7117 var isWithin,
7118 $$ = this,
7119 shape = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(that);
7120 return $$.isTargetToShow(d.id) ? $$.hasValidPointType(that.nodeName) ? isWithin = $$.isStepType(d) ? $$.isWithinStep(that, $$.getYScale(d.id)(d.value)) : $$.isWithinCircle(that, $$.pointSelectR(d) * 1.5) : that.nodeName === "path" && (isWithin = !shape.classed(config_classes.bar) || $$.isWithinBar(that)) : isWithin = !1, isWithin;
7121 },
7122 getInterpolate: function getInterpolate(d) {
7123 var $$ = this,
7124 interpolation = $$.getInterpolateType(d);
7125 return {
7126 "basis": external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["curveBasis"],
7127 "basis-closed": external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["curveBasisClosed"],
7128 "basis-open": external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["curveBasisOpen"],
7129 "bundle": external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["curveBundle"],
7130 "cardinal": external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["curveCardinal"],
7131 "cardinal-closed": external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["curveCardinalClosed"],
7132 "cardinal-open": external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["curveCardinalOpen"],
7133 "catmull-rom": external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["curveCatmullRom"],
7134 "catmull-rom-closed": external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["curveCatmullRomClosed"],
7135 "catmull-rom-open": external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["curveCatmullRomOpen"],
7136 "monotone-x": external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["curveMonotoneX"],
7137 "monotone-y": external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["curveMonotoneY"],
7138 "natural": external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["curveNatural"],
7139 "linear-closed": external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["curveLinearClosed"],
7140 "linear": external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["curveLinear"],
7141 "step": external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["curveStep"],
7142 "step-after": external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["curveStepAfter"],
7143 "step-before": external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["curveStepBefore"]
7144 }[interpolation];
7145 },
7146 getInterpolateType: function getInterpolateType(d) {
7147 var $$ = this,
7148 type = $$.config.spline_interpolation_type,
7149 interpolation = $$.isInterpolationType(type) ? type : "cardinal";
7150 return $$.isSplineType(d) ? interpolation : $$.isStepType(d) ? $$.config.line_step_type : "linear";
7151 }
7152});
7153// EXTERNAL MODULE: external {"commonjs":"d3-interpolate","commonjs2":"d3-interpolate","amd":"d3-interpolate","root":"d3"}
7154var external_commonjs_d3_interpolate_commonjs2_d3_interpolate_amd_d3_interpolate_root_d3_ = __webpack_require__(22);
7155
7156// CONCATENATED MODULE: ./src/shape/arc.js
7157/**
7158 * Copyright (c) 2017 ~ present NAVER Corp.
7159 * billboard.js project is licensed under the MIT license
7160 */
7161
7162
7163
7164
7165
7166
7167extend(ChartInternal_ChartInternal.prototype, {
7168 initPie: function initPie() {
7169 var $$ = this,
7170 config = $$.config,
7171 padding = config.pie_padding,
7172 padAngle = $$.hasType("pie") && padding ? padding * .01 : config["".concat(config.data_type, "_padAngle")] ? config["".concat(config.data_type, "_padAngle")] : 0;
7173 $$.pie = Object(external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["pie"])().padAngle(padAngle).value(function (d) {
7174 return d.values.reduce(function (a, b) {
7175 return a + b.value;
7176 }, 0);
7177 }), config.data_order || $$.pie.sort(null);
7178 },
7179 updateRadius: function updateRadius() {
7180 var $$ = this,
7181 config = $$.config,
7182 radius = config.pie_innerRadius,
7183 padding = config.pie_padding,
7184 w = config.gauge_width || config.donut_width;
7185 $$.radiusExpanded = Math.min($$.arcWidth, $$.arcHeight) / 2, $$.radius = $$.radiusExpanded * .95, $$.innerRadiusRatio = w ? ($$.radius - w) / $$.radius : .6;
7186 var innerRadius = radius || (padding ? padding * ($$.innerRadiusRatio + .1) : 0);
7187 $$.innerRadius = $$.hasType("donut") || $$.hasType("gauge") ? $$.radius * $$.innerRadiusRatio : innerRadius;
7188 },
7189 updateArc: function updateArc() {
7190 var $$ = this;
7191 $$.svgArc = $$.getSvgArc(), $$.svgArcExpanded = $$.getSvgArcExpanded(), $$.svgArcExpandedSub = $$.getSvgArcExpanded(.98);
7192 },
7193 updateAngle: function updateAngle(dValue) {
7194 var gMin,
7195 gMax,
7196 gTic,
7197 gValue,
7198 $$ = this,
7199 config = $$.config,
7200 d = dValue,
7201 found = !1,
7202 index = 0;
7203 return config ? ($$.pie($$.filterTargetsToShow($$.data.targets)).forEach(function (t) {
7204 found || t.data.id !== d.data.id || (found = !0, d = t, d.index = index), index++;
7205 }), isNaN(d.startAngle) && (d.startAngle = 0), isNaN(d.endAngle) && (d.endAngle = d.startAngle), $$.isGaugeType(d.data) && (gMin = config.gauge_min, gMax = config.gauge_max, gTic = Math.PI * (config.gauge_fullCircle ? 2 : 1) / (gMax - gMin), gValue = d.value < gMin ? 0 : d.value < gMax ? d.value - gMin : gMax - gMin, d.startAngle = config.gauge_startingAngle, d.endAngle = d.startAngle + gTic * gValue), found ? d : null) : null;
7206 },
7207 getSvgArc: function getSvgArc() {
7208 var $$ = this,
7209 arc = Object(external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["arc"])().outerRadius($$.radius).innerRadius($$.innerRadius),
7210 newArc = function (d, withoutUpdate) {
7211 var path = "M 0 0";
7212
7213 if ("value" in d ? d.value > 0 : d.data) {
7214 var updated = !withoutUpdate && $$.updateAngle(d);
7215 withoutUpdate ? path = arc(d) : updated && (path = arc(updated));
7216 }
7217
7218 return path;
7219 };
7220
7221 return newArc.centroid = arc.centroid, newArc;
7222 },
7223 getSvgArcExpanded: function getSvgArcExpanded(rate) {
7224 var $$ = this,
7225 arc = Object(external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["arc"])().outerRadius($$.radiusExpanded * (rate || 1)).innerRadius($$.innerRadius);
7226 return function (d) {
7227 var updated = $$.updateAngle(d);
7228 return updated ? arc(updated) : "M 0 0";
7229 };
7230 },
7231 getArc: function getArc(d, withoutUpdate, force) {
7232 return force || this.isArcType(d.data) ? this.svgArc(d, withoutUpdate) : "M 0 0";
7233 },
7234 transformForArcLabel: function transformForArcLabel(d) {
7235 var $$ = this,
7236 config = $$.config,
7237 updated = $$.updateAngle(d),
7238 translate = "";
7239
7240 if (updated && !$$.hasType("gauge")) {
7241 var c = this.svgArc.centroid(updated),
7242 x = isNaN(c[0]) ? 0 : c[0],
7243 y = isNaN(c[1]) ? 0 : c[1],
7244 h = Math.sqrt(x * x + y * y),
7245 ratio = $$.hasType("donut") && config.donut_label_ratio || $$.hasType("pie") && config.pie_label_ratio;
7246 ratio = ratio ? isFunction(ratio) ? ratio(d, $$.radius, h) : ratio : $$.radius && (h ? (36 / $$.radius > .375 ? 1.175 - 36 / $$.radius : .8) * $$.radius / h : 0), translate = "translate(".concat(x * ratio, ",").concat(y * ratio, ")");
7247 }
7248
7249 return translate;
7250 },
7251 convertToArcData: function convertToArcData(d) {
7252 return this.addName({
7253 id: d.data.id,
7254 value: d.value,
7255 ratio: this.getRatio("arc", d),
7256 index: d.index
7257 });
7258 },
7259 textForArcLabel: function textForArcLabel(val) {
7260 var $$ = this,
7261 d = val.node ? val.datum() : val;
7262 if (!$$.shouldShowArcLabel()) return "";
7263 var updated = $$.updateAngle(d),
7264 value = updated ? updated.value : null,
7265 ratio = $$.getRatio("arc", updated),
7266 id = d.data.id;
7267 if (!$$.hasType("gauge") && !$$.meetsArcLabelThreshold(ratio)) return "";
7268 var text = ($$.getArcLabelFormat() || $$.defaultArcValueFormat)(value, ratio, id).toString();
7269 if (val.node) if (text.indexOf("\n") === -1) val.text(text);else {
7270 var multiline = text.split("\n"),
7271 len = multiline.length - 1;
7272 multiline.forEach(function (v, i) {
7273 val.append("tspan").attr("x", 0).attr("dy", "".concat(i === 0 ? -len : 1, "em")).text(v);
7274 });
7275 }
7276 return text;
7277 },
7278 textForGaugeMinMax: function textForGaugeMinMax(value, isMax) {
7279 var format = this.getGaugeLabelExtents();
7280 return format ? format(value, isMax) : value;
7281 },
7282 expandArc: function expandArc(targetIds) {
7283 var $$ = this; // MEMO: avoid to cancel transition
7284
7285 if ($$.transiting) {
7286 var interval = setInterval(function () {
7287 $$.transiting || (clearInterval(interval), $$.legend.selectAll(".".concat(config_classes.legendItemFocused)).size() > 0 && $$.expandArc(targetIds));
7288 }, 10);
7289 return;
7290 }
7291
7292 var newTargetIds = $$.mapToTargetIds(targetIds);
7293 $$.svg.selectAll($$.selectorTargets(newTargetIds, ".".concat(config_classes.chartArc))).each(function (d) {
7294 if ($$.shouldExpand(d.data.id) && d.value !== 0) {
7295 var expandDuration = $$.expandDuration(d.data.id);
7296 Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this).selectAll("path").transition().duration(expandDuration).attr("d", $$.svgArcExpanded).transition().duration(expandDuration * 2).attr("d", $$.svgArcExpandedSub);
7297 }
7298 });
7299 },
7300 unexpandArc: function unexpandArc(targetIds) {
7301 var $$ = this;
7302
7303 if (!$$.transiting) {
7304 var newTargetIds = $$.mapToTargetIds(targetIds);
7305 $$.svg.selectAll($$.selectorTargets(newTargetIds, ".".concat(config_classes.chartArc))).selectAll("path").transition().duration(function (d) {
7306 return $$.expandDuration(d.data.id);
7307 }).attr("d", $$.svgArc), $$.svg.selectAll("".concat(config_classes.arc)).style("opacity", "1");
7308 }
7309 },
7310 expandDuration: function expandDuration(id) {
7311 var type,
7312 $$ = this,
7313 config = $$.config;
7314 return $$.isDonutType(id) ? type = "donut" : $$.isGaugeType(id) ? type = "gauge" : $$.isPieType(id) && (type = "pie"), type ? config["".concat(type, "_expand_duration")] : 50;
7315 },
7316 shouldExpand: function shouldExpand(id) {
7317 var $$ = this,
7318 config = $$.config;
7319 return $$.isDonutType(id) && config.donut_expand || $$.isGaugeType(id) && config.gauge_expand || $$.isPieType(id) && config.pie_expand;
7320 },
7321 shouldShowArcLabel: function shouldShowArcLabel() {
7322 var $$ = this,
7323 config = $$.config,
7324 shouldShow = !0;
7325 // when gauge, always true
7326 return $$.hasType("donut") ? shouldShow = config.donut_label_show : $$.hasType("pie") && (shouldShow = config.pie_label_show), shouldShow;
7327 },
7328 meetsArcLabelThreshold: function meetsArcLabelThreshold(ratio) {
7329 var $$ = this,
7330 config = $$.config,
7331 threshold = $$.hasType("donut") ? config.donut_label_threshold : config.pie_label_threshold;
7332 return ratio >= threshold;
7333 },
7334 getArcLabelFormat: function getArcLabelFormat() {
7335 var $$ = this,
7336 config = $$.config,
7337 format = config.pie_label_format;
7338 return $$.hasType("gauge") ? format = config.gauge_label_format : $$.hasType("donut") && (format = config.donut_label_format), format;
7339 },
7340 getGaugeLabelExtents: function getGaugeLabelExtents() {
7341 var config = this.config;
7342 return config.gauge_label_extents;
7343 },
7344 getArcTitle: function getArcTitle() {
7345 var $$ = this;
7346 return $$.hasType("donut") ? $$.config.donut_title : "";
7347 },
7348 updateTargetsForArc: function updateTargetsForArc(targets) {
7349 var $$ = this,
7350 main = $$.main,
7351 classChartArc = $$.classChartArc.bind($$),
7352 classArcs = $$.classArcs.bind($$),
7353 classFocus = $$.classFocus.bind($$),
7354 mainPieUpdate = main.select(".".concat(config_classes.chartArcs)).selectAll(".".concat(config_classes.chartArc)).data($$.pie(targets)).attr("class", function (d) {
7355 return classChartArc(d) + classFocus(d.data);
7356 }),
7357 mainPieEnter = mainPieUpdate.enter().append("g").attr("class", classChartArc);
7358 mainPieEnter.append("g").attr("class", classArcs).merge(mainPieUpdate), mainPieEnter.append("text").attr("dy", $$.hasType("gauge") ? "-.1em" : ".35em").style("opacity", "0").style("text-anchor", "middle").style("pointer-events", "none");
7359 },
7360 initArc: function initArc() {
7361 var $$ = this;
7362 $$.arcs = $$.main.select(".".concat(config_classes.chart)).append("g").attr("class", config_classes.chartArcs).attr("transform", $$.getTranslate("arc")), $$.setArcTitle();
7363 },
7364
7365 /**
7366 * Set arc title text
7367 * @private
7368 */
7369 setArcTitle: function setArcTitle() {
7370 var $$ = this,
7371 title = $$.getArcTitle();
7372
7373 if (title) {
7374 var multiline = title.split("\n"),
7375 text = $$.arcs.append("text").attr("class", config_classes.chartArcsTitle).style("text-anchor", "middle");
7376
7377 // if is multiline text
7378 if (multiline.length > 1) {
7379 var fontSize = +text.style("font-size").replace("px", ""),
7380 height = Math.floor(text.text(".").node().getBBox().height, text.text(""));
7381 multiline.forEach(function (v, i) {
7382 return text.insert("tspan").text(v).attr("x", 0).attr("dy", i ? height : 0);
7383 }), text.attr("y", "-".concat(fontSize * (multiline.length - 2) || fontSize / 2));
7384 } else text.text(title);
7385 }
7386 },
7387 redrawArc: function redrawArc(duration, durationForExit, withTransform) {
7388 var $$ = this,
7389 config = $$.config,
7390 main = $$.main,
7391 hasInteraction = config.interaction_enabled,
7392 mainArc = main.selectAll(".".concat(config_classes.arcs)).selectAll(".".concat(config_classes.arc)).data($$.arcData.bind($$));
7393 // bind arc events
7394 mainArc.exit().transition().duration(durationForExit).style("opacity", "0").remove(), mainArc = mainArc.enter().append("path").attr("class", $$.classArc.bind($$)).style("fill", function (d) {
7395 return $$.color(d.data);
7396 }).style("cursor", function (d) {
7397 return hasInteraction && (config.data_selection_isselectable(d) ? "pointer" : null);
7398 }).style("opacity", "0").each(function (d) {
7399 $$.isGaugeType(d.data) && (d.startAngle = config.gauge_startingAngle, d.endAngle = config.gauge_startingAngle), this._current = d;
7400 }).merge(mainArc), mainArc.attr("transform", function (d) {
7401 return !$$.isGaugeType(d.data) && withTransform ? "scale(0)" : "";
7402 }).style("opacity", function (d) {
7403 return d === this._current ? "0" : "1";
7404 }).each(function () {
7405 $$.transiting = !0;
7406 }).transition().duration(duration).attrTween("d", function (d) {
7407 var updated = $$.updateAngle(d);
7408 if (!updated) return function () {
7409 return "M 0 0";
7410 };
7411 isNaN(this._current.startAngle) && (this._current.startAngle = 0), isNaN(this._current.endAngle) && (this._current.endAngle = this._current.startAngle);
7412 var interpolate = Object(external_commonjs_d3_interpolate_commonjs2_d3_interpolate_amd_d3_interpolate_root_d3_["interpolate"])(this._current, updated);
7413 return this._current = interpolate(0), function (t) {
7414 var interpolated = interpolate(t);
7415 // data.id will be updated by interporator
7416 return interpolated.data = d.data, $$.getArc(interpolated, !0);
7417 };
7418 }).attr("transform", withTransform ? "scale(1)" : "").style("fill", function (d) {
7419 return $$.levelColor ? $$.levelColor(d.data.values[0].value) : $$.color(d.data.id);
7420 }) // Where gauge reading color would receive customization.
7421 .style("opacity", "1").call($$.endall, function () {
7422 $$.transiting = !1;
7423 }), hasInteraction && $$.bindArcEvent(mainArc), $$.redrawArcText(duration);
7424 },
7425 bindArcEvent: function bindArcEvent(arc) {
7426 function selectArc(_this, arcData, id) {
7427 $$.expandArc(id), $$.api.focus(id), $$.toggleFocusLegend(id, !0), $$.showTooltip([arcData], _this);
7428 }
7429
7430 function unselectArc(arcData) {
7431 var id = arcData && arcData.id || undefined;
7432 $$.unexpandArc(id), $$.api.revert(), $$.revertLegend(), $$.hideTooltip();
7433 }
7434
7435 var $$ = this,
7436 isTouch = $$.inputType === "touch",
7437 isMouse = $$.inputType === "mouse";
7438
7439 // touch events
7440 if (arc.on("click", function (d, i) {
7441 var arcData,
7442 updated = $$.updateAngle(d);
7443 updated && (arcData = $$.convertToArcData(updated), $$.toggleShape && $$.toggleShape(this, arcData, i), $$.config.data_onclick.call($$.api, arcData, this));
7444 }), isMouse && arc.on("mouseover", function (d) {
7445 if (!$$.transiting) // skip while transiting
7446 {
7447 var updated = $$.updateAngle(d),
7448 arcData = updated ? $$.convertToArcData(updated) : null,
7449 id = arcData && arcData.id || undefined;
7450 selectArc(this, arcData, id), $$.config.data_onover(arcData, this);
7451 }
7452 }).on("mouseout", function (d) {
7453 if (!$$.transiting) // skip while transiting
7454 {
7455 var updated = $$.updateAngle(d),
7456 arcData = updated ? $$.convertToArcData(updated) : null;
7457 unselectArc(), $$.config.data_onout(arcData, this);
7458 }
7459 }).on("mousemove", function (d) {
7460 var updated = $$.updateAngle(d),
7461 arcData = updated ? $$.convertToArcData(updated) : null;
7462 $$.showTooltip([arcData], this);
7463 }), isTouch && $$.hasArcType()) {
7464 var getEventArc = function () {
7465 var touch = external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["event"].changedTouches[0],
7466 eventArc = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(document.elementFromPoint(touch.clientX, touch.clientY));
7467 return eventArc;
7468 };
7469
7470 $$.svg.on("touchstart", function () {
7471 if (!$$.transiting) // skip while transiting
7472 {
7473 var eventArc = getEventArc(),
7474 datum = eventArc.datum(),
7475 updated = datum && datum.data && datum.data.id ? $$.updateAngle(datum) : null,
7476 arcData = updated ? $$.convertToArcData(updated) : null,
7477 id = arcData && arcData.id || undefined;
7478 id === undefined ? unselectArc() : selectArc(this, arcData, id), $$.config.data_onover(arcData, this);
7479 }
7480 }).on("touchend", function () {
7481 if (!$$.transiting) // skip while transiting
7482 {
7483 var eventArc = getEventArc(),
7484 datum = eventArc.datum(),
7485 updated = datum && datum.data && datum.data.id ? $$.updateAngle(datum) : null,
7486 arcData = updated ? $$.convertToArcData(updated) : null,
7487 id = arcData && arcData.id || undefined;
7488 id === undefined ? unselectArc() : selectArc(this, arcData, id), $$.config.data_onout(arcData, this);
7489 }
7490 }).on("touchmove", function () {
7491 var eventArc = getEventArc(),
7492 datum = eventArc.datum(),
7493 updated = datum && datum.data && datum.data.id ? $$.updateAngle(datum) : null,
7494 arcData = updated ? $$.convertToArcData(updated) : null,
7495 id = arcData && arcData.id || undefined;
7496 id === undefined ? unselectArc() : selectArc(this, arcData, id);
7497 });
7498 }
7499 },
7500 redrawArcText: function redrawArcText(duration) {
7501 var $$ = this,
7502 config = $$.config,
7503 main = $$.main,
7504 gaugeTextValue = main.selectAll(".".concat(config_classes.chartArc)).select("text").style("opacity", "0").attr("class", function (d) {
7505 return $$.isGaugeType(d.data) ? config_classes.gaugeValue : "";
7506 });
7507 config.gauge_fullCircle && gaugeTextValue.attr("dy", "".concat(Math.round($$.radius / 14)));
7508 // to handle multiline text for gauge type
7509 var textMethod = !gaugeTextValue.empty() && gaugeTextValue.classed(config_classes.gaugeValue) ? "call" : "text";
7510
7511 if (gaugeTextValue[textMethod]($$.textForArcLabel.bind($$)).attr("transform", $$.transformForArcLabel.bind($$)).style("font-size", function (d) {
7512 return $$.isGaugeType(d.data) ? "".concat(Math.round($$.radius / 5), "px") : "";
7513 }).transition().duration(duration).style("opacity", function (d) {
7514 return $$.isTargetToShow(d.data.id) && $$.isArcType(d.data) ? "1" : "0";
7515 }), main.select(".".concat(config_classes.chartArcsTitle)).style("opacity", $$.hasType("donut") || $$.hasType("gauge") ? "1" : "0"), $$.hasType("gauge")) {
7516 var endAngle = (config.gauge_fullCircle ? -4 : -1) * config.gauge_startingAngle;
7517 $$.arcs.select(".".concat(config_classes.chartArcsBackground)).attr("d", function () {
7518 var d = {
7519 data: [{
7520 value: config.gauge_max
7521 }],
7522 startAngle: config.gauge_startingAngle,
7523 endAngle: endAngle
7524 };
7525 return $$.getArc(d, !0, !0);
7526 }), $$.arcs.select(".".concat(config_classes.chartArcsGaugeUnit)).attr("dy", ".75em").text(config.gauge_label_show ? config.gauge_units : ""), config.gauge_label_show && ($$.arcs.select(".".concat(config_classes.chartArcsGaugeMin)).attr("dx", "".concat(-1 * ($$.innerRadius + ($$.radius - $$.innerRadius) / (config.gauge_fullCircle ? 1 : 2)), "px")).attr("dy", "1.2em").text($$.textForGaugeMinMax(config.gauge_min, !1)), !config.gauge_fullCircle && $$.arcs.select(".".concat(config_classes.chartArcsGaugeMax)).attr("dx", "".concat($$.innerRadius + ($$.radius - $$.innerRadius) / 2, "px")).attr("dy", "1.2em").text($$.textForGaugeMinMax(config.gauge_max, !0)));
7527 }
7528 },
7529 initGauge: function initGauge() {
7530 var $$ = this,
7531 config = $$.config,
7532 arcs = $$.arcs;
7533 $$.hasType("gauge") && (arcs.append("path").attr("class", config_classes.chartArcsBackground), arcs.append("text").attr("class", config_classes.chartArcsGaugeUnit).style("text-anchor", "middle").style("pointer-events", "none"), config.gauge_label_show && (arcs.append("text").attr("class", config_classes.chartArcsGaugeMin).style("text-anchor", "middle").style("pointer-events", "none"), !config.gauge_fullCircle && arcs.append("text").attr("class", config_classes.chartArcsGaugeMax).style("text-anchor", "middle").style("pointer-events", "none")));
7534 },
7535 getGaugeLabelHeight: function getGaugeLabelHeight() {
7536 return this.config.gauge_label_show ? 20 : 0;
7537 }
7538});
7539// CONCATENATED MODULE: ./src/shape/bar.js
7540
7541
7542/**
7543 * Copyright (c) 2017 ~ present NAVER Corp.
7544 * billboard.js project is licensed under the MIT license
7545 */
7546
7547
7548
7549
7550extend(ChartInternal_ChartInternal.prototype, {
7551 initBar: function initBar() {
7552 var $$ = this;
7553 $$.main.select(".".concat(config_classes.chart)).append("g").attr("class", config_classes.chartBars);
7554 },
7555 updateTargetsForBar: function updateTargetsForBar(targets) {
7556 var $$ = this,
7557 config = $$.config,
7558 classChartBar = $$.classChartBar.bind($$),
7559 classBars = $$.classBars.bind($$),
7560 classFocus = $$.classFocus.bind($$),
7561 mainBarUpdate = $$.main.select(".".concat(config_classes.chartBars)).selectAll(".".concat(config_classes.chartBar)).data(targets).attr("class", function (d) {
7562 return classChartBar(d) + classFocus(d);
7563 }),
7564 mainBarEnter = mainBarUpdate.enter().append("g").attr("class", classChartBar).style("opacity", "0").style("pointer-events", "none");
7565 // Bars for each data
7566 mainBarEnter.append("g").attr("class", classBars).style("cursor", function (d) {
7567 return config.data_selection_isselectable(d) ? "pointer" : null;
7568 });
7569 },
7570 updateBar: function updateBar(durationForExit) {
7571 var $$ = this,
7572 barData = $$.barData.bind($$),
7573 classBar = $$.classBar.bind($$),
7574 initialOpacity = $$.initialOpacity.bind($$),
7575 color = function (d) {
7576 return $$.color(d.id);
7577 };
7578
7579 $$.mainBar = $$.main.selectAll(".".concat(config_classes.bars)).selectAll(".".concat(config_classes.bar)).data(barData), $$.mainBar.exit().transition().duration(durationForExit).style("opacity", "0").remove(), $$.mainBar = $$.mainBar.enter().append("path").attr("class", classBar).style("stroke", color).style("fill", color).merge($$.mainBar).style("opacity", initialOpacity);
7580 },
7581 redrawBar: function redrawBar(drawBar, withTransition) {
7582 return [(withTransition ? this.mainBar.transition(getRandom()) : this.mainBar).attr("d", drawBar).style("fill", this.color).style("opacity", "1")];
7583 },
7584 getBarW: function getBarW(axis, barTargetsNum) {
7585 var $$ = this,
7586 config = $$.config,
7587 w = isNumber(config.bar_width) ? config.bar_width : barTargetsNum ? axis.tickInterval($$.getMaxDataCount()) * config.bar_width_ratio / barTargetsNum : 0;
7588 return config.bar_width_max && w > config.bar_width_max ? config.bar_width_max : w;
7589 },
7590 getBars: function getBars(i, id) {
7591 var $$ = this,
7592 suffix = isValue(i) ? "-".concat(i) : "";
7593 return (id ? $$.main.selectAll(".".concat(config_classes.bars).concat($$.getTargetSelectorSuffix(id))) : $$.main).selectAll(".".concat(config_classes.bar).concat(suffix));
7594 },
7595 expandBars: function expandBars(i, id, reset) {
7596 var $$ = this;
7597 reset && $$.unexpandBars(), $$.getBars(i, id).classed(config_classes.EXPANDED, !0);
7598 },
7599 unexpandBars: function unexpandBars(i) {
7600 this.getBars(i).classed(config_classes.EXPANDED, !1);
7601 },
7602 generateDrawBar: function generateDrawBar(barIndices, isSub) {
7603 var $$ = this,
7604 config = $$.config,
7605 getPoints = $$.generateGetBarPoints(barIndices, isSub),
7606 isRotated = config.axis_rotated,
7607 isGrouped = config.data_groups.length,
7608 barRadius = config.bar_radius,
7609 barRadiusRatio = config.bar_radius_ratio,
7610 getRadius = isNumber(barRadius) && barRadius > 0 ? function () {
7611 return barRadius;
7612 } : isNumber(barRadiusRatio) ? function (w) {
7613 return w * barRadiusRatio;
7614 } : null;
7615 return function (d, i) {
7616 // 4 points that make a bar
7617 var points = getPoints(d, i),
7618 indexX = +isRotated,
7619 indexY = +!indexX,
7620 isNegative = d.value < 0,
7621 pathRadius = ["", ""],
7622 radius = 0; // switch points if axis is rotated, not applicable for sub chart
7623
7624 if (getRadius && !isGrouped) {
7625 var index = isRotated ? indexY : indexX,
7626 barW = points[2][index] - points[0][index];
7627 radius = getRadius(barW);
7628 var arc = "a".concat(radius, ",").concat(radius, " ").concat(isNegative ? "1 0 0" : "0 0 1", " ");
7629 pathRadius[+!isRotated] = "".concat(arc).concat(radius, ",").concat(radius), pathRadius[+isRotated] = "".concat(arc).concat([-radius, radius][isRotated ? "sort" : "reverse"]()), isNegative && pathRadius.reverse();
7630 } // path string data shouldn't be containing new line chars
7631 // https://github.com/naver/billboard.js/issues/530
7632
7633
7634 var path = isRotated ? "H".concat(points[1][indexX] - radius, " ").concat(pathRadius[0], "V").concat(points[2][indexY] - radius, " ").concat(pathRadius[1], "H").concat(points[3][indexX]) : "V".concat(points[1][indexY] + (isNegative ? -radius : radius), " ").concat(pathRadius[0], "H").concat(points[2][indexX] - radius, " ").concat(pathRadius[1], "V").concat(points[3][indexY]);
7635 return "M".concat(points[0][indexX], ",").concat(points[0][indexY]).concat(path, "z");
7636 };
7637 },
7638 generateGetBarPoints: function generateGetBarPoints(barIndices, isSub) {
7639 var $$ = this,
7640 axis = isSub ? $$.subXAxis : $$.xAxis,
7641 barTargetsNum = barIndices.__max__ + 1,
7642 barW = $$.getBarW(axis, barTargetsNum),
7643 barX = $$.getShapeX(barW, barTargetsNum, barIndices, !!isSub),
7644 barY = $$.getShapeY(!!isSub),
7645 barOffset = $$.getShapeOffset($$.isBarType, barIndices, !!isSub),
7646 yScale = isSub ? $$.getSubYScale : $$.getYScale;
7647 return function (d, i) {
7648 var y0 = yScale.call($$, d.id)(0),
7649 offset = barOffset(d, i) || y0,
7650 posX = barX(d),
7651 posY = barY(d);
7652 // 4 points that make a bar
7653 return $$.config.axis_rotated && (d.value > 0 && posY < y0 || d.value < 0 && y0 < posY) && (posY = y0), posY -= y0 - offset, [[posX, offset], [posX, posY], [posX + barW, posY], [posX + barW, offset]];
7654 };
7655 },
7656 isWithinBar: function isWithinBar(that) {
7657 var mouse = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["mouse"])(that),
7658 list = getRectSegList(that),
7659 _list2 = slicedToArray_default()(list, 2),
7660 seg0 = _list2[0],
7661 seg1 = _list2[1],
7662 x = Math.min(seg0.x, seg1.x),
7663 y = Math.min(seg0.y, seg1.y),
7664 offset = 2,
7665 _that$getBBox = that.getBBox(),
7666 width = _that$getBBox.width,
7667 height = _that$getBBox.height;
7668
7669 return x - offset < mouse[0] && mouse[0] < x + width + offset && y - offset < mouse[1] && mouse[1] < y + height + offset;
7670 }
7671});
7672// CONCATENATED MODULE: ./src/shape/bubble.js
7673/**
7674 * Copyright (c) 2017 ~ present NAVER Corp.
7675 * billboard.js project is licensed under the MIT license
7676 */
7677
7678
7679
7680extend(ChartInternal_ChartInternal.prototype, {
7681 /**
7682 * Initializer
7683 * @private
7684 */
7685 initBubble: function initBubble() {
7686 var $$ = this,
7687 config = $$.config;
7688 $$.hasType("bubble") && (config.point_show = !0, config.point_type = "circle", config.point_sensitivity = 25);
7689 },
7690
7691 /**
7692 * Get user agent's computed value for the total length of the path in user units
7693 * https://developer.mozilla.org/en-US/docs/Web/API/SVGGeometryElement/getTotalLength
7694 * @return {Number}
7695 * @private
7696 */
7697 getBaseLength: function getBaseLength() {
7698 var $$ = this,
7699 cacheKey = "$baseLength",
7700 baseLength = $$.getCache(cacheKey);
7701 return baseLength || $$.addCache(cacheKey, baseLength = Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["min"])([$$.axes.x.select("path").node().getTotalLength(), $$.axes.y.select("path").node().getTotalLength()])), baseLength;
7702 },
7703
7704 /**
7705 * Get the radius value for bubble circle
7706 * @param {Object} d
7707 * @return {Number}
7708 * @private
7709 */
7710 getBubbleR: function getBubbleR(d) {
7711 var $$ = this,
7712 maxR = $$.config.bubble_maxR;
7713 isFunction(maxR) ? maxR = maxR(d) : !isNumber(maxR) && (maxR = $$.getBaseLength() / ($$.getMaxDataCount() * 2) + 12);
7714 var max = Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["max"])($$.getMinMaxData().max.map(function (d) {
7715 return isObject(d.value) ? d.value.mid : d.value;
7716 })),
7717 maxArea = maxR * maxR * Math.PI,
7718 area = d.value * (maxArea / max);
7719 return Math.sqrt(area / Math.PI);
7720 }
7721});
7722// CONCATENATED MODULE: ./src/shape/line.js
7723/**
7724 * Copyright (c) 2017 ~ present NAVER Corp.
7725 * billboard.js project is licensed under the MIT license
7726 */
7727
7728
7729
7730
7731
7732extend(ChartInternal_ChartInternal.prototype, {
7733 initLine: function initLine() {
7734 var $$ = this;
7735 $$.main.select(".".concat(config_classes.chart)).append("g").attr("class", config_classes.chartLines);
7736 },
7737 updateTargetsForLine: function updateTargetsForLine(targets) {
7738 var $$ = this,
7739 config = $$.config,
7740 classChartLine = $$.classChartLine.bind($$),
7741 classLines = $$.classLines.bind($$),
7742 classAreas = $$.classAreas.bind($$),
7743 classCircles = $$.classCircles.bind($$),
7744 classFocus = $$.classFocus.bind($$),
7745 mainLineUpdate = $$.main.select(".".concat(config_classes.chartLines)).selectAll(".".concat(config_classes.chartLine)).data(targets).attr("class", function (d) {
7746 return classChartLine(d) + classFocus(d);
7747 }),
7748 mainLineEnter = mainLineUpdate.enter().append("g").attr("class", classChartLine).style("opacity", "0").style("pointer-events", "none");
7749 // Lines for each data
7750 // Areas
7751 // Update date for selected circles
7752 mainLineEnter.append("g").attr("class", classLines), mainLineEnter.append("g").attr("class", classAreas), config.point_show && (config.data_selection_enabled && mainLineEnter.append("g").attr("class", function (d) {
7753 return $$.generateClass(config_classes.selectedCircles, d.id);
7754 }), mainLineEnter.append("g").attr("class", classCircles).style("cursor", function (d) {
7755 return config.data_selection_isselectable(d) ? "pointer" : null;
7756 })), targets.forEach(function (t) {
7757 $$.main.selectAll(".".concat(config_classes.selectedCircles).concat($$.getTargetSelectorSuffix(t.id))).selectAll("".concat(config_classes.selectedCircle)).each(function (d) {
7758 d.value = t.values[d.index].value;
7759 });
7760 });
7761 },
7762 updateLine: function updateLine(durationForExit) {
7763 var $$ = this;
7764 $$.mainLine = $$.main.selectAll(".".concat(config_classes.lines)).selectAll(".".concat(config_classes.line)).data($$.lineData.bind($$)), $$.mainLine.exit().transition().duration(durationForExit).style("opacity", "0").remove(), $$.mainLine = $$.mainLine.enter().append("path").attr("class", function (d) {
7765 return "".concat($$.classLine.bind($$)(d), " ").concat($$.extraLineClasses(d) || "");
7766 }).style("stroke", $$.color).merge($$.mainLine).style("opacity", $$.initialOpacity.bind($$)).style("shape-rendering", function (d) {
7767 return $$.isStepType(d) ? "crispEdges" : "";
7768 }).attr("transform", null);
7769 },
7770 redrawLine: function redrawLine(drawLine, withTransition) {
7771 return [(withTransition ? this.mainLine.transition(getRandom()) : this.mainLine).attr("d", drawLine).style("stroke", this.color).style("opacity", "1")];
7772 },
7773
7774 /**
7775 * Get the curve interpolate
7776 * @param {Array} d Data object
7777 * @return {Function}
7778 * @private
7779 */
7780 getCurve: function getCurve(d) {
7781 var $$ = this,
7782 isRotatedStepType = $$.config.axis_rotated && $$.isStepType(d);
7783 // when is step & rotated, should be computed in different way
7784 // https://github.com/naver/billboard.js/issues/471
7785 return isRotatedStepType ? function (context) {
7786 var step = $$.getInterpolate(d)(context); // keep the original method
7787
7788 return step.orgPoint = step.point, step.pointRotated = function (x, y) {
7789 this._point === 1 && (this._point = 2);
7790 var y1 = this._y * (1 - this._t) + y * this._t;
7791 this._context.lineTo(this._x, y1), this._context.lineTo(x, y1), this._x = x, this._y = y;
7792 }, step.point = function (x, y) {
7793 this._point === 0 ? this.orgPoint(x, y) : this.pointRotated(x, y);
7794 }, step;
7795 } : $$.getInterpolate(d);
7796 },
7797 generateDrawLine: function generateDrawLine(lineIndices, isSub) {
7798 var $$ = this,
7799 config = $$.config,
7800 lineConnectNull = config.line_connectNull,
7801 isRotated = config.axis_rotated,
7802 getPoints = $$.generateGetLinePoints(lineIndices, isSub),
7803 yScaleGetter = isSub ? $$.getSubYScale : $$.getYScale,
7804 xValue = function (d) {
7805 return (isSub ? $$.subxx : $$.xx).call($$, d);
7806 },
7807 yValue = function (d, i) {
7808 return $$.isGrouped(d.id) ? getPoints(d, i)[0][1] : yScaleGetter.call($$, d.id)($$.getBaseValue(d));
7809 },
7810 line = Object(external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["line"])();
7811
7812 return line = isRotated ? line.x(yValue).y(xValue) : line.x(xValue).y(yValue), lineConnectNull || (line = line.defined(function (d) {
7813 return $$.getBaseValue(d) !== null;
7814 })), function (d) {
7815 var path,
7816 x = isSub ? $$.x : $$.subX,
7817 y = yScaleGetter.call($$, d.id),
7818 values = lineConnectNull ? $$.filterRemoveNull(d.values) : d.values,
7819 x0 = 0,
7820 y0 = 0;
7821 return $$.isLineType(d) ? config.data_regions[d.id] ? path = $$.lineWithRegions(values, x, y, config.data_regions[d.id]) : ($$.isStepType(d) && (values = $$.convertValuesToStep(values)), path = line.curve($$.getCurve(d))(values)) : (values[0] && (x0 = x(values[0].x), y0 = y(values[0].value)), path = isRotated ? "M ".concat(y0, " ").concat(x0) : "M ".concat(x0, " ").concat(y0)), path || "M 0 0";
7822 };
7823 },
7824 generateGetLinePoints: function generateGetLinePoints(lineIndices, isSubValue) {
7825 // partial duplication of generateGetBarPoints
7826 var $$ = this,
7827 config = $$.config,
7828 lineTargetsNum = lineIndices.__max__ + 1,
7829 isSub = !!isSubValue,
7830 x = $$.getShapeX(0, lineTargetsNum, lineIndices, isSub),
7831 y = $$.getShapeY(isSub),
7832 lineOffset = $$.getShapeOffset($$.isLineType, lineIndices, isSub),
7833 yScale = isSub ? $$.getSubYScale : $$.getYScale;
7834 return function (d, i) {
7835 var y0 = yScale.call($$, d.id)(0),
7836 offset = lineOffset(d, i) || y0,
7837 posX = x(d),
7838 posY = y(d);
7839 config.axis_rotated && (d.value > 0 && posY < y0 || d.value < 0 && y0 < posY) && (posY = y0);
7840 // 1 point that marks the line position
7841 var point = [posX, posY - (y0 - offset)];
7842 return [point, point, // from here and below, needed for compatibility
7843 point, point];
7844 };
7845 },
7846 lineWithRegions: function lineWithRegions(d, x, y, _regions) {
7847 var xp,
7848 yp,
7849 diff,
7850 diffx2,
7851 $$ = this,
7852 config = $$.config,
7853 isRotated = config.axis_rotated,
7854 isTimeSeries = $$.isTimeSeries(),
7855 xOffset = $$.isCategorized() ? .5 : 0,
7856 regions = [],
7857 dasharray = "2 2",
7858 isWithinRegions = function (withinX, withinRegions) {
7859 for (var reg, i = 0; reg = withinRegions[i]; i++) if (reg.start < withinX && withinX <= reg.end) return reg.style;
7860
7861 return !1;
7862 };
7863
7864 // Check start/end of regions
7865 if (isDefined(_regions)) {
7866 var getValue = function (v, def) {
7867 return isUndefined(v) ? def : isTimeSeries ? $$.parseDate(v) : v;
7868 };
7869
7870 for (var reg, i = 0; reg = _regions[i]; i++) {
7871 var start = getValue(reg.start, d[0].x),
7872 end = getValue(reg.end, d[d.length - 1].x),
7873 style = reg.style || {
7874 dasharray: dasharray
7875 };
7876 regions[i] = {
7877 start: start,
7878 end: end,
7879 style: style
7880 };
7881 }
7882 } // Set scales
7883
7884
7885 var xValue = isRotated ? function (dt) {
7886 return y(dt.value);
7887 } : function (dt) {
7888 return x(dt.x);
7889 },
7890 yValue = isRotated ? function (dt) {
7891 return x(dt.x);
7892 } : function (dt) {
7893 return y(dt.value);
7894 },
7895 generateM = function (points) {
7896 return "M".concat(points[0][0], ",").concat(points[0][1], "L").concat(points[1][0], ",").concat(points[1][1]);
7897 },
7898 sWithRegion = isTimeSeries ? function (d0, d1, k, timeseriesDiff) {
7899 var x0 = d0.x.getTime(),
7900 xDiff = d1.x - d0.x,
7901 xv0 = new Date(x0 + xDiff * k),
7902 xv1 = new Date(x0 + xDiff * (k + timeseriesDiff)),
7903 points = isRotated ? [[y(yp(k)), x(xv0)], [y(yp(k + diff)), x(xv1)]] : [[x(xv0), y(yp(k))], [x(xv1), y(yp(k + diff))]];
7904 return generateM(points);
7905 } : function (d0, d1, k, otherDiff) {
7906 var points = isRotated ? [[y(yp(k), !0), x(xp(k))], [y(yp(k + otherDiff), !0), x(xp(k + otherDiff))]] : [[x(xp(k), !0), y(yp(k))], [x(xp(k + otherDiff), !0), y(yp(k + otherDiff))]];
7907 return generateM(points);
7908 },
7909 path = "M";
7910
7911 for (var data, _i = 0; data = d[_i]; _i++) {
7912 var prevData = d[_i - 1],
7913 style = isWithinRegions(data.x, regions);
7914 // Draw as normal
7915 if (isUndefined(regions) || !style) path += "".concat(_i ? "L" : "").concat(xValue(data), ",").concat(yValue(data));else {
7916 try {
7917 style = style.dasharray.split(" ");
7918 } catch (e) {
7919 style = dasharray.split(" ");
7920 } // Draw with region // TODO: Fix for horizotal charts
7921
7922
7923 xp = $$.getScale(prevData.x + xOffset, data.x + xOffset, isTimeSeries), yp = $$.getScale(prevData.value, data.value);
7924 var dx = x(data.x) - x(prevData.x),
7925 dy = y(data.value) - y(prevData.value),
7926 dd = Math.sqrt(Math.pow(dx, 2) + Math.pow(dy, 2));
7927 diff = style[0] / dd, diffx2 = diff * style[1];
7928
7929 for (var j = diff; j <= 1; j += diffx2) path += sWithRegion(prevData, data, j, diff), j + diffx2 >= 1 && (path += sWithRegion(prevData, data, 1, 0));
7930 }
7931 }
7932
7933 return path;
7934 },
7935 updateArea: function updateArea(durationForExit) {
7936 var $$ = this;
7937 $$.mainArea = $$.main.selectAll(".".concat(config_classes.areas)).selectAll(".".concat(config_classes.area)).data($$.lineData.bind($$)), $$.mainArea.exit().transition().duration(durationForExit).style("opacity", "0").remove(), $$.mainArea = $$.mainArea.enter().append("path").attr("class", $$.classArea.bind($$)).style("fill", $$.color).style("opacity", function () {
7938 return $$.orgAreaOpacity = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this).style("opacity"), "0";
7939 }).merge($$.mainArea), $$.mainArea.style("opacity", $$.orgAreaOpacity);
7940 },
7941 redrawArea: function redrawArea(drawArea, withTransition) {
7942 var $$ = this;
7943 return [(withTransition ? this.mainArea.transition(getRandom()) : this.mainArea).attr("d", drawArea).style("fill", this.color).style("opacity", function (d) {
7944 return $$.isAreaRangeType(d) ? $$.orgAreaOpacity / 1.75 : $$.orgAreaOpacity;
7945 })];
7946 },
7947
7948 /**
7949 * Generate area path data
7950 * @param areaIndices
7951 * @param isSub
7952 * @return {function(*=): (*|string)}
7953 * @private
7954 */
7955 generateDrawArea: function generateDrawArea(areaIndices, isSub) {
7956 var $$ = this,
7957 config = $$.config,
7958 lineConnectNull = config.line_connectNull,
7959 isRotated = config.axis_rotated,
7960 getPoints = $$.generateGetAreaPoints(areaIndices, isSub),
7961 yScaleGetter = isSub ? $$.getSubYScale : $$.getYScale,
7962 xValue = function (d) {
7963 return (isSub ? $$.subxx : $$.xx).call($$, d);
7964 },
7965 value0 = function (d, i) {
7966 return $$.isGrouped(d.id) ? getPoints(d, i)[0][1] : yScaleGetter.call($$, d.id)($$.isAreaRangeType(d) ? $$.getAreaRangeData(d, "high") : $$.getAreaBaseValue(d.id));
7967 },
7968 value1 = function (d, i) {
7969 return $$.isGrouped(d.id) ? getPoints(d, i)[1][1] : yScaleGetter.call($$, d.id)($$.isAreaRangeType(d) ? $$.getAreaRangeData(d, "low") : d.value);
7970 };
7971
7972 return function (d) {
7973 var path,
7974 values = lineConnectNull ? $$.filterRemoveNull(d.values) : d.values,
7975 x0 = 0,
7976 y0 = 0;
7977
7978 if ($$.isAreaType(d)) {
7979 var area = Object(external_commonjs_d3_shape_commonjs2_d3_shape_amd_d3_shape_root_d3_["area"])();
7980 area = isRotated ? area.y(xValue).x0(value0).x1(value1) : area.x(xValue).y0(config.area_above ? 0 : value0).y1(value1), lineConnectNull || (area = area.defined(function (d) {
7981 return $$.getBaseValue(d) !== null;
7982 })), $$.isStepType(d) && (values = $$.convertValuesToStep(values)), path = area.curve($$.getCurve(d))(values);
7983 } else values[0] && (x0 = $$.x(values[0].x), y0 = $$.getYScale(d.id)(values[0].value)), path = isRotated ? "M ".concat(y0, " ").concat(x0) : "M ".concat(x0, " ").concat(y0);
7984
7985 return path || "M 0 0";
7986 };
7987 },
7988 getAreaBaseValue: function getAreaBaseValue() {
7989 return 0;
7990 },
7991 generateGetAreaPoints: function generateGetAreaPoints(areaIndices, isSub) {
7992 // partial duplication of generateGetBarPoints
7993 var $$ = this,
7994 config = $$.config,
7995 areaTargetsNum = areaIndices.__max__ + 1,
7996 x = $$.getShapeX(0, areaTargetsNum, areaIndices, !!isSub),
7997 y = $$.getShapeY(!!isSub),
7998 areaOffset = $$.getShapeOffset($$.isAreaType, areaIndices, !!isSub),
7999 yScale = isSub ? $$.getSubYScale : $$.getYScale;
8000 return function (d, i) {
8001 var y0 = yScale.call($$, d.id)(0),
8002 offset = areaOffset(d, i) || y0,
8003 posX = x(d),
8004 posY = y(d);
8005 // 1 point that marks the area position
8006 return config.axis_rotated && (d.value > 0 && posY < y0 || d.value < 0 && y0 < posY) && (posY = y0), [[posX, offset], [posX, posY - (y0 - offset)], [posX, posY - (y0 - offset)], // needed for compatibility
8007 [posX, offset] // needed for compatibility
8008 ];
8009 };
8010 },
8011 updateCircle: function updateCircle() {
8012 var $$ = this;
8013 $$.config.point_show && ($$.mainCircle = $$.main.selectAll(".".concat(config_classes.circles)).selectAll(".".concat(config_classes.circle)).data(function (d) {
8014 return !$$.isBarType(d) && (!$$.isLineType(d) || $$.shouldDrawPointsForLine(d)) && $$.labelishData(d);
8015 }), $$.mainCircle.exit().remove(), $$.mainCircle = $$.mainCircle.enter().append($$.point("create", this, $$.classCircle.bind($$), $$.pointR.bind($$), $$.color)).merge($$.mainCircle).style("stroke", $$.color).style("opacity", $$.initialOpacityForCircle.bind($$)));
8016 },
8017 redrawCircle: function redrawCircle(cx, cy, withTransition, flow) {
8018 var $$ = this,
8019 selectedCircles = $$.main.selectAll(".".concat(config_classes.selectedCircle));
8020 if (!$$.config.point_show) return [];
8021 var mainCircles = [];
8022 $$.mainCircle.each(function (d) {
8023 var fn = $$.point("update", $$, cx, cy, $$.opacityForCircle.bind($$), $$.color, withTransition, flow, selectedCircles).bind(this),
8024 result = fn(d);
8025 mainCircles.push(result);
8026 });
8027 var posAttr = $$.isCirclePoint() ? "c" : "";
8028 return [mainCircles, selectedCircles.attr("".concat(posAttr, "x"), cx).attr("".concat(posAttr, "y"), cy)];
8029 },
8030 circleX: function circleX(d) {
8031 var $$ = this,
8032 hasValue = isValue(d.x);
8033 return $$.config.zoom_enabled && $$.zoomScale ? hasValue ? $$.zoomScale(d.x) : null : hasValue ? $$.x(d.x) : null;
8034 },
8035 updateCircleY: function updateCircleY() {
8036 var $$ = this;
8037
8038 $$.circleY = function (d, i) {
8039 var id = d.id;
8040 return $$.isGrouped(id) ? $$.generateGetLinePoints($$.getShapeIndices($$.isLineType))(d, i)[0][1] : $$.getYScale(id)($$.getBaseValue(d));
8041 };
8042 },
8043 getCircles: function getCircles(i, id) {
8044 var $$ = this,
8045 suffix = isValue(i) ? "-".concat(i) : "";
8046 return (id ? $$.main.selectAll(".".concat(config_classes.circles).concat($$.getTargetSelectorSuffix(id))) : $$.main).selectAll(".".concat(config_classes.circle).concat(suffix));
8047 },
8048 expandCircles: function expandCircles(i, id, reset) {
8049 var $$ = this,
8050 r = $$.pointExpandedR.bind($$);
8051 reset && $$.unexpandCircles();
8052 var circles = $$.getCircles(i, id).classed(config_classes.EXPANDED, !0),
8053 scale = r(circles) / $$.config.point_r,
8054 ratio = 1 - scale;
8055 $$.isCirclePoint() ? circles.attr("r", r) : circles.each(function () {
8056 var point = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this);
8057 if (this.tagName === "circle") point.attr("r", r);else {
8058 var _this$getBBox = this.getBBox(),
8059 width = _this$getBBox.width,
8060 height = _this$getBBox.height,
8061 x = ratio * (+point.attr("x") + width / 2),
8062 y = ratio * (+point.attr("y") + height / 2);
8063
8064 point.style("transform", "translate(".concat(x, "px, ").concat(y, "px) scale(").concat(scale, ")"));
8065 }
8066 });
8067 },
8068 unexpandCircles: function unexpandCircles(i) {
8069 var $$ = this,
8070 r = $$.pointR.bind($$),
8071 circles = $$.getCircles(i).filter(function () {
8072 return Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this).classed(config_classes.EXPANDED);
8073 }).classed(config_classes.EXPANDED, !1);
8074 circles.attr("r", r), $$.isCirclePoint() || circles.style("transform", "scale(".concat(r(circles) / $$.config.point_r, ")"));
8075 },
8076 pointR: function (d) {
8077 var $$ = this,
8078 config = $$.config,
8079 pointR = config.point_r,
8080 r = pointR;
8081 return $$.isStepType(d) ? r = 0 : $$.isBubbleType(d) ? r = $$.getBubbleR(d) : isFunction(pointR) && (r = pointR(d)), r;
8082 },
8083 pointExpandedR: function pointExpandedR(d) {
8084 var $$ = this,
8085 config = $$.config,
8086 scale = $$.isBubbleType(d) ? 1.15 : 1.75;
8087 return config.point_focus_expand_enabled ? config.point_focus_expand_r || $$.pointR(d) * scale : $$.pointR(d);
8088 },
8089 pointSelectR: function pointSelectR(d) {
8090 var $$ = this,
8091 selectR = $$.config.point_select_r;
8092 return isFunction(selectR) ? selectR(d) : selectR || $$.pointR(d) * 4;
8093 },
8094 isWithinCircle: function isWithinCircle(node, r) {
8095 var mouse = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["mouse"])(node),
8096 element = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(node),
8097 prefix = this.isCirclePoint() ? "c" : "",
8098 cx = +element.attr("".concat(prefix, "x")),
8099 cy = +element.attr("".concat(prefix, "y"));
8100
8101 // if node don't have cx/y or x/y attribute value
8102 if (!(cx || cy) && node.nodeType === 1) {
8103 var _ref = node.getBBox ? node.getBBox() : node.getBoundingClientRect(),
8104 x = _ref.x,
8105 y = _ref.y;
8106
8107 cx = x, cy = y;
8108 }
8109
8110 return Math.sqrt(Math.pow(cx - mouse[0], 2) + Math.pow(cy - mouse[1], 2)) < r;
8111 },
8112 isWithinStep: function isWithinStep(that, y) {
8113 return Math.abs(y - Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["mouse"])(that)[1]) < 30;
8114 },
8115 shouldDrawPointsForLine: function shouldDrawPointsForLine(d) {
8116 var linePoint = this.config.line_point;
8117 return linePoint === !0 || isArray(linePoint) && linePoint.indexOf(d.id) !== -1;
8118 }
8119});
8120// CONCATENATED MODULE: ./src/shape/point.js
8121/**
8122 * Copyright (c) 2017 ~ present NAVER Corp.
8123 * billboard.js project is licensed under the MIT license
8124 */
8125
8126
8127
8128extend(ChartInternal_ChartInternal.prototype, {
8129 hasValidPointType: function hasValidPointType(type) {
8130 return /^(circle|rect(angle)?|polygon|ellipse|use)$/i.test(type || this.config.point_type);
8131 },
8132 hasValidPointDrawMethods: function hasValidPointDrawMethods(type) {
8133 var pointType = type || this.config.point_type;
8134 return isObjectType(pointType) && isFunction(pointType.create) && isFunction(pointType.update);
8135 },
8136 insertPointInfoDefs: function insertPointInfoDefs(point, id) {
8137 var $$ = this,
8138 copyAttr = function (from, target) {
8139 for (var name, attribs = from.attributes, i = 0; name = attribs[i]; i++) name = name.name, target.setAttribute(name, from.getAttribute(name));
8140 },
8141 doc = new DOMParser().parseFromString(point, "image/svg+xml"),
8142 node = doc.documentElement,
8143 clone = document.createElementNS(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["namespaces"].svg, node.nodeName.toLowerCase());
8144
8145 if (clone.id = id, clone.style.fill = "inherit", clone.style.stroke = "inherit", copyAttr(node, clone), node.childNodes && node.childNodes.length) {
8146 var parent = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(clone);
8147 "innerHTML" in clone ? parent.html(node.innerHTML) : toArray(node.childNodes).forEach(function (v) {
8148 copyAttr(v, parent.append(v.tagName).node());
8149 });
8150 }
8151
8152 $$.defs.node().appendChild(clone);
8153 },
8154 pointFromDefs: function pointFromDefs(id) {
8155 return this.defs.select("#".concat(id));
8156 },
8157 generatePoint: function generatePoint() {
8158 var $$ = this,
8159 config = $$.config,
8160 ids = [],
8161 pattern = notEmpty(config.point_pattern) ? config.point_pattern : [config.point_type];
8162 return function (method, context) {
8163 for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) args[_key - 2] = arguments[_key];
8164
8165 return function (d) {
8166 var point,
8167 id = d.id || d.data && d.data.id || d,
8168 element = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this);
8169 if (ids.indexOf(id) < 0 && ids.push(id), point = pattern[ids.indexOf(id) % pattern.length], $$.hasValidPointType(point)) point = $$[point];else if (!$$.hasValidPointDrawMethods(point)) {
8170 var pointId = "".concat($$.datetimeId, "-point-").concat(id),
8171 pointFromDefs = $$.pointFromDefs(pointId);
8172 if (pointFromDefs.size() < 1 && $$.insertPointInfoDefs(point, pointId), method === "create") return $$.custom.create.bind(context).apply(void 0, [element, pointId].concat(args));
8173 if (method === "update") return $$.custom.update.bind(context).apply(void 0, [element].concat(args));
8174 }
8175 return point[method].bind(context).apply(void 0, [element].concat(args));
8176 };
8177 };
8178 },
8179 getTransitionName: function getTransitionName() {
8180 return getRandom();
8181 },
8182 custom: {
8183 create: function create(element, id, cssClassFn, sizeFn, fillStyleFn) {
8184 return element.append("use").attr("xlink:href", "#".concat(id)).attr("class", cssClassFn).style("fill", fillStyleFn).node();
8185 },
8186 update: function update(element, xPosFn, yPosFn, opacityStyleFn, fillStyleFn, withTransition, flow, selectedCircles) {
8187 var $$ = this,
8188 _element$node$getBBox = element.node().getBBox(),
8189 width = _element$node$getBBox.width,
8190 height = _element$node$getBBox.height,
8191 xPosFn2 = function (d) {
8192 return xPosFn(d) - width / 2;
8193 },
8194 yPosFn2 = function (d) {
8195 return yPosFn(d) - height / 2;
8196 },
8197 mainCircles = element;
8198
8199 if (withTransition) {
8200 var transitionName = $$.getTransitionName();
8201 flow && (mainCircles = element.attr("x", xPosFn2)), mainCircles = element.transition(transitionName).attr("x", xPosFn2).attr("y", yPosFn2).transition(transitionName), selectedCircles.transition($$.getTransitionName());
8202 } else mainCircles = element.attr("x", xPosFn2).attr("y", yPosFn2);
8203
8204 return mainCircles.style("opacity", opacityStyleFn).style("fill", fillStyleFn);
8205 }
8206 },
8207 // 'circle' data point
8208 circle: {
8209 create: function create(element, cssClassFn, sizeFn, fillStyleFn) {
8210 return element.append("circle").attr("class", cssClassFn).attr("r", sizeFn).style("fill", fillStyleFn).node();
8211 },
8212 update: function update(element, xPosFn, yPosFn, opacityStyleFn, fillStyleFn, withTransition, flow, selectedCircles) {
8213 var $$ = this,
8214 mainCircles = element;
8215
8216 if ($$.hasType("bubble") && (mainCircles = mainCircles.attr("r", $$.pointR.bind($$))), withTransition) {
8217 var transitionName = $$.getTransitionName();
8218 flow && (mainCircles = mainCircles.attr("cx", xPosFn)), mainCircles = element.attr("cx") ? mainCircles.transition(transitionName).attr("cx", xPosFn).attr("cy", yPosFn).transition(transitionName) : mainCircles.attr("cx", xPosFn).attr("cy", yPosFn), selectedCircles.transition($$.getTransitionName());
8219 } else mainCircles = mainCircles.attr("cx", xPosFn).attr("cy", yPosFn);
8220
8221 return mainCircles.style("opacity", opacityStyleFn).style("fill", fillStyleFn);
8222 }
8223 },
8224 // 'rectangle' data point
8225 rectangle: {
8226 create: function create(element, cssClassFn, sizeFn, fillStyleFn) {
8227 var rectSizeFn = function (d) {
8228 return sizeFn(d) * 2;
8229 };
8230
8231 return element.append("rect").attr("class", cssClassFn).attr("width", rectSizeFn).attr("height", rectSizeFn).style("fill", fillStyleFn).node();
8232 },
8233 update: function update(element, xPosFn, yPosFn, opacityStyleFn, fillStyleFn, withTransition, flow, selectedCircles) {
8234 var $$ = this,
8235 r = $$.config.point_r,
8236 rectXPosFn = function (d) {
8237 return xPosFn(d) - r;
8238 },
8239 rectYPosFn = function (d) {
8240 return yPosFn(d) - r;
8241 },
8242 mainCircles = element;
8243
8244 if (withTransition) {
8245 var transitionName = $$.getTransitionName();
8246 flow && (mainCircles = mainCircles.attr("x", rectXPosFn)), mainCircles = mainCircles.transition(transitionName).attr("x", rectXPosFn).attr("y", rectYPosFn).transition(transitionName), selectedCircles.transition($$.getTransitionName());
8247 } else mainCircles = mainCircles.attr("x", rectXPosFn).attr("y", rectYPosFn);
8248
8249 return mainCircles.style("opacity", opacityStyleFn).style("fill", fillStyleFn);
8250 }
8251 }
8252});
8253// CONCATENATED MODULE: ./src/shape/radar.js
8254
8255
8256/**
8257 * Copyright (c) 2017 ~ present NAVER Corp.
8258 * billboard.js project is licensed under the MIT license
8259 */
8260
8261
8262
8263
8264
8265/**
8266 * Get the position value
8267 * @param {Boolean} isClockwise If the direction is clockwise
8268 * @param {String} type Coordinate type 'x' or 'y'
8269 * @param {Number} edge Number of edge
8270 * @param {Number} pos The indexed position
8271 * @param {Number} range
8272 * @param {Number} ratio
8273 * @return {number}
8274 * @private
8275 */
8276
8277function getPosition(isClockwise, type, edge, pos, range, ratio) {
8278 var index = isClockwise && pos > 0 ? edge - pos : pos,
8279 r = 2 * Math.PI,
8280 func = type === "x" ? Math.sin : Math.cos;
8281 return range * (1 - ratio * func(index * r / edge));
8282} // cache key
8283
8284
8285var radar_cacheKey = "$radarPoints";
8286extend(ChartInternal_ChartInternal.prototype, {
8287 initRadar: function initRadar() {
8288 var $$ = this,
8289 config = $$.config;
8290 $$.hasType("radar") && ($$.radars = $$.main.select(".".concat(config_classes.chart)).append("g").attr("class", config_classes.chartRadars), $$.radars.levels = $$.radars.append("g").attr("class", config_classes.levels), $$.radars.axes = $$.radars.append("g").attr("class", config_classes.axis), $$.radars.shapes = $$.radars.append("g").attr("class", config_classes.shapes), $$.maxValue = config.radar_axis_max || $$.getMinMaxData().max[0].value);
8291 },
8292 getRadarSize: function getRadarSize() {
8293 var $$ = this,
8294 config = $$.config,
8295 padding = config.axis_x_categories.length < 4 ? -20 : 10,
8296 size = (Math.min($$.arcWidth, $$.arcHeight) - padding) / 2;
8297 return [size, size];
8298 },
8299 updateTargetsForRadar: function updateTargetsForRadar(targets) {
8300 var $$ = this,
8301 config = $$.config;
8302 isEmpty(config.axis_x_categories) && (config.axis_x_categories = Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["range"])(0, Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["max"])(targets).values.length)), $$.generateRadarPoints();
8303 },
8304 getRadarPosition: function getRadarPosition(type, index, range, ratio) {
8305 var $$ = this,
8306 config = $$.config,
8307 _$$$getRadarSize = $$.getRadarSize(),
8308 _$$$getRadarSize2 = slicedToArray_default()(_$$$getRadarSize, 2),
8309 width = _$$$getRadarSize2[0],
8310 height = _$$$getRadarSize2[1],
8311 edge = config.axis_x_categories.length,
8312 isClockwise = config.radar_direction_clockwise,
8313 pos = toArray(type).map(function (v) {
8314 return getPosition(isClockwise, v, edge, index, isDefined(range) ? range : type === "x" ? width : height, ratio || config.radar_size_ratio);
8315 });
8316
8317 return pos.length === 1 ? pos[0] : pos;
8318 },
8319
8320 /**
8321 * Generate data points
8322 * @private
8323 */
8324 generateRadarPoints: function generateRadarPoints() {
8325 var $$ = this,
8326 targets = $$.data.targets,
8327 _$$$getRadarSize3 = $$.getRadarSize(),
8328 _$$$getRadarSize4 = slicedToArray_default()(_$$$getRadarSize3, 2),
8329 width = _$$$getRadarSize4[0],
8330 height = _$$$getRadarSize4[1],
8331 points = $$.getCache(radar_cacheKey) || {},
8332 size = points._size;
8333
8334 size && (size.width === width || size.height === height) || (targets.forEach(function (d) {
8335 points[d.id] = d.values.map(function (v, i) {
8336 return $$.getRadarPosition(["x", "y"], i, undefined, $$.getRatio("radar", v));
8337 });
8338 }), points._size = {
8339 width: width,
8340 height: height
8341 }, $$.addCache(radar_cacheKey, points));
8342 },
8343 redrawRadar: function redrawRadar(duration, durationForExit) {
8344 var $$ = this,
8345 translate = $$.getTranslate("radar");
8346 translate && ($$.radars.attr("transform", translate), $$.main.selectAll(".".concat(config_classes.circles)).attr("transform", translate), $$.main.select(".".concat(config_classes.chartTexts)).attr("transform", translate), $$.generateRadarPoints(), $$.updateRadarLevel(), $$.updateRadarAxes(), $$.updateRadarShape(duration, durationForExit));
8347 },
8348 generateGetRadarPoints: function generateGetRadarPoints() {
8349 var $$ = this,
8350 points = $$.getCache(radar_cacheKey);
8351 return function (d, i) {
8352 var point = points[d.id][i];
8353 return [point, point, point, point];
8354 };
8355 },
8356 updateRadarLevel: function updateRadarLevel() {
8357 var $$ = this,
8358 config = $$.config,
8359 _$$$getRadarSize5 = $$.getRadarSize(),
8360 _$$$getRadarSize6 = slicedToArray_default()(_$$$getRadarSize5, 2),
8361 width = _$$$getRadarSize6[0],
8362 height = _$$$getRadarSize6[1],
8363 depth = config.radar_level_depth,
8364 edge = config.axis_x_categories.length,
8365 showText = config.radar_level_text_show,
8366 radarLevels = $$.radars.levels,
8367 levelData = Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["range"])(0, depth),
8368 radius = config.radar_size_ratio * Math.min(width, height),
8369 levelRatio = levelData.map(function (l) {
8370 return radius * ((l + 1) / depth);
8371 }),
8372 levelTextFormat = config.radar_level_text_format,
8373 points = levelData.map(function (v) {
8374 var range = levelRatio[v],
8375 pos = Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["range"])(0, edge).map(function (i) {
8376 return $$.getRadarPosition(["x", "y"], i, range, 1).join(",");
8377 });
8378 return pos.join(" ");
8379 }),
8380 level = radarLevels.selectAll(".".concat(config_classes.level)).data(levelData);
8381
8382 level.exit().remove();
8383 var levelEnter = level.enter().append("g").attr("class", function (d, i) {
8384 return "".concat(config_classes.level, " ").concat(config_classes.level, "-").concat(i);
8385 });
8386 levelEnter.append("polygon").style("visibility", config.radar_level_show ? null : "hidden"), showText && (radarLevels.select("text").empty() && radarLevels.append("text").attr("dx", "-.5em").attr("dy", "-.7em").style("text-anchor", "end").text(function () {
8387 return levelTextFormat(0);
8388 }), levelEnter.append("text").attr("dx", "-.5em").style("text-anchor", "end").text(function (d) {
8389 return levelTextFormat($$.maxValue / levelData.length * (d + 1));
8390 })), levelEnter.merge(level).attr("transform", function (d) {
8391 return "translate(".concat(width - levelRatio[d], ", ").concat(height - levelRatio[d], ")");
8392 }).selectAll("polygon").attr("points", function (d) {
8393 return points[d];
8394 }), showText && radarLevels.selectAll("text").attr("x", function (d) {
8395 return isUndefined(d) ? width : points[d].split(",")[0];
8396 }).attr("y", function (d) {
8397 return isUndefined(d) ? height : 0;
8398 });
8399 },
8400 updateRadarAxes: function updateRadarAxes() {
8401 var $$ = this,
8402 config = $$.config,
8403 _$$$getRadarSize7 = $$.getRadarSize(),
8404 _$$$getRadarSize8 = slicedToArray_default()(_$$$getRadarSize7, 2),
8405 width = _$$$getRadarSize8[0],
8406 height = _$$$getRadarSize8[1],
8407 categories = config.axis_x_categories,
8408 axis = $$.radars.axes.selectAll("g").data(categories);
8409
8410 axis.exit().remove();
8411 var axisEnter = axis.enter().append("g").attr("class", function (d, i) {
8412 return "".concat(config_classes.axis, "-").concat(i);
8413 });
8414 config.radar_axis_line_show && axisEnter.append("line"), config.radar_axis_text_show && axisEnter.append("text"), axis = axisEnter.merge(axis), config.radar_axis_line_show && axis.select("line").attr("x1", width).attr("y1", height).attr("x2", function (d, i) {
8415 return $$.getRadarPosition("x", i);
8416 }).attr("y2", function (d, i) {
8417 return $$.getRadarPosition("y", i);
8418 }), config.radar_axis_text_show && axis.select("text").style("text-anchor", "middle").attr("dy", ".5em").text(function (d) {
8419 return d;
8420 }).datum(function (d, i) {
8421 return {
8422 index: i
8423 };
8424 }).attr("x", function (d, i) {
8425 return $$.getRadarPosition("x", i, undefined, 1);
8426 }).attr("y", function (d, i) {
8427 return $$.getRadarPosition("y", i, undefined, 1);
8428 }), $$.bindEvent();
8429 },
8430 bindEvent: function bindEvent() {
8431 var _this = this,
8432 $$ = this,
8433 config = $$.config;
8434
8435 if (config.interaction_enabled) {
8436 var isMouse = $$.inputType === "mouse";
8437 $$.radars.select(".".concat(config_classes.axis)).on("".concat(isMouse ? "mouseover " : "", "click"), function () {
8438 if (!$$.transiting) // skip while transiting
8439 {
8440 var target = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["event"].target),
8441 index = target.datum().index;
8442 $$.selectRectForSingle($$.svg.node(), null, index), $$.setOver(index);
8443 }
8444 }).on("mouseout", isMouse ? function () {
8445 _this.hideTooltip(), _this.unexpandCircles();
8446 } : null);
8447 }
8448 },
8449 updateRadarShape: function updateRadarShape(duration, durationForExit) {
8450 var $$ = this,
8451 targets = $$.data.targets,
8452 points = $$.getCache(radar_cacheKey),
8453 areas = $$.radars.shapes.selectAll("polygon").data(targets),
8454 areasEnter = areas.enter().append("g").attr("class", $$.classChartRadar.bind($$));
8455 areas.exit().transition().duration(durationForExit).remove(), areasEnter.append("polygon").merge(areas).transition().duration(duration).style("fill", function (d) {
8456 return $$.color(d);
8457 }).style("stroke", function (d) {
8458 return $$.color(d);
8459 }).attr("points", function (d) {
8460 return points[d.id].join(" ");
8461 });
8462 },
8463
8464 /**
8465 * Get data point x coordinate
8466 * @param {Object} d Data object
8467 * @return {Number}
8468 * @private
8469 */
8470 radarCircleX: function radarCircleX(d) {
8471 return this.getCache(radar_cacheKey)[d.id][d.index][0];
8472 },
8473
8474 /**
8475 * Get data point y coordinate
8476 * @param {Object} d Data object
8477 * @return {Number}
8478 * @private
8479 */
8480 radarCircleY: function radarCircleY(d) {
8481 return this.getCache(radar_cacheKey)[d.id][d.index][1];
8482 }
8483});
8484// CONCATENATED MODULE: ./src/internals/text.js
8485/**
8486 * Copyright (c) 2017 ~ present NAVER Corp.
8487 * billboard.js project is licensed under the MIT license
8488 */
8489
8490
8491
8492
8493extend(ChartInternal_ChartInternal.prototype, {
8494 /**
8495 * Initializes the text
8496 * @private
8497 */
8498 initText: function initText() {
8499 var $$ = this;
8500 $$.main.select(".".concat(config_classes.chart)).append("g").attr("class", config_classes.chartTexts), $$.mainText = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["selectAll"])([]);
8501 },
8502
8503 /**
8504 * Update chartText
8505 * @private
8506 * @param {Object} $$.data.targets
8507 */
8508 updateTargetsForText: function updateTargetsForText(targets) {
8509 var $$ = this,
8510 classChartText = $$.classChartText.bind($$),
8511 classTexts = $$.classTexts.bind($$),
8512 classFocus = $$.classFocus.bind($$),
8513 mainTextUpdate = $$.main.select(".".concat(config_classes.chartTexts)).selectAll(".".concat(config_classes.chartText)).data(targets).attr("class", function (d) {
8514 return classChartText(d) + classFocus(d);
8515 }),
8516 mainTextEnter = mainTextUpdate.enter().append("g").attr("class", classChartText).style("opacity", "0").style("pointer-events", "none");
8517 mainTextEnter.append("g").attr("class", classTexts);
8518 },
8519
8520 /**
8521 * Update text
8522 * @private
8523 * @param {Number} Fade-out transition duration
8524 */
8525 updateText: function updateText(durationForExit) {
8526 var _this = this,
8527 $$ = this,
8528 config = $$.config,
8529 dataFn = $$.labelishData.bind($$),
8530 classText = $$.classText.bind($$);
8531
8532 $$.mainText = $$.main.selectAll(".".concat(config_classes.texts)).selectAll(".".concat(config_classes.text)).data(function (d) {
8533 return _this.isRadarType(d) ? d.values : dataFn(d);
8534 }), $$.mainText.exit().transition().duration(durationForExit).style("fill-opacity", "0").remove(), $$.mainText = $$.mainText.enter().append("text").merge($$.mainText).attr("class", classText).attr("text-anchor", function (d) {
8535 return config.axis_rotated ? d.value < 0 ? "end" : "start" : "middle";
8536 }).style("stroke", "none").style("fill", function (d) {
8537 return $$.color(d);
8538 }).style("fill-opacity", "0").text(function (d, i, j) {
8539 return $$.dataLabelFormat(d.id)(d.value, d.id, i, j);
8540 });
8541 },
8542
8543 /**
8544 * Redraw chartText
8545 * @private
8546 * @param {Number} x Attribute
8547 * @param {Number} y Attribute
8548 * @param {Object} options.flow
8549 * @param {Boolean} indicates transition is enabled
8550 * @returns {Object} $$.mainText
8551 */
8552 redrawText: function redrawText(xForText, yForText, forFlow, withTransition) {
8553 return [(withTransition ? this.mainText.transition() : this.mainText).attr("x", xForText).attr("y", yForText).style("fill", this.color).style("fill-opacity", forFlow ? 0 : this.opacityForText.bind(this))];
8554 },
8555
8556 /**
8557 * Gets the getBoundingClientRect value of the element
8558 * @private
8559 * @param {HTMLElement|d3.selection} textVal
8560 * @param {String} className
8561 * @param {HTMLElement|d3.selection} elementVal
8562 * @returns {Object} value of element.getBoundingClientRect()
8563 */
8564 getTextRect: function getTextRect(textVal, className, elementVal) {
8565 var rect,
8566 text = (textVal.node ? textVal.node() : textVal).textContent,
8567 element = elementVal.node ? elementVal.node() : elementVal,
8568 dummy = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])("body").append("div").classed("bb", !0),
8569 svg = dummy.append("svg").style("visibility", "hidden").style("position", "fixed").style("top", "0px").style("left", "0px"),
8570 font = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(element).style("font");
8571 return svg.selectAll(".dummy").data([text]).enter().append("text").classed(className, !!className).style("font", font).text(text).each(function () {
8572 rect = this.getBoundingClientRect();
8573 }), dummy.remove(), rect;
8574 },
8575
8576 /**
8577 * Gets the x or y coordinate of the text
8578 * @private
8579 * @param {Object} area Indices
8580 * @param {Object} bar Indices
8581 * @param {Object} line Indices
8582 * @param {Boolean} whether or not to x
8583 * @returns {Number} coordinates
8584 */
8585 generateXYForText: function generateXYForText(areaIndices, barIndices, lineIndices, forX) {
8586 var $$ = this,
8587 getAreaPoints = $$.generateGetAreaPoints(areaIndices, !1),
8588 getBarPoints = $$.generateGetBarPoints(barIndices, !1),
8589 getLinePoints = $$.generateGetLinePoints(lineIndices, !1),
8590 getRadarPoints = $$.generateGetRadarPoints(),
8591 getter = forX ? $$.getXForText : $$.getYForText;
8592 return function (d, i) {
8593 var getPoints = $$.isAreaType(d) && getAreaPoints || $$.isBarType(d) && getBarPoints || $$.isRadarType(d) && getRadarPoints || getLinePoints;
8594 return getter.call($$, getPoints(d, i), d, this);
8595 };
8596 },
8597
8598 /**
8599 * Gets the x coordinate of the text
8600 * @private
8601 * @param {Object} points
8602 * @param {Object} data
8603 * @param {HTMLElement} element
8604 * @returns {Number} x coordinate
8605 */
8606 getXForText: function getXForText(points, d, textElement) {
8607 var xPos,
8608 padding,
8609 $$ = this,
8610 config = $$.config;
8611 return config.axis_rotated ? (padding = $$.isBarType(d) ? 4 : 6, xPos = points[2][1] + padding * (d.value < 0 ? -1 : 1)) : xPos = $$.hasType("bar") ? (points[2][0] + points[0][0]) / 2 : points[0][0], d.value === null && (xPos > $$.width ? xPos = $$.width - textElement.getBoundingClientRect().width : xPos < 0 && (xPos = 4)), xPos + (config.data_labels_position.x || 0);
8612 },
8613
8614 /**
8615 * Gets the y coordinate of the text
8616 * @private
8617 * @param {Object} points
8618 * @param {Object} data
8619 * @param {HTMLElement} element
8620 * @returns {Number} y coordinate
8621 */
8622 getYForText: function getYForText(points, d, textElement) {
8623 var yPos,
8624 $$ = this,
8625 config = $$.config,
8626 r = config.point_r,
8627 baseY = 3;
8628 if (config.axis_rotated) yPos = (points[0][0] + points[2][0] + textElement.getBoundingClientRect().height * .6) / 2;else if (yPos = points[2][1], isNumber(r) && r > 5 && ($$.isLineType(d) || $$.isScatterType(d)) && (baseY += config.point_r / 2.3), d.value < 0 || d.value === 0 && !$$.hasPositiveValue) yPos += textElement.getBoundingClientRect().height, $$.isBarType(d) && $$.isSafari() ? yPos -= baseY : !$$.isBarType(d) && $$.isChrome() && (yPos += baseY);else {
8629 var diff = -baseY * 2;
8630 $$.isBarType(d) ? diff = -baseY : $$.isBubbleType(d) && (diff = baseY), yPos += diff;
8631 } // show labels regardless of the domain if value is null
8632
8633 if (d.value === null && !config.axis_rotated) {
8634 var boxHeight = textElement.getBoundingClientRect().height;
8635 yPos < boxHeight ? yPos = boxHeight : yPos > this.height && (yPos = this.height - 4);
8636 }
8637
8638 return yPos + (config.data_labels_position.y || 0);
8639 }
8640});
8641// CONCATENATED MODULE: ./src/internals/type.js
8642/**
8643 * Copyright (c) 2017 ~ present NAVER Corp.
8644 * billboard.js project is licensed under the MIT license
8645 */
8646
8647
8648extend(ChartInternal_ChartInternal.prototype, {
8649 setTargetType: function setTargetType(targetIds, type) {
8650 var $$ = this,
8651 config = $$.config;
8652 $$.mapToTargetIds(targetIds).forEach(function (id) {
8653 $$.withoutFadeIn[id] = type === config.data_types[id], config.data_types[id] = type;
8654 }), targetIds || (config.data_type = type);
8655 },
8656 hasType: function hasType(type, targetsValue) {
8657 var $$ = this,
8658 types = $$.config.data_types,
8659 targets = targetsValue || $$.data.targets,
8660 has = !1;
8661 return targets && targets.length ? targets.forEach(function (target) {
8662 var t = types[target.id];
8663 (t && t.indexOf(type) >= 0 || !t && type === "line") && (has = !0);
8664 }) : Object.keys(types).length ? Object.keys(types).forEach(function (id) {
8665 types[id] === type && (has = !0);
8666 }) : has = $$.config.data_type === type, has;
8667 },
8668
8669 /**
8670 * Check if contains arc types chart
8671 * @param {Object} targets
8672 * @param {Array} exclude Excluded types
8673 * @return {boolean}
8674 * @private
8675 */
8676 hasArcType: function hasArcType(targets) {
8677 var _this = this,
8678 exclude = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [],
8679 types = ["pie", "donut", "gauge", "radar"].filter(function (v) {
8680 return exclude.indexOf(v) === -1;
8681 });
8682
8683 return !types.every(function (v) {
8684 return !_this.hasType(v, targets);
8685 });
8686 },
8687 isLineType: function isLineType(d) {
8688 var id = isString(d) ? d : d.id;
8689 return !this.config.data_types[id] || this.isTypeOf(id, ["line", "spline", "area", "area-spline", "area-spline-range", "area-line-range", "step", "area-step"]);
8690 },
8691 isTypeOf: function isTypeOf(d, type) {
8692 var id = isString(d) ? d : d.id,
8693 dataType = this.config.data_types[id];
8694 return isArray(type) ? type.indexOf(dataType) >= 0 : dataType === type;
8695 },
8696 isStepType: function isStepType(d) {
8697 return this.isTypeOf(d, ["step", "area-step"]);
8698 },
8699 isSplineType: function isSplineType(d) {
8700 return this.isTypeOf(d, ["spline", "area-spline", "area-spline-range"]);
8701 },
8702 isAreaType: function isAreaType(d) {
8703 return this.isTypeOf(d, ["area", "area-spline", "area-spline-range", "area-line-range", "area-step"]);
8704 },
8705 isAreaRangeType: function isAreaRangeType(d) {
8706 return this.isTypeOf(d, ["area-spline-range", "area-line-range"]);
8707 },
8708 isBarType: function isBarType(d) {
8709 return this.isTypeOf(d, "bar");
8710 },
8711 isBubbleType: function isBubbleType(d) {
8712 return this.isTypeOf(d, "bubble");
8713 },
8714 isScatterType: function isScatterType(d) {
8715 return this.isTypeOf(d, "scatter");
8716 },
8717 isPieType: function isPieType(d) {
8718 return this.isTypeOf(d, "pie");
8719 },
8720 isGaugeType: function isGaugeType(d) {
8721 return this.isTypeOf(d, "gauge");
8722 },
8723 isDonutType: function isDonutType(d) {
8724 return this.isTypeOf(d, "donut");
8725 },
8726 isRadarType: function isRadarType(d) {
8727 return this.isTypeOf(d, "radar");
8728 },
8729 isArcType: function isArcType(d) {
8730 return this.isPieType(d) || this.isDonutType(d) || this.isGaugeType(d) || this.isRadarType(d);
8731 },
8732 // determine if is 'circle' data point
8733 isCirclePoint: function isCirclePoint() {
8734 var config = this.config,
8735 pattern = config.point_pattern;
8736 return config.point_type === "circle" && (!pattern || isArray(pattern) && pattern.length === 0);
8737 },
8738 lineData: function lineData(d) {
8739 return this.isLineType(d) ? [d] : [];
8740 },
8741 arcData: function arcData(d) {
8742 return this.isArcType(d.data) ? [d] : [];
8743 },
8744 barData: function barData(d) {
8745 return this.isBarType(d) ? d.values : [];
8746 },
8747
8748 /**
8749 * Get data adapt for data label showing
8750 * @param {Object} d Data object
8751 * @return {Array}
8752 * @private
8753 */
8754 labelishData: function labelishData(d) {
8755 return this.isBarType(d) || this.isLineType(d) || this.isScatterType(d) || this.isBubbleType(d) || this.isRadarType(d) ? d.values : [];
8756 },
8757 barLineBubbleData: function barLineBubbleData(d) {
8758 return this.isBarType(d) || this.isLineType(d) || this.isBubbleType(d) ? d.values : [];
8759 },
8760 // https://github.com/d3/d3-shape#curves
8761 isInterpolationType: function isInterpolationType(type) {
8762 return ["basis", "basis-closed", "basis-open", "bundle", "cardinal", "cardinal-closed", "cardinal-open", "catmull-rom", "catmull-rom-closed", "catmull-rom-open", "linear", "linear-closed", "monotone-x", "monotone-y", "natural"].indexOf(type) >= 0;
8763 }
8764});
8765// CONCATENATED MODULE: ./src/internals/grid.js
8766/**
8767 * Copyright (c) 2017 ~ present NAVER Corp.
8768 * billboard.js project is licensed under the MIT license
8769 */
8770
8771
8772
8773 // Grid position and text anchor helpers
8774
8775var getGridTextAnchor = function (d) {
8776 return isValue(d.position) || "end";
8777},
8778 getGridTextDx = function (d) {
8779 return d.position === "start" ? 4 : d.position === "middle" ? 0 : -4;
8780},
8781 getGridTextX = function (isX, width, height) {
8782 return function (d) {
8783 var x = isX ? 0 : width;
8784 return d.position === "start" ? x = isX ? -height : 0 : d.position === "middle" && (x = (isX ? -height : width) / 2), x;
8785 };
8786};
8787
8788extend(ChartInternal_ChartInternal.prototype, {
8789 initGrid: function initGrid() {
8790 var $$ = this,
8791 config = $$.config;
8792 $$.xgrid = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["selectAll"])([]), config.grid_lines_front || $$.initGridLines(), config.grid_front || $$.initXYFocusGrid();
8793 },
8794 initGridLines: function initGridLines() {
8795 var $$ = this;
8796 $$.gridLines = $$.main.append("g").attr("clip-path", $$.clipPathForGrid).attr("class", "".concat(config_classes.grid, " ").concat(config_classes.gridLines)), $$.gridLines.append("g").attr("class", config_classes.xgridLines), $$.gridLines.append("g").attr("class", config_classes.ygridLines), $$.xgridLines = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["selectAll"])([]);
8797 },
8798 updateXGrid: function updateXGrid(withoutUpdate) {
8799 var $$ = this,
8800 config = $$.config,
8801 isRotated = config.axis_rotated,
8802 xgridData = $$.generateGridData(config.grid_x_type, $$.x),
8803 tickOffset = $$.isCategorized() ? $$.xAxis.tickOffset() : 0;
8804 $$.xgridAttr = isRotated ? {
8805 "x1": 0,
8806 "x2": $$.width,
8807 "y1": function y1(d) {
8808 return $$.x(d) - tickOffset;
8809 },
8810 "y2": function y2(d) {
8811 return $$.x(d) - tickOffset;
8812 }
8813 } : {
8814 "x1": function x1(d) {
8815 return $$.x(d) + tickOffset;
8816 },
8817 "x2": function x2(d) {
8818 return $$.x(d) + tickOffset;
8819 },
8820 "y1": 0,
8821 "y2": $$.height
8822 }, $$.xgrid = $$.main.select(".".concat(config_classes.xgrids)).selectAll(".".concat(config_classes.xgrid)).data(xgridData), $$.xgrid.exit().remove(), $$.xgrid = $$.xgrid.enter().append("line").attr("class", config_classes.xgrid).merge($$.xgrid), withoutUpdate || $$.xgrid.each(function () {
8823 var grid = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this);
8824 Object.keys($$.xgridAttr).forEach(function (id) {
8825 grid.attr(id, $$.xgridAttr[id]).style("opacity", function () {
8826 return grid.attr(isRotated ? "y1" : "x1") === (isRotated ? $$.height : 0) ? "0" : "1";
8827 });
8828 });
8829 });
8830 },
8831 updateYGrid: function updateYGrid() {
8832 var $$ = this,
8833 config = $$.config,
8834 isRotated = config.axis_rotated,
8835 gridValues = $$.yAxis.tickValues() || $$.y.ticks(config.grid_y_ticks);
8836 $$.ygrid = $$.main.select(".".concat(config_classes.ygrids)).selectAll(".".concat(config_classes.ygrid)).data(gridValues), $$.ygrid.exit().remove(), $$.ygrid = $$.ygrid.enter().append("line").attr("class", config_classes.ygrid).merge($$.ygrid), $$.ygrid.attr("x1", isRotated ? $$.y : 0).attr("x2", isRotated ? $$.y : $$.width).attr("y1", isRotated ? 0 : $$.y).attr("y2", isRotated ? $$.height : $$.y), $$.smoothLines($$.ygrid, "grid");
8837 },
8838 updateGrid: function updateGrid(duration) {
8839 var $$ = this; // hide if arc type
8840
8841 $$.grid.style("visibility", $$.hasArcType() ? "hidden" : "visible"), $$.main.select("line.".concat(config_classes.xgridFocus)).style("visibility", "hidden"), $$.updateXGridLines(duration), $$.updateYGridLines(duration);
8842 },
8843
8844 /**
8845 * Update X Grid lines
8846 * @param {Number} duration
8847 * @private
8848 */
8849 updateXGridLines: function updateXGridLines(duration) {
8850 var $$ = this,
8851 main = $$.main,
8852 config = $$.config,
8853 isRotated = config.axis_rotated;
8854 config.grid_x_show && $$.updateXGrid(), $$.xgridLines = main.select(".".concat(config_classes.xgridLines)).selectAll(".".concat(config_classes.xgridLine)).data(config.grid_x_lines), $$.xgridLines.exit().transition().duration(duration).style("opacity", "0").remove();
8855 // enter
8856 var xgridLine = $$.xgridLines.enter().append("g");
8857 xgridLine.append("line").style("opacity", "0"), xgridLine.append("text").attr("transform", isRotated ? "" : "rotate(-90)").attr("dy", -5).style("opacity", "0"), $$.xgridLines = xgridLine.merge($$.xgridLines), $$.xgridLines.attr("class", function (d) {
8858 return "".concat(config_classes.xgridLine, " ").concat(d.class || "").trim();
8859 }).select("text").attr("text-anchor", getGridTextAnchor).attr("dx", getGridTextDx).transition().duration(duration).text(function (d) {
8860 return d.text;
8861 }).transition().style("opacity", "1");
8862 },
8863
8864 /**
8865 * Update Y Grid lines
8866 * @param {Number} duration
8867 * @private
8868 */
8869 updateYGridLines: function updateYGridLines(duration) {
8870 var $$ = this,
8871 main = $$.main,
8872 config = $$.config,
8873 isRotated = config.axis_rotated;
8874 config.grid_y_show && $$.updateYGrid(), $$.ygridLines = main.select(".".concat(config_classes.ygridLines)).selectAll(".".concat(config_classes.ygridLine)).data(config.grid_y_lines), $$.ygridLines.exit().transition().duration(duration).style("opacity", "0").remove();
8875 // enter
8876 var ygridLine = $$.ygridLines.enter().append("g");
8877 ygridLine.append("line").style("opacity", "0"), ygridLine.append("text").attr("transform", isRotated ? "rotate(-90)" : "").style("opacity", "0"), $$.ygridLines = ygridLine.merge($$.ygridLines);
8878 // update
8879 var yv = $$.yv.bind($$);
8880 $$.ygridLines.attr("class", function (d) {
8881 return "".concat(config_classes.ygridLine, " ").concat(d.class || "").trim();
8882 }).select("line").transition().duration(duration).attr("x1", isRotated ? yv : 0).attr("x2", isRotated ? yv : $$.width).attr("y1", isRotated ? 0 : yv).attr("y2", isRotated ? $$.height : yv).transition().style("opacity", "1"), $$.ygridLines.select("text").attr("text-anchor", getGridTextAnchor).attr("dx", getGridTextDx).transition().duration(duration).attr("dy", -5).attr("x", getGridTextX(isRotated, $$.width, $$.height)).attr("y", yv).text(function (d) {
8883 return d.text;
8884 }).transition().style("opacity", "1");
8885 },
8886 redrawGrid: function redrawGrid(withTransition) {
8887 var $$ = this,
8888 isRotated = $$.config.axis_rotated,
8889 xv = $$.xv.bind($$),
8890 lines = $$.xgridLines.select("line"),
8891 texts = $$.xgridLines.select("text");
8892 return lines = (withTransition ? lines.transition() : lines).attr("x1", isRotated ? 0 : xv).attr("x2", isRotated ? $$.width : xv).attr("y1", isRotated ? xv : 0).attr("y2", isRotated ? xv : $$.height), texts = (withTransition ? texts.transition() : texts).attr("x", getGridTextX(!isRotated, $$.width, $$.height)).attr("y", xv).text(function (d) {
8893 return d.text;
8894 }), [(withTransition ? lines.transition() : lines).style("opacity", "1"), (withTransition ? texts.transition() : texts).style("opacity", "1")];
8895 },
8896 initXYFocusGrid: function initXYFocusGrid() {
8897 var $$ = this,
8898 config = $$.config;
8899 $$.grid = $$.main.append("g").attr("clip-path", $$.clipPathForGrid).attr("class", config_classes.grid), config.grid_x_show && $$.grid.append("g").attr("class", config_classes.xgrids), config.grid_y_show && $$.grid.append("g").attr("class", config_classes.ygrids), config.grid_focus_show && $$.grid.append("g").attr("class", config_classes.xgridFocus).append("line").attr("class", config_classes.xgridFocus);
8900 },
8901 showXGridFocus: function showXGridFocus(selectedData) {
8902 var $$ = this,
8903 config = $$.config,
8904 isRotated = config.axis_rotated,
8905 dataToShow = selectedData.filter(function (d) {
8906 return d && isValue($$.getBaseValue(d));
8907 }),
8908 focusEl = $$.main.selectAll("line.".concat(config_classes.xgridFocus)),
8909 xx = $$.xx.bind($$);
8910 !config.tooltip_show || $$.hasType("bubble") || $$.hasType("scatter") || $$.hasArcType() || (focusEl.style("visibility", "visible").data([dataToShow[0]]).attr(isRotated ? "y1" : "x1", xx).attr(isRotated ? "y2" : "x2", xx), $$.smoothLines(focusEl, "grid")); // Hide when bubble/scatter plot exists
8911 },
8912 hideXGridFocus: function hideXGridFocus() {
8913 this.main.select("line.".concat(config_classes.xgridFocus)).style("visibility", "hidden");
8914 },
8915 updateXgridFocus: function updateXgridFocus() {
8916 var $$ = this,
8917 isRotated = $$.config.axis_rotated;
8918 $$.main.select("line.".concat(config_classes.xgridFocus)).attr("x1", isRotated ? 0 : -10).attr("x2", isRotated ? $$.width : -10).attr("y1", isRotated ? -10 : 0).attr("y2", isRotated ? -10 : $$.height);
8919 },
8920 generateGridData: function generateGridData(type, scale) {
8921 var $$ = this,
8922 tickNum = $$.main.select(".".concat(config_classes.axisX)).selectAll(".tick").size(),
8923 gridData = [];
8924
8925 if (type === "year") {
8926 var xDomain = $$.getXDomain(),
8927 firstYear = xDomain[0].getFullYear(),
8928 lastYear = xDomain[1].getFullYear();
8929
8930 for (var i = firstYear; i <= lastYear; i++) gridData.push(new Date("".concat(i, "-01-01 00:00:00")));
8931 } else gridData = scale.ticks(10), gridData.length > tickNum && (gridData = gridData.filter(function (d) {
8932 return (d + "").indexOf(".") < 0;
8933 }));
8934
8935 return gridData;
8936 },
8937 getGridFilterToRemove: function getGridFilterToRemove(params) {
8938 return params ? function (line) {
8939 var found = !1;
8940 return (isArray(params) ? params.concat() : [params]).forEach(function (param) {
8941 ("value" in param && line.value === param.value || "class" in param && line.class === param.class) && (found = !0);
8942 }), found;
8943 } : function () {
8944 return !0;
8945 };
8946 },
8947 removeGridLines: function removeGridLines(params, forX) {
8948 var $$ = this,
8949 config = $$.config,
8950 toRemove = $$.getGridFilterToRemove(params),
8951 classLines = forX ? config_classes.xgridLines : config_classes.ygridLines,
8952 classLine = forX ? config_classes.xgridLine : config_classes.ygridLine;
8953 $$.main.select(".".concat(classLines)).selectAll(".".concat(classLine)).filter(toRemove).transition().duration(config.transition_duration).style("opacity", "0").remove();
8954 var gridLines = "grid_".concat(forX ? "x" : "y", "_lines");
8955 config[gridLines] = config[gridLines].filter(function toShow(line) {
8956 return !toRemove(line);
8957 });
8958 }
8959});
8960// CONCATENATED MODULE: ./src/internals/tooltip.js
8961
8962
8963
8964/**
8965 * Copyright (c) 2017 ~ present NAVER Corp.
8966 * billboard.js project is licensed under the MIT license
8967 */
8968
8969
8970
8971
8972extend(ChartInternal_ChartInternal.prototype, {
8973 /**
8974 * Initializes the tooltip
8975 * @private
8976 */
8977 initTooltip: function initTooltip() {
8978 var $$ = this,
8979 config = $$.config;
8980
8981 // Show tooltip if needed
8982 if ($$.tooltip = $$.selectChart.style("position", "relative").append("div").attr("class", config_classes.tooltipContainer).style("position", "absolute").style("pointer-events", "none").style("display", "none"), config.tooltip_init_show) {
8983 if ($$.isTimeSeries() && isString(config.tooltip_init_x)) {
8984 var i,
8985 val,
8986 targets = $$.data.targets[0];
8987
8988 for (config.tooltip_init_x = $$.parseDate(config.tooltip_init_x), i = 0; (val = targets.values[i]) && val.x - config.tooltip_init_x !== 0; i++);
8989
8990 config.tooltip_init_x = i;
8991 }
8992
8993 $$.tooltip.html(config.tooltip_contents.call($$, $$.data.targets.map(function (d) {
8994 return $$.addName(d.values[config.tooltip_init_x]);
8995 }), $$.axis.getXAxisTickFormat(), $$.getYFormat($$.hasArcType(null, ["radar"])), $$.color)), $$.tooltip.style("top", config.tooltip_init_position.top).style("left", config.tooltip_init_position.left).style("display", "block");
8996 }
8997 },
8998
8999 /**
9000 * Returns the tooltip content(HTML string)
9001 * @param {Object} d data
9002 * @param {Function} defaultTitleFormat Default title format
9003 * @param {Function} defaultValueFormat Default format for each data value in the tooltip.
9004 * @param {Function} color Color function
9005 * @returns {String} html
9006 * @private
9007 */
9008 getTooltipContent: function getTooltipContent(d, defaultTitleFormat, defaultValueFormat, color) {
9009 var $$ = this,
9010 config = $$.config,
9011 titleFormat = config.tooltip_format_title || defaultTitleFormat,
9012 nameFormat = config.tooltip_format_name || function (name) {
9013 return name;
9014 },
9015 valueFormat = config.tooltip_format_value || ($$.isStackNormalized() ? function (v, ratio) {
9016 return "".concat((ratio * 100).toFixed(2), "%");
9017 } : defaultValueFormat),
9018 order = config.tooltip_order,
9019 getRowValue = function (row) {
9020 return $$.getBaseValue(row);
9021 },
9022 getBgColor = $$.levelColor ? function (row) {
9023 return $$.levelColor(row.value);
9024 } : function (row) {
9025 return color(row.id);
9026 };
9027
9028 if (order === null && config.data_groups.length) {
9029 // for stacked data, order should aligned with the visually displayed data
9030 var ids = $$.orderTargets($$.data.targets).map(function (i2) {
9031 return i2.id;
9032 }).reverse();
9033 d.sort(function (a, b) {
9034 var v1 = a ? a.value : null,
9035 v2 = b ? b.value : null;
9036 return v1 > 0 && v2 > 0 && (v1 = a.id ? ids.indexOf(a.id) : null, v2 = b.id ? ids.indexOf(b.id) : null), v1 - v2;
9037 });
9038 } else if (/^(asc|desc)$/.test(order)) {
9039 d.sort(function (a, b) {
9040 var v1 = a ? getRowValue(a) : null,
9041 v2 = b ? getRowValue(b) : null;
9042 return order === "asc" ? v1 - v2 : v2 - v1;
9043 });
9044 } else isFunction(order) && d.sort(order);
9045
9046 var text, row, param, value;
9047
9048 for (var i = 0, len = d.length; i < len; i++) if ((row = d[i]) && (getRowValue(row) || getRowValue(row) === 0)) {
9049 if (!text) {
9050 var title = sanitise(titleFormat ? titleFormat(row.x) : row.x);
9051 text = "<table class=\"".concat($$.CLASS.tooltip, "\">").concat(isValue(title) ? "<tr><th colspan=\"2\">".concat(title, "</th></tr>") : "");
9052 }
9053
9054 if (param = [row.ratio, row.id, row.index, d], value = sanitise(valueFormat.apply(void 0, [getRowValue(row)].concat(toConsumableArray_default()(param)))), $$.isAreaRangeType(row)) {
9055 var _map = ["high", "low"].map(function (v) {
9056 return sanitise(valueFormat.apply(void 0, [$$.getAreaRangeData(row, v)].concat(toConsumableArray_default()(param))));
9057 }),
9058 _map2 = slicedToArray_default()(_map, 2),
9059 high = _map2[0],
9060 low = _map2[1];
9061
9062 value = "<b>Mid:</b> ".concat(value, " <b>High:</b> ").concat(high, " <b>Low:</b> ").concat(low);
9063 }
9064
9065 if (value !== undefined) {
9066 // Skip elements when their name is set to null
9067 if (row.name === null) continue;
9068 var name = sanitise(nameFormat.apply(void 0, [row.name].concat(toConsumableArray_default()(param)))),
9069 bgcolor = getBgColor(row);
9070 text += "<tr class=\"".concat($$.CLASS.tooltipName).concat($$.getTargetSelectorSuffix(row.id), "\"><td class=\"name\">"), text += $$.patterns ? "<svg><rect style=\"fill:".concat(bgcolor, "\" width=\"10\" height=\"10\"></rect></svg>") : "<span style=\"background-color:".concat(bgcolor, "\"></span>"), text += "".concat(name, "</td><td class=\"value\">").concat(value, "</td></tr>");
9071 }
9072 }
9073
9074 return "".concat(text, "</table>");
9075 },
9076
9077 /**
9078 * Returns the position of the tooltip
9079 * @param {Object} dataToShow data
9080 * @param {String} tWidth Width value of tooltip element
9081 * @param {String} tHeight Height value of tooltip element
9082 * @param {HTMLElement} element
9083 * @returns {Object} top, left value
9084 * @private
9085 */
9086 tooltipPosition: function tooltipPosition(dataToShow, tWidth, tHeight, element) {
9087 var $$ = this,
9088 config = $$.config,
9089 _d3Mouse = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["mouse"])(element),
9090 _d3Mouse2 = slicedToArray_default()(_d3Mouse, 2),
9091 left = _d3Mouse2[0],
9092 top = _d3Mouse2[1],
9093 svgLeft = $$.getSvgLeft(!0),
9094 chartRight = svgLeft + $$.currentWidth - $$.getCurrentPaddingRight();
9095
9096 // Determine tooltip position
9097 if (top += 20, $$.hasArcType()) {
9098 var raw = $$.inputType === "touch" || $$.hasType("radar");
9099 raw || (top += $$.height / 2, left += ($$.width - ($$.isLegendRight ? $$.getLegendWidth() : 0)) / 2);
9100 } else {
9101 var dataScale = $$.x(dataToShow[0].x);
9102 config.axis_rotated ? (top = dataScale + 20, left += svgLeft + 100, chartRight -= svgLeft) : (top -= 5, left = svgLeft + $$.getCurrentPaddingLeft(!0) + 20 + ($$.zoomScale ? left : dataScale));
9103 }
9104
9105 var right = left + tWidth;
9106 return right > chartRight && (left -= right - chartRight + 20), top + tHeight > $$.currentHeight && (top -= tHeight + 30), top < 0 && (top = 0), {
9107 top: top,
9108 left: left
9109 };
9110 },
9111
9112 /**
9113 * Show the tooltip
9114 * @private
9115 * @param {Object} selectedData
9116 * @param {HTMLElement} element
9117 */
9118 showTooltip: function showTooltip(selectedData, element) {
9119 var $$ = this,
9120 config = $$.config,
9121 forArc = $$.hasArcType(null, ["radar"]),
9122 dataToShow = selectedData.filter(function (d) {
9123 return d && isValue($$.getBaseValue(d));
9124 }),
9125 positionFunction = config.tooltip_position || $$.tooltipPosition;
9126
9127 if (dataToShow.length !== 0 && config.tooltip_show) {
9128 var datum = $$.tooltip.datum(),
9129 dataStr = JSON.stringify(selectedData),
9130 width = datum && datum.width || 0,
9131 height = datum && datum.height || 0;
9132
9133 if (!datum || datum.current !== dataStr) {
9134 var index = selectedData.concat().sort()[0].index,
9135 html = config.tooltip_contents.call($$, selectedData, $$.axis.getXAxisTickFormat(), $$.getYFormat(forArc), $$.color);
9136 callFn(config.tooltip_onshow, $$), $$.tooltip.html(html).style("display", "block").datum({
9137 index: index,
9138 current: dataStr,
9139 width: width = $$.tooltip.property("offsetWidth"),
9140 height: height = $$.tooltip.property("offsetHeight")
9141 }), callFn(config.tooltip_onshown, $$), $$._handleLinkedCharts(!0, index);
9142 } // Get tooltip dimensions
9143
9144
9145 var position = positionFunction.call(this, dataToShow, width, height, element); // Set tooltip position
9146
9147 $$.tooltip.style("top", "".concat(position.top, "px")).style("left", "".concat(position.left, "px"));
9148 }
9149 },
9150
9151 /**
9152 * Hide the tooltip
9153 * @private
9154 */
9155 hideTooltip: function hideTooltip() {
9156 var $$ = this,
9157 config = $$.config;
9158 // hide tooltip
9159 callFn(config.tooltip_onhide, $$), this.tooltip.style("display", "none").datum(null), callFn(config.tooltip_onhidden, $$);
9160 },
9161
9162 /**
9163 * Toggle display for linked chart instances
9164 * @param {Boolean} show true: show, false: hide
9165 * @param {Number} index x Axis index
9166 * @private
9167 */
9168 _handleLinkedCharts: function _handleLinkedCharts(show, index) {
9169 var $$ = this;
9170
9171 if ($$.config.tooltip_linked) {
9172 var linkedName = $$.config.tooltip_linked_name;
9173 ($$.api.internal.charts || []).forEach(function (c) {
9174 if (c !== $$.api) {
9175 var _config = c.internal.config,
9176 isLinked = _config.tooltip_linked,
9177 name = _config.tooltip_linked_name,
9178 isInDom = document.body.contains(c.element);
9179
9180 if (isLinked && linkedName === name && isInDom) {
9181 var data = c.internal.tooltip.data()[0],
9182 isNotSameIndex = index !== (data && data.index);
9183
9184 // prevent throwing error for non-paired linked indexes
9185 try {
9186 show && isNotSameIndex ? c.tooltip.show({
9187 index: index
9188 }) : !show && c.tooltip.hide();
9189 } catch (e) {}
9190 }
9191 }
9192 });
9193 }
9194 }
9195});
9196// CONCATENATED MODULE: ./src/internals/legend.js
9197/**
9198 * Copyright (c) 2017 ~ present NAVER Corp.
9199 * billboard.js project is licensed under the MIT license
9200 */
9201
9202
9203
9204
9205extend(ChartInternal_ChartInternal.prototype, {
9206 /**
9207 * Initialize the legend.
9208 * @private
9209 */
9210 initLegend: function initLegend() {
9211 var $$ = this,
9212 config = $$.config;
9213 $$.legendItemTextBox = {}, $$.legendHasRendered = !1, $$.legend = $$.svg.append("g"), config.legend_show ? ($$.legend.attr("transform", $$.getTranslate("legend")), $$.updateLegend()) : ($$.legend.style("visibility", "hidden"), $$.hiddenLegendIds = $$.mapToIds($$.data.targets));
9214 },
9215
9216 /**
9217 * Update legend element
9218 * @param {Array} targetIds ID's of target
9219 * @param {Object} options withTransform : Whether to use the transform property / withTransitionForTransform: Whether transition is used when using the transform property / withTransition : whether or not to transition.
9220 * @param {Object} transitions Return value of the generateTransitions
9221 * @private
9222 */
9223 updateLegend: function updateLegend(targetIds, options, transitions) {
9224 var $$ = this,
9225 config = $$.config,
9226 optionz = options || {
9227 withTransform: !1,
9228 withTransitionForTransform: !1,
9229 withTransition: !1
9230 };
9231 // Update size and scale
9232 // Update g positions
9233 optionz.withTransition = getOption(optionz, "withTransition", !0), optionz.withTransitionForTransform = getOption(optionz, "withTransitionForTransform", !0), config.legend_contents_bindto && config.legend_contents_template ? $$.updateLegendTemplate() : $$.updateLegendElement(targetIds || $$.mapToIds($$.data.targets), optionz, transitions), $$.updateSizes(), $$.updateScales(!optionz.withTransition), $$.updateSvgSize(), $$.transformAll(optionz.withTransitionForTransform, transitions), $$.legendHasRendered = !0;
9234 },
9235
9236 /**
9237 * Update legend using template option
9238 * @private
9239 */
9240 updateLegendTemplate: function updateLegendTemplate() {
9241 var $$ = this,
9242 config = $$.config,
9243 wrapper = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(config.legend_contents_bindto),
9244 template = config.legend_contents_template;
9245
9246 if (!wrapper.empty()) {
9247 var targets = $$.data.targets,
9248 ids = [],
9249 html = "";
9250 $$.mapToIds(targets).forEach(function (v) {
9251 var content = isFunction(template) ? template.call($$, v, $$.color(v), $$.api.data(v)[0].values) : template.replace(/{=COLOR}/g, $$.color(v)).replace(/{=TITLE}/g, v);
9252 content && (ids.push(v), html += content);
9253 });
9254 var legendItem = wrapper.html(html).selectAll(function () {
9255 return this.childNodes;
9256 }).data(ids);
9257 $$.setLegendItem(legendItem);
9258 }
9259 },
9260
9261 /**
9262 * Update the size of the legend.
9263 * @private
9264 * @param {Number} height
9265 * @param {Number} width
9266 */
9267 updateSizeForLegend: function updateSizeForLegend(legendHeight, legendWidth) {
9268 var $$ = this,
9269 config = $$.config,
9270 insetLegendPosition = {
9271 top: $$.isLegendTop ? $$.getCurrentPaddingTop() + config.legend_inset_y + 5.5 : $$.currentHeight - legendHeight - $$.getCurrentPaddingBottom() - config.legend_inset_y,
9272 left: $$.isLegendLeft ? $$.getCurrentPaddingLeft() + config.legend_inset_x + .5 : $$.currentWidth - legendWidth - $$.getCurrentPaddingRight() - config.legend_inset_x + .5
9273 };
9274 $$.margin3 = {
9275 top: $$.isLegendRight ? 0 : $$.isLegendInset ? insetLegendPosition.top : $$.currentHeight - legendHeight,
9276 right: NaN,
9277 bottom: 0,
9278 left: $$.isLegendRight ? $$.currentWidth - legendWidth : $$.isLegendInset ? insetLegendPosition.left : 0
9279 };
9280 },
9281
9282 /**
9283 * Transform Legend
9284 * @private
9285 * @param {Boolean} whether or not to transition.
9286 */
9287 transformLegend: function transformLegend(withTransition) {
9288 var $$ = this;
9289 (withTransition ? $$.legend.transition() : $$.legend).attr("transform", $$.getTranslate("legend"));
9290 },
9291
9292 /**
9293 * Update the legend step
9294 * @private
9295 * @param {Number} step
9296 */
9297 updateLegendStep: function updateLegendStep(step) {
9298 this.legendStep = step;
9299 },
9300
9301 /**
9302 * Update legend item width
9303 * @private
9304 * @param {Number} width
9305 */
9306 updateLegendItemWidth: function updateLegendItemWidth(w) {
9307 this.legendItemWidth = w;
9308 },
9309
9310 /**
9311 * Update legend item height
9312 * @private
9313 * @param {Number} height
9314 */
9315 updateLegendItemHeight: function updateLegendItemHeight(h) {
9316 this.legendItemHeight = h;
9317 },
9318
9319 /**
9320 * Get the width of the legend
9321 * @private
9322 * @param {Number} width
9323 */
9324 getLegendWidth: function getLegendWidth() {
9325 var $$ = this;
9326 return $$.config.legend_show ? $$.isLegendRight || $$.isLegendInset ? $$.legendItemWidth * ($$.legendStep + 1) : $$.currentWidth : 0;
9327 },
9328
9329 /**
9330 * Get the height of the legend
9331 * @private
9332 * @param {Number} height
9333 */
9334 getLegendHeight: function getLegendHeight() {
9335 var $$ = this,
9336 h = 0;
9337 return $$.config.legend_show && ($$.isLegendRight ? h = $$.currentHeight : h = Math.max(20, $$.legendItemHeight) * ($$.legendStep + 1)), h;
9338 },
9339
9340 /**
9341 * Get the opacity of the legend
9342 * @private
9343 * @param {Object} d3.Select
9344 * @returns {Number} opacity
9345 */
9346 opacityForLegend: function opacityForLegend(legendItem) {
9347 return legendItem.classed(config_classes.legendItemHidden) ? null : "1";
9348 },
9349
9350 /**
9351 * Get the opacity of the legend that is unfocused
9352 * @private
9353 * @param {Object} legendItem, d3.Select
9354 * @returns {Number} opacity
9355 */
9356 opacityForUnfocusedLegend: function opacityForUnfocusedLegend(legendItem) {
9357 return legendItem.classed(config_classes.legendItemHidden) ? null : "0.3";
9358 },
9359
9360 /**
9361 * Toggles the focus of the legend
9362 * @private
9363 * @param {Array} ID's of target
9364 * @param {Boolean} whether or not to focus.
9365 */
9366 toggleFocusLegend: function toggleFocusLegend(targetIds, focus) {
9367 var $$ = this,
9368 targetIdz = $$.mapToTargetIds(targetIds);
9369 $$.legend.selectAll(".".concat(config_classes.legendItem)).filter(function (id) {
9370 return targetIdz.indexOf(id) >= 0;
9371 }).classed(config_classes.legendItemFocused, focus).transition().duration(100).style("opacity", function () {
9372 var opacity = focus ? $$.opacityForLegend : $$.opacityForUnfocusedLegend;
9373 return opacity.call($$, Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this));
9374 });
9375 },
9376
9377 /**
9378 * Revert the legend to its default state
9379 * @private
9380 */
9381 revertLegend: function revertLegend() {
9382 var $$ = this;
9383 $$.legend.selectAll(".".concat(config_classes.legendItem)).classed(config_classes.legendItemFocused, !1).transition().duration(100).style("opacity", function () {
9384 return $$.opacityForLegend(Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this));
9385 });
9386 },
9387
9388 /**
9389 * Shows the legend
9390 * @private
9391 * @param {Array} ID's of target
9392 */
9393 showLegend: function showLegend(targetIds) {
9394 var $$ = this,
9395 config = $$.config;
9396 config.legend_show || (config.legend_show = !0, $$.legend.style("visibility", "visible"), !$$.legendHasRendered && $$.updateLegend()), $$.removeHiddenLegendIds(targetIds), $$.legend.selectAll($$.selectorLegends(targetIds)).style("visibility", "visible").transition().style("opacity", function () {
9397 return $$.opacityForLegend(Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this));
9398 });
9399 },
9400
9401 /**
9402 * Hide the legend
9403 * @private
9404 * @param {Array} ID's of target
9405 */
9406 hideLegend: function hideLegend(targetIds) {
9407 var $$ = this,
9408 config = $$.config;
9409 config.legend_show && isEmpty(targetIds) && (config.legend_show = !1, $$.legend.style("visibility", "hidden")), $$.addHiddenLegendIds(targetIds), $$.legend.selectAll($$.selectorLegends(targetIds)).style("opacity", "0").style("visibility", "hidden");
9410 },
9411
9412 /**
9413 * Clear the LegendItemTextBox cache.
9414 * @private
9415 */
9416 clearLegendItemTextBoxCache: function clearLegendItemTextBoxCache() {
9417 this.legendItemTextBox = {};
9418 },
9419
9420 /**
9421 * Set legend item style & bind events
9422 * @private
9423 * @param {d3.selection} item
9424 */
9425 setLegendItem: function setLegendItem(item) {
9426 var $$ = this,
9427 config = $$.config,
9428 isTouch = $$.inputType === "touch";
9429 item.attr("class", function (id) {
9430 var node = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this),
9431 itemClass = !node.empty() && node.attr("class") || "";
9432 return itemClass + $$.generateClass(config_classes.legendItem, id);
9433 }).style("visibility", function (id) {
9434 return $$.isLegendToShow(id) ? "visible" : "hidden";
9435 }).style("cursor", "pointer").on("click", function (id) {
9436 callFn(config.legend_item_onclick, $$, id) || (external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["event"].altKey ? ($$.api.hide(), $$.api.show(id)) : ($$.api.toggle(id), !isTouch && $$.isTargetToShow(id) ? $$.api.focus(id) : $$.api.revert())), isTouch && $$.hideTooltip();
9437 }), isTouch || item.on("mouseout", function (id) {
9438 callFn(config.legend_item_onout, $$, id) || (Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this).classed(config_classes.legendItemFocused, !1), $$.api.revert());
9439 }).on("mouseover", function (id) {
9440 callFn(config.legend_item_onover, $$, id) || (Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this).classed(config_classes.legendItemFocused, !0), !$$.transiting && $$.isTargetToShow(id) && $$.api.focus(id));
9441 });
9442 },
9443
9444 /**
9445 * Update the legend
9446 * @param {Array} targetIds ID's of target
9447 * @param {Object} options withTransform : Whether to use the transform property / withTransitionForTransform: Whether transition is used when using the transform property / withTransition : whether or not to transition.
9448 * @private
9449 */
9450 updateLegendElement: function updateLegendElement(targetIds, options) {
9451 var xForLegend,
9452 yForLegend,
9453 background,
9454 $$ = this,
9455 config = $$.config,
9456 posMin = 10,
9457 tileWidth = config.legend_item_tile_width + 5,
9458 maxWidth = 0,
9459 maxHeight = 0,
9460 totalLength = 0,
9461 offsets = {},
9462 widths = {},
9463 heights = {},
9464 margins = [0],
9465 steps = {},
9466 step = 0,
9467 isLegendRightOrInset = $$.isLegendRight || $$.isLegendInset,
9468 targetIdz = targetIds.filter(function (id) {
9469 return !isDefined(config.data_names[id]) || config.data_names[id] !== null;
9470 }),
9471 withTransition = options.withTransition,
9472 getTextBox = function (textElement, id) {
9473 return $$.legendItemTextBox[id] || ($$.legendItemTextBox[id] = $$.getTextRect(textElement, config_classes.legendItem, textElement)), $$.legendItemTextBox[id];
9474 },
9475 updatePositions = function (textElement, id, index) {
9476 var margin,
9477 isLast = index === targetIdz.length - 1,
9478 box = getTextBox(textElement, id),
9479 itemWidth = box.width + tileWidth + (isLast && !isLegendRightOrInset ? 0 : 10) + config.legend_padding,
9480 itemHeight = box.height + 4,
9481 itemLength = isLegendRightOrInset ? itemHeight : itemWidth,
9482 areaLength = isLegendRightOrInset ? $$.getLegendHeight() : $$.getLegendWidth(),
9483 updateValues = function (id2, withoutStep) {
9484 withoutStep || (margin = (areaLength - totalLength - itemLength) / 2, margin < posMin && (margin = (areaLength - itemLength) / 2, totalLength = 0, step++)), steps[id2] = step, margins[step] = $$.isLegendInset ? 10 : margin, offsets[id2] = totalLength, totalLength += itemLength;
9485 };
9486
9487 if (index === 0 && (totalLength = 0, step = 0, maxWidth = 0, maxHeight = 0), config.legend_show && !$$.isLegendToShow(id)) return widths[id] = 0, heights[id] = 0, steps[id] = 0, void (offsets[id] = 0);
9488 widths[id] = itemWidth, heights[id] = itemHeight, (!maxWidth || itemWidth >= maxWidth) && (maxWidth = itemWidth), (!maxHeight || itemHeight >= maxHeight) && (maxHeight = itemHeight);
9489 var maxLength = isLegendRightOrInset ? maxHeight : maxWidth;
9490 config.legend_equally ? (Object.keys(widths).forEach(function (id2) {
9491 return widths[id2] = maxWidth;
9492 }), Object.keys(heights).forEach(function (id2) {
9493 return heights[id2] = maxHeight;
9494 }), margin = (areaLength - maxLength * targetIdz.length) / 2, margin < posMin ? (totalLength = 0, step = 0, targetIdz.forEach(function (id2) {
9495 return updateValues(id2);
9496 })) : updateValues(id, !0)) : updateValues(id);
9497 };
9498
9499 $$.isLegendInset && (step = config.legend_inset_step ? config.legend_inset_step : targetIdz.length, $$.updateLegendStep(step)), $$.isLegendRight ? (xForLegend = function (id) {
9500 return maxWidth * steps[id];
9501 }, yForLegend = function (id) {
9502 return margins[steps[id]] + offsets[id];
9503 }) : $$.isLegendInset ? (xForLegend = function (id) {
9504 return maxWidth * steps[id] + 10;
9505 }, yForLegend = function (id) {
9506 return margins[steps[id]] + offsets[id];
9507 }) : (xForLegend = function (id) {
9508 return margins[steps[id]] + offsets[id];
9509 }, yForLegend = function (id) {
9510 return maxHeight * steps[id];
9511 });
9512
9513 var xForLegendText = function (id, i) {
9514 return xForLegend(id, i) + 4 + config.legend_item_tile_width;
9515 },
9516 xForLegendRect = function (id, i) {
9517 return xForLegend(id, i);
9518 },
9519 x1ForLegendTile = function (id, i) {
9520 return xForLegend(id, i) - 2;
9521 },
9522 x2ForLegendTile = function (id, i) {
9523 return xForLegend(id, i) - 2 + config.legend_item_tile_width;
9524 },
9525 yForLegendText = function (id, i) {
9526 return yForLegend(id, i) + 9;
9527 },
9528 yForLegendRect = function (id, i) {
9529 return yForLegend(id, i) - 5;
9530 },
9531 yForLegendTile = function (id, i) {
9532 return yForLegend(id, i) + 4;
9533 },
9534 pos = -200,
9535 l = $$.legend.selectAll(".".concat(config_classes.legendItem)).data(targetIdz).enter().append("g");
9536
9537 $$.setLegendItem(l), l.append("text").text(function (id) {
9538 return isDefined(config.data_names[id]) ? config.data_names[id] : id;
9539 }).each(function (id, i) {
9540 updatePositions(this, id, i);
9541 }).style("pointer-events", "none").attr("x", isLegendRightOrInset ? xForLegendText : pos).attr("y", isLegendRightOrInset ? pos : yForLegendText), l.append("rect").attr("class", config_classes.legendItemEvent).style("fill-opacity", "0").attr("x", isLegendRightOrInset ? xForLegendRect : pos).attr("y", isLegendRightOrInset ? pos : yForLegendRect);
9542 var usePoint = $$.config.legend_usePoint;
9543
9544 if (usePoint) {
9545 var ids = [];
9546 l.append(function (d) {
9547 var pattern = notEmpty(config.point_pattern) ? config.point_pattern : [config.point_type];
9548 ids.indexOf(d) === -1 && ids.push(d);
9549 var point = pattern[ids.indexOf(d) % pattern.length];
9550 return point === "rectangle" && (point = "rect"), document.createElementNS(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["namespaces"].svg, $$.hasValidPointType(point) ? point : "use");
9551 }).attr("class", config_classes.legendItemPoint).style("fill", function (d) {
9552 return $$.color(d);
9553 }).style("pointer-events", "none").attr("href", function (data, idx, selection) {
9554 var node = selection[idx],
9555 nodeName = node.nodeName.toLowerCase();
9556 return nodeName === "use" ? "#".concat($$.datetimeId, "-point-").concat(data) : undefined;
9557 });
9558 } else l.append("line").attr("class", config_classes.legendItemTile).style("stroke", $$.color).style("pointer-events", "none").attr("x1", isLegendRightOrInset ? x1ForLegendTile : pos).attr("y1", isLegendRightOrInset ? pos : yForLegendTile).attr("x2", isLegendRightOrInset ? x2ForLegendTile : pos).attr("y2", isLegendRightOrInset ? pos : yForLegendTile).attr("stroke-width", config.legend_item_tile_height); // Set background for inset legend
9559
9560
9561 background = $$.legend.select(".".concat(config_classes.legendBackground, " rect")), $$.isLegendInset && maxWidth > 0 && background.size() === 0 && (background = $$.legend.insert("g", ".".concat(config_classes.legendItem)).attr("class", config_classes.legendBackground).append("rect"));
9562 var texts = $$.legend.selectAll("text").data(targetIdz).text(function (id) {
9563 return isDefined(config.data_names[id]) ? config.data_names[id] : id;
9564 }) // MEMO: needed for update
9565 .each(function (id, i) {
9566 updatePositions(this, id, i);
9567 });
9568 (withTransition ? texts.transition() : texts).attr("x", xForLegendText).attr("y", yForLegendText);
9569 var rects = $$.legend.selectAll("rect.".concat(config_classes.legendItemEvent)).data(targetIdz);
9570
9571 if ((withTransition ? rects.transition() : rects).attr("width", function (id) {
9572 return widths[id];
9573 }).attr("height", function (id) {
9574 return heights[id];
9575 }).attr("x", xForLegendRect).attr("y", yForLegendRect), usePoint) {
9576 var tiles = $$.legend.selectAll(".".concat(config_classes.legendItemPoint)).data(targetIdz);
9577 (withTransition ? tiles.transition() : tiles).each(function () {
9578 var radius,
9579 width,
9580 height,
9581 nodeName = this.nodeName.toLowerCase(),
9582 pointR = $$.config.point_r,
9583 x = "x",
9584 y = "y",
9585 xOffset = 2,
9586 yOffset = 2.5;
9587
9588 if (nodeName === "circle") {
9589 var size = pointR * .2;
9590 x = "cx", y = "cy", radius = pointR + size, xOffset = pointR * 2, yOffset = -size;
9591 } else if (nodeName === "rect") {
9592 var _size = pointR * 2.5;
9593
9594 width = _size, height = _size, yOffset = 3;
9595 }
9596
9597 Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this).attr(x, function (d) {
9598 return x1ForLegendTile(d) + xOffset;
9599 }).attr(y, function (d) {
9600 return yForLegendTile(d) - yOffset;
9601 }).attr("r", radius).attr("width", width).attr("height", height);
9602 });
9603 } else {
9604 var _tiles = $$.legend.selectAll("line.".concat(config_classes.legendItemTile)).data(targetIdz);
9605
9606 (withTransition ? _tiles.transition() : _tiles).style("stroke", $$.color).attr("x1", x1ForLegendTile).attr("y1", yForLegendTile).attr("x2", x2ForLegendTile).attr("y2", yForLegendTile);
9607 }
9608
9609 background && (withTransition ? background.transition() : background).attr("height", $$.getLegendHeight() - 12).attr("width", maxWidth * (step + 1) + 10), $$.legend.selectAll(".".concat(config_classes.legendItem)).classed(config_classes.legendItemHidden, function (id) {
9610 return !$$.isTargetToShow(id);
9611 }), $$.updateLegendItemWidth(maxWidth), $$.updateLegendItemHeight(maxHeight), $$.updateLegendStep(step);
9612 }
9613});
9614// CONCATENATED MODULE: ./src/internals/title.js
9615/**
9616 * Copyright (c) 2017 ~ present NAVER Corp.
9617 * billboard.js project is licensed under the MIT license
9618 */
9619
9620
9621extend(ChartInternal_ChartInternal.prototype, {
9622 /**
9623 * Initializes the title
9624 * @private
9625 */
9626 initTitle: function initTitle() {
9627 var $$ = this;
9628 $$.title = $$.svg.append("text").text($$.config.title_text).attr("class", $$.CLASS.title);
9629 },
9630
9631 /**
9632 * Redraw title
9633 * @private
9634 */
9635 redrawTitle: function redrawTitle() {
9636 var $$ = this;
9637 $$.title.attr("x", $$.xForTitle.bind($$)).attr("y", $$.yForTitle.bind($$));
9638 },
9639
9640 /**
9641 * Returns the x attribute value of the title
9642 * @private
9643 * @returns {Number} x attribute value
9644 */
9645 xForTitle: function xForTitle() {
9646 var x,
9647 $$ = this,
9648 config = $$.config,
9649 position = config.title_position || "left";
9650 return x = position.indexOf("right") >= 0 ? $$.currentWidth - $$.getTextRect($$.title, $$.CLASS.title, $$.title).width - config.title_padding.right : position.indexOf("center") >= 0 ? ($$.currentWidth - $$.getTextRect($$.title, $$.CLASS.title, $$.title).width) / 2 : config.title_padding.left, x;
9651 },
9652
9653 /**
9654 * Returns the y attribute value of the title
9655 * @private
9656 * @returns {Number} y attribute value
9657 */
9658 yForTitle: function yForTitle() {
9659 var $$ = this;
9660 return $$.config.title_padding.top + $$.getTextRect($$.title, $$.CLASS.title, $$.title).height;
9661 },
9662
9663 /**
9664 * Get title padding
9665 * @private
9666 * @returns {Number} padding value
9667 */
9668 getTitlePadding: function getTitlePadding() {
9669 var $$ = this;
9670 return $$.yForTitle() + $$.config.title_padding.bottom;
9671 }
9672});
9673// CONCATENATED MODULE: ./src/internals/clip.js
9674/**
9675 * Copyright (c) 2017 ~ present NAVER Corp.
9676 * billboard.js project is licensed under the MIT license
9677 */
9678
9679
9680extend(ChartInternal_ChartInternal.prototype, {
9681 getClipPath: function getClipPath(id) {
9682 var $$ = this,
9683 config = $$.config;
9684 if (!config.clipPath && /-clip$/.test(id) || !config.axis_x_clipPath && /-clip-xaxis$/.test(id) || !config.axis_y_clipPath && /-clip-yaxis$/.test(id)) return null;
9685 var isIE9 = window.navigator.appVersion.toLowerCase().indexOf("msie 9.") >= 0;
9686 return "url(".concat(isIE9 ? "" : document.URL.split("#")[0], "#").concat(id, ")");
9687 },
9688 appendClip: function appendClip(parent, id) {
9689 return parent.append("clipPath").attr("id", id).append("rect");
9690 },
9691 getAxisClipX: function getAxisClipX(forHorizontal) {
9692 // axis line width + padding for left
9693 var left = Math.max(30, this.margin.left);
9694 return forHorizontal ? -(1 + left) : -(left - 1);
9695 },
9696 getAxisClipY: function getAxisClipY(forHorizontal) {
9697 return forHorizontal ? -20 : -this.margin.top;
9698 },
9699 getXAxisClipX: function getXAxisClipX() {
9700 var $$ = this;
9701 return $$.getAxisClipX(!$$.config.axis_rotated);
9702 },
9703 getXAxisClipY: function getXAxisClipY() {
9704 var $$ = this;
9705 return $$.getAxisClipY(!$$.config.axis_rotated);
9706 },
9707 getYAxisClipX: function getYAxisClipX() {
9708 var $$ = this;
9709 return $$.config.axis_y_inner ? -1 : $$.getAxisClipX($$.config.axis_rotated);
9710 },
9711 getYAxisClipY: function getYAxisClipY() {
9712 var $$ = this;
9713 return $$.getAxisClipY($$.config.axis_rotated);
9714 },
9715 getAxisClipWidth: function getAxisClipWidth(forHorizontal) {
9716 var $$ = this,
9717 left = Math.max(30, $$.margin.left),
9718 right = Math.max(30, $$.margin.right);
9719 // width + axis line width + padding for left/right
9720 return forHorizontal ? $$.width + 2 + left + right : $$.margin.left + 20;
9721 },
9722 getAxisClipHeight: function getAxisClipHeight(forHorizontal) {
9723 // less than 20 is not enough to show the axis label 'outer' without legend
9724 return (forHorizontal ? this.margin.bottom : this.margin.top + this.height) + 20;
9725 },
9726 getXAxisClipWidth: function getXAxisClipWidth() {
9727 var $$ = this;
9728 return $$.getAxisClipWidth(!$$.config.axis_rotated);
9729 },
9730 getXAxisClipHeight: function getXAxisClipHeight() {
9731 var $$ = this;
9732 return $$.getAxisClipHeight(!$$.config.axis_rotated);
9733 },
9734 getYAxisClipWidth: function getYAxisClipWidth() {
9735 var $$ = this;
9736 return $$.getAxisClipWidth($$.config.axis_rotated) + ($$.config.axis_y_inner ? 20 : 0);
9737 },
9738 getYAxisClipHeight: function getYAxisClipHeight() {
9739 var $$ = this;
9740 return $$.getAxisClipHeight($$.config.axis_rotated);
9741 }
9742});
9743// CONCATENATED MODULE: ./src/internals/region.js
9744/**
9745 * Copyright (c) 2017 ~ present NAVER Corp.
9746 * billboard.js project is licensed under the MIT license
9747 */
9748 // selection
9749
9750
9751
9752
9753extend(ChartInternal_ChartInternal.prototype, {
9754 initRegion: function initRegion() {
9755 var $$ = this;
9756 $$.region = $$.main.append("g").attr("clip-path", $$.clipPath).attr("class", config_classes.regions);
9757 },
9758 updateRegion: function updateRegion(duration) {
9759 var $$ = this,
9760 config = $$.config;
9761 // hide if arc type
9762 // select <g> element
9763 $$.region.style("visibility", $$.hasArcType() ? "hidden" : "visible"), $$.mainRegion = $$.main.select(".".concat(config_classes.regions)).selectAll(".".concat(config_classes.region)).data(config.regions), $$.mainRegion.exit().transition().duration(duration).style("opacity", "0").remove(), $$.mainRegion = $$.mainRegion.enter().append("g").merge($$.mainRegion).attr("class", $$.classRegion.bind($$)), $$.mainRegion.append("rect").style("fill-opacity", "0");
9764 },
9765 redrawRegion: function redrawRegion(withTransition) {
9766 var $$ = this,
9767 regions = $$.mainRegion.select("rect");
9768 return regions = (withTransition ? regions.transition() : regions).attr("x", $$.regionX.bind($$)).attr("y", $$.regionY.bind($$)).attr("width", $$.regionWidth.bind($$)).attr("height", $$.regionHeight.bind($$)), [(withTransition ? regions.transition() : regions).style("fill-opacity", function (d) {
9769 return isValue(d.opacity) ? d.opacity : "0.1";
9770 }).on("end", function () {
9771 Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this.parentNode).selectAll("rect:not([x])").remove();
9772 })];
9773 },
9774 getRegionXY: function getRegionXY(type, d) {
9775 var scale,
9776 $$ = this,
9777 config = $$.config,
9778 isRotated = config.axis_rotated,
9779 isX = type === "x",
9780 key = "start",
9781 pos = 0;
9782 return d.axis === "y" || d.axis === "y2" ? (!isX && (key = "end"), (isX ? isRotated : !isRotated) && key in d && (scale = $$[d.axis], pos = scale(d[key]))) : (isX ? !isRotated : isRotated) && key in d && (scale = $$.zoomScale || $$.x, pos = scale($$.isTimeSeries() ? $$.parseDate(d[key]) : d[key])), pos;
9783 },
9784 regionX: function regionX(d) {
9785 return this.getRegionXY("x", d);
9786 },
9787 regionY: function regionY(d) {
9788 return this.getRegionXY("y", d);
9789 },
9790 getRegionSize: function getRegionSize(type, d) {
9791 var scale,
9792 $$ = this,
9793 config = $$.config,
9794 isRotated = config.axis_rotated,
9795 isWidth = type === "width",
9796 start = $$[isWidth ? "regionX" : "regionY"](d),
9797 key = "end",
9798 end = $$[type];
9799 return d.axis === "y" || d.axis === "y2" ? (!isWidth && (key = "start"), (isWidth ? isRotated : !isRotated) && key in d && (scale = $$[d.axis], end = scale(d[key]))) : (isWidth ? !isRotated : isRotated) && key in d && (scale = $$.zoomScale || $$.x, end = scale($$.isTimeSeries() ? $$.parseDate(d[key]) : d[key])), end < start ? 0 : end - start;
9800 },
9801 regionWidth: function regionWidth(d) {
9802 return this.getRegionSize("width", d);
9803 },
9804 regionHeight: function regionHeight(d) {
9805 return this.getRegionSize("height", d);
9806 },
9807 isRegionOnX: function isRegionOnX(d) {
9808 return !d.axis || d.axis === "x";
9809 }
9810});
9811// CONCATENATED MODULE: ./src/interactions/drag.js
9812
9813
9814/**
9815 * Copyright (c) 2017 ~ present NAVER Corp.
9816 * billboard.js project is licensed under the MIT license
9817 */
9818
9819
9820
9821
9822extend(ChartInternal_ChartInternal.prototype, {
9823 /**
9824 * Called when dragging.
9825 * Data points can be selected.
9826 * @private
9827 * @param {Object} mouse Object
9828 */
9829 drag: function drag(mouse) {
9830 var $$ = this,
9831 config = $$.config,
9832 main = $$.main;
9833
9834 if (!$$.hasArcType() && config.data_selection_enabled && ( // do nothing if not selectable
9835 !config.zoom_enabled || $$.zoom.altDomain) && config.data_selection_multiple // skip when single selection because drag is used for multiple selection
9836 ) {
9837 var _$$$dragStart = slicedToArray_default()($$.dragStart, 2),
9838 sx = _$$$dragStart[0],
9839 sy = _$$$dragStart[1],
9840 _mouse = slicedToArray_default()(mouse, 2),
9841 mx = _mouse[0],
9842 my = _mouse[1],
9843 minX = Math.min(sx, mx),
9844 maxX = Math.max(sx, mx),
9845 minY = config.data_selection_grouped ? $$.margin.top : Math.min(sy, my),
9846 maxY = config.data_selection_grouped ? $$.height : Math.max(sy, my);
9847
9848 main.select(".".concat(config_classes.dragarea)).attr("x", minX).attr("y", minY).attr("width", maxX - minX).attr("height", maxY - minY), main.selectAll(".".concat(config_classes.shapes)).selectAll(".".concat(config_classes.shape)).filter(function (d) {
9849 return config.data_selection_isselectable(d);
9850 }).each(function (d, i) {
9851 var toggle,
9852 shape = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this),
9853 isSelected = shape.classed(config_classes.SELECTED),
9854 isIncluded = shape.classed(config_classes.INCLUDED),
9855 isWithin = !1;
9856
9857 if (shape.classed(config_classes.circle)) {
9858 var x = shape.attr("cx") * 1,
9859 y = shape.attr("cy") * 1;
9860 toggle = $$.togglePoint, isWithin = minX < x && x < maxX && minY < y && y < maxY;
9861 } else if (shape.classed(config_classes.bar)) {
9862 var _getPathBox = getPathBox(this),
9863 _x = _getPathBox.x,
9864 y = _getPathBox.y,
9865 width = _getPathBox.width,
9866 height = _getPathBox.height;
9867
9868 toggle = $$.togglePath, isWithin = !(maxX < _x || _x + width < minX) && !(maxY < y || y + height < minY);
9869 } else // line/area selection not supported yet
9870 return;
9871
9872 isWithin ^ isIncluded && (shape.classed(config_classes.INCLUDED, !isIncluded), shape.classed(config_classes.SELECTED, !isSelected), toggle.call($$, !isSelected, shape, d, i));
9873 });
9874 }
9875 },
9876
9877 /**
9878 * Called when the drag starts.
9879 * Adds and Shows the drag area.
9880 * @private
9881 * @param {Object} mouse Object
9882 */
9883 dragstart: function dragstart(mouse) {
9884 var $$ = this,
9885 config = $$.config;
9886 $$.hasArcType() || !config.data_selection_enabled || ($$.dragStart = mouse, $$.main.select(".".concat(config_classes.chart)).append("rect").attr("class", config_classes.dragarea).style("opacity", "0.1"), $$.setDragStatus(!0));
9887 },
9888
9889 /**
9890 * Called when the drag finishes.
9891 * Removes the drag area.
9892 * @private
9893 */
9894 dragend: function dragend() {
9895 var $$ = this,
9896 config = $$.config;
9897 $$.hasArcType() || !config.data_selection_enabled || ($$.main.select(".".concat(config_classes.dragarea)).transition().duration(100).style("opacity", "0").remove(), $$.main.selectAll(".".concat(config_classes.shape)).classed(config_classes.INCLUDED, !1), $$.setDragStatus(!1));
9898 },
9899 setDragStatus: function setDragStatus(isDragging) {
9900 this.dragging = isDragging;
9901 }
9902});
9903// EXTERNAL MODULE: external {"commonjs":"d3-color","commonjs2":"d3-color","amd":"d3-color","root":"d3"}
9904var external_commonjs_d3_color_commonjs2_d3_color_amd_d3_color_root_d3_ = __webpack_require__(23);
9905
9906// CONCATENATED MODULE: ./src/internals/selection.js
9907/**
9908 * Copyright (c) 2017 ~ present NAVER Corp.
9909 * billboard.js project is licensed under the MIT license
9910 */
9911
9912
9913
9914
9915
9916extend(ChartInternal_ChartInternal.prototype, {
9917 /**
9918 * Select a point
9919 * @private
9920 * @param {Object} target point
9921 * @param {Object} data
9922 * @param {Number} index
9923 */
9924 selectPoint: function selectPoint(target, d, i) {
9925 var $$ = this,
9926 config = $$.config,
9927 isRotated = config.axis_rotated,
9928 cx = (isRotated ? $$.circleY : $$.circleX).bind($$),
9929 cy = (isRotated ? $$.circleX : $$.circleY).bind($$),
9930 r = $$.pointSelectR.bind($$);
9931 // add selected-circle on low layer g
9932 callFn(config.data_onselected, $$.api, d, target.node()), $$.main.select(".".concat(config_classes.selectedCircles).concat($$.getTargetSelectorSuffix(d.id))).selectAll(".".concat(config_classes.selectedCircle, "-").concat(i)).data([d]).enter().append("circle").attr("class", function () {
9933 return $$.generateClass(config_classes.selectedCircle, i);
9934 }).attr("cx", cx).attr("cy", cy).attr("stroke", $$.color).attr("r", function (d2) {
9935 return $$.pointSelectR(d2) * 1.4;
9936 }).transition().duration(100).attr("r", r);
9937 },
9938
9939 /**
9940 * Unelect a point
9941 * @private
9942 * @param {Object} target point
9943 * @param {Object} data
9944 * @param {Number} index
9945 */
9946 unselectPoint: function unselectPoint(target, d, i) {
9947 var $$ = this;
9948 // remove selected-circle from low layer g
9949 callFn($$.config.data_onunselected, $$.api, d, target.node()), $$.main.select(".".concat(config_classes.selectedCircles).concat($$.getTargetSelectorSuffix(d.id))).selectAll(".".concat(config_classes.selectedCircle, "-").concat(i)).transition().duration(100).attr("r", 0).remove();
9950 },
9951
9952 /**
9953 * Toggles the selection of points
9954 * @private
9955 * @param {Boolean} whether or not to select.
9956 * @param {Object} target point
9957 * @param {Object} data
9958 * @param {Number} index
9959 */
9960 togglePoint: function togglePoint(selected, target, d, i) {
9961 var method = "".concat(selected ? "" : "un", "selectPoint");
9962 this[method](target, d, i);
9963 },
9964
9965 /**
9966 * Select a path
9967 * @private
9968 * @param {Object} target path
9969 * @param {Object} data
9970 */
9971 selectPath: function selectPath(target, d) {
9972 var $$ = this,
9973 config = $$.config;
9974 callFn(config.data_onselected, $$, d, target.node()), config.interaction_brighten && target.transition().duration(100).style("fill", function () {
9975 return Object(external_commonjs_d3_color_commonjs2_d3_color_amd_d3_color_root_d3_["rgb"])($$.color(d)).brighter(.75);
9976 });
9977 },
9978
9979 /**
9980 * Unelect a path
9981 * @private
9982 * @param {Object} target path
9983 * @param {Object} data
9984 */
9985 unselectPath: function unselectPath(target, d) {
9986 var $$ = this,
9987 config = $$.config;
9988 callFn(config.data_onunselected, $$, d, target.node()), config.interaction_brighten && target.transition().duration(100).style("fill", function () {
9989 return $$.color(d);
9990 });
9991 },
9992
9993 /**
9994 * Toggles the selection of lines
9995 * @private
9996 * @param {Boolean} whether or not to select.
9997 * @param {Object} target shape
9998 * @param {Object} data
9999 * @param {Number} index
10000 */
10001 togglePath: function togglePath(selected, target, d, i) {
10002 this["".concat(selected ? "" : "un", "selectPath")](target, d, i);
10003 },
10004
10005 /**
10006 * Returns the toggle method of the target
10007 * @private
10008 * @param {Object} target shape
10009 * @param {Object} data
10010 * @returns {Function} toggle method
10011 */
10012 getToggle: function getToggle(that, d) {
10013 var $$ = this;
10014 return that.nodeName === "path" ? $$.togglePath : $$.isStepType(d) ? function () {} : // circle is hidden in step chart, so treat as within the click area
10015 $$.togglePoint;
10016 },
10017
10018 /**
10019 * Toggles the selection of shapes
10020 * @private
10021 * @param {Object} target shape
10022 * @param {Object} data
10023 * @param {Number} index
10024 */
10025 toggleShape: function toggleShape(that, d, i) {
10026 var toggledShape,
10027 $$ = this,
10028 config = $$.config,
10029 shape = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(that),
10030 isSelected = shape.classed(config_classes.SELECTED),
10031 toggle = $$.getToggle(that, d).bind($$);
10032
10033 if (config.data_selection_enabled && config.data_selection_isselectable(d)) {
10034 if (!config.data_selection_multiple) {
10035 var selector = ".".concat(config_classes.shapes);
10036 config.data_selection_grouped && (selector += $$.getTargetSelectorSuffix(d.id)), $$.main.selectAll(selector).selectAll(".".concat(config_classes.shape)).each(function (d, i) {
10037 var shape = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this);
10038 shape.classed(config_classes.SELECTED) && (toggledShape = shape, toggle(!1, shape.classed(config_classes.SELECTED, !1), d, i));
10039 });
10040 }
10041
10042 toggledShape && toggledShape.node() === shape.node() || (shape.classed(config_classes.SELECTED, !isSelected), toggle(!isSelected, shape, d, i));
10043 }
10044 }
10045});
10046// CONCATENATED MODULE: ./src/interactions/subchart.js
10047/**
10048 * Copyright (c) 2017 ~ present NAVER Corp.
10049 * billboard.js project is licensed under the MIT license
10050 */
10051
10052
10053
10054
10055
10056extend(ChartInternal_ChartInternal.prototype, {
10057 /**
10058 * Initialize the brush.
10059 * @private
10060 */
10061 initBrush: function initBrush() {
10062 var $$ = this; // set the brush
10063
10064 $$.brush = $$.config.axis_rotated ? Object(external_commonjs_d3_brush_commonjs2_d3_brush_amd_d3_brush_root_d3_["brushY"])() : Object(external_commonjs_d3_brush_commonjs2_d3_brush_amd_d3_brush_root_d3_["brushX"])();
10065
10066 // set "brush" event
10067 var brushHandler = function () {
10068 $$.redrawForBrush();
10069 };
10070
10071 // set the brush extent
10072 $$.brush.on("start", function () {
10073 $$.inputType === "touch" && $$.hideTooltip(), brushHandler();
10074 }).on("brush", brushHandler), $$.brush.update = function () {
10075 var extent = this.extent()();
10076 return extent[1].filter(function (v) {
10077 return isNaN(v);
10078 }).length === 0 && $$.context && $$.context.select(".".concat(config_classes.brush)).call(this), this;
10079 }, $$.brush.scale = function (scale, height) {
10080 var overlay = $$.svg.select(".bb-brush .overlay"),
10081 extent = [[0, 0]];
10082 // when extent updates, brush selection also be re-applied
10083 // https://github.com/d3/d3/issues/2918
10084 scale.range ? extent.push([scale.range()[1], (height || !overlay.empty()) && ~~overlay.attr("height") || 60]) : scale.constructor === Array && extent.push(scale), $$.config.axis_rotated && extent.reverse(), this.extent($$.config.axis_x_extent || extent), this.update();
10085 }, $$.brush.getSelection = function () {
10086 return $$.context ? $$.context.select(".".concat(config_classes.brush)) : Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])([]);
10087 };
10088 },
10089
10090 /**
10091 * Initialize the subchart.
10092 * @private
10093 */
10094 initSubchart: function initSubchart() {
10095 var $$ = this,
10096 config = $$.config,
10097 visibility = config.subchart_show ? "visible" : "hidden";
10098 $$.context = $$.svg.append("g").attr("transform", $$.getTranslate("context"));
10099 var context = $$.context;
10100 // Define g for chart area
10101 // Define g for bar chart area
10102 // Define g for line chart area
10103 // Add extent rect for Brush
10104 // ATTENTION: This must be called AFTER chart added
10105 // Add Axis
10106 context.style("visibility", visibility), context.append("g").attr("clip-path", $$.clipPathForSubchart).attr("class", config_classes.chart), context.select(".".concat(config_classes.chart)).append("g").attr("class", config_classes.chartBars), context.select(".".concat(config_classes.chart)).append("g").attr("class", config_classes.chartLines), context.append("g").attr("clip-path", $$.clipPath).attr("class", config_classes.brush).call($$.brush), $$.axes.subx = context.append("g").attr("class", config_classes.axisX).attr("transform", $$.getTranslate("subx")).attr("clip-path", config.axis_rotated ? "" : $$.clipPathForXAxis).style("visibility", config.subchart_axis_x_show ? visibility : "hidden");
10107 },
10108
10109 /**
10110 * Update sub chart
10111 * @private
10112 * @param {Object} $$.data.targets
10113 */
10114 updateTargetsForSubchart: function updateTargetsForSubchart(targets) {
10115 var $$ = this,
10116 context = $$.context,
10117 config = $$.config,
10118 classChartBar = $$.classChartBar.bind($$),
10119 classBars = $$.classBars.bind($$),
10120 classChartLine = $$.classChartLine.bind($$),
10121 classLines = $$.classLines.bind($$),
10122 classAreas = $$.classAreas.bind($$);
10123
10124 if (config.subchart_show) {
10125 // -- Bar --//
10126 var contextBarUpdate = context.select(".".concat(config_classes.chartBars)).selectAll(".".concat(config_classes.chartBar)).data(targets).attr("class", classChartBar),
10127 contextBarEnter = contextBarUpdate.enter().append("g").style("opacity", "0").attr("class", classChartBar).merge(contextBarUpdate);
10128 contextBarEnter.append("g").attr("class", classBars);
10129 // -- Line --//
10130 var contextLineUpdate = context.select(".".concat(config_classes.chartLines)).selectAll(".".concat(config_classes.chartLine)).data(targets).attr("class", classChartLine),
10131 contextLineEnter = contextLineUpdate.enter().append("g").style("opacity", "0").attr("class", classChartLine).merge(contextLineUpdate);
10132 // Lines for each data
10133 // Area
10134 // -- Brush --//
10135 contextLineEnter.append("g").attr("class", classLines), contextLineEnter.append("g").attr("class", classAreas), context.selectAll(".".concat(config_classes.brush, " rect")).attr(config.axis_rotated ? "width" : "height", config.axis_rotated ? $$.width2 : $$.height2);
10136 }
10137 },
10138
10139 /**
10140 * Update the bar of the sub chart
10141 * @private
10142 * @param {Object} durationForExit
10143 */
10144 updateBarForSubchart: function updateBarForSubchart(durationForExit) {
10145 var $$ = this;
10146 $$.contextBar = $$.context.selectAll(".".concat(config_classes.bars)).selectAll(".".concat(config_classes.bar)).data($$.barData.bind($$)), $$.contextBar.exit().transition().duration(durationForExit).style("opacity", "0").remove(), $$.contextBar = $$.contextBar.enter().append("path").attr("class", $$.classBar.bind($$)).style("stroke", "none").style("fill", $$.color).merge($$.contextBar).style("opacity", $$.initialOpacity.bind($$));
10147 },
10148
10149 /**
10150 * Redraw the bar of the subchart
10151 * @private
10152 * @param {String} path in subchart bar
10153 * @param {Boolean} whether or not to transition.
10154 * @param {Number} transition duration
10155 */
10156 redrawBarForSubchart: function redrawBarForSubchart(drawBarOnSub, withTransition, duration) {
10157 var contextBar = withTransition ? this.contextBar.transition(getRandom()).duration(duration) : this.contextBar;
10158 contextBar.attr("d", drawBarOnSub).style("opacity", "1");
10159 },
10160
10161 /**
10162 * Update the line of the sub chart
10163 * @private
10164 * @param {Number} Fade-out transition duration
10165 */
10166 updateLineForSubchart: function updateLineForSubchart(durationForExit) {
10167 var $$ = this;
10168 $$.contextLine = $$.context.selectAll(".".concat(config_classes.lines)).selectAll(".".concat(config_classes.line)).data($$.lineData.bind($$)), $$.contextLine.exit().transition().duration(durationForExit).style("opacity", "0").remove(), $$.contextLine = $$.contextLine.enter().append("path").attr("class", $$.classLine.bind($$)).style("stroke", $$.color).merge($$.contextLine).style("opacity", $$.initialOpacity.bind($$));
10169 },
10170
10171 /**
10172 * Redraw the line of the subchart
10173 * @private
10174 * @param {String} path in subchart line
10175 * @param {Boolean} whether or not to transition
10176 * @param {Number} transition duration
10177 */
10178 redrawLineForSubchart: function redrawLineForSubchart(drawLineOnSub, withTransition, duration) {
10179 var contextLine = withTransition ? this.contextLine.transition(getRandom()).duration(duration) : this.contextLine;
10180 contextLine.attr("d", drawLineOnSub).style("opacity", "1");
10181 },
10182
10183 /**
10184 * Update the area of the sub chart
10185 * @private
10186 * @param {Number} Fade-out transition duration
10187 */
10188 updateAreaForSubchart: function updateAreaForSubchart(durationForExit) {
10189 var $$ = this;
10190 $$.contextArea = $$.context.selectAll(".".concat(config_classes.areas)).selectAll(".".concat(config_classes.area)).data($$.lineData.bind($$)), $$.contextArea.exit().transition().duration(durationForExit).style("opacity", "0").remove(), $$.contextArea = $$.contextArea.enter().append("path").attr("class", $$.classArea.bind($$)).style("fill", $$.color).style("opacity", function () {
10191 return $$.orgAreaOpacity = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this).style("opacity"), "0";
10192 }).merge($$.contextArea).style("opacity", "0");
10193 },
10194
10195 /**
10196 * Redraw the area of the subchart
10197 * @private
10198 * @param {String} path in subchart line
10199 * @param {Boolean} whether or not to transition
10200 * @param {Number} transition duration
10201 */
10202 redrawAreaForSubchart: function redrawAreaForSubchart(drawAreaOnSub, withTransition, duration) {
10203 var contextArea = withTransition ? this.contextArea.transition(getRandom()).duration(duration) : this.contextArea;
10204 contextArea.attr("d", drawAreaOnSub).style("fill", this.color).style("opacity", this.orgAreaOpacity);
10205 },
10206
10207 /**
10208 * Redraw subchart.
10209 * @private
10210 * @param {Boolean} whether or not to show subchart
10211 * @param Do not use.
10212 * @param {Number} transition duration
10213 * @param Do not use.
10214 * @param {Object} area Indices
10215 * @param {Object} bar Indices
10216 * @param {Object} line Indices
10217 */
10218 redrawSubchart: function redrawSubchart(withSubchart, transitions, duration, durationForExit, areaIndices, barIndices, lineIndices) {
10219 var $$ = this,
10220 config = $$.config;
10221
10222 // subchart
10223 if ($$.context.style("visibility", config.subchart_show ? "visible" : "hidden"), config.subchart_show && (external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["event"] && external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["event"].type === "zoom" && $$.brush.update(), withSubchart)) // update subchart elements if needed
10224 {
10225 brushEmpty($$) || $$.brush.update();
10226 // setup drawer - MEMO: this must be called after axis updated
10227 var drawAreaOnSub = $$.generateDrawArea(areaIndices, !0),
10228 drawBarOnSub = $$.generateDrawBar(barIndices, !0),
10229 drawLineOnSub = $$.generateDrawLine(lineIndices, !0);
10230 $$.updateBarForSubchart(duration), $$.updateLineForSubchart(duration), $$.updateAreaForSubchart(duration), $$.redrawBarForSubchart(drawBarOnSub, duration, duration), $$.redrawLineForSubchart(drawLineOnSub, duration, duration), $$.redrawAreaForSubchart(drawAreaOnSub, duration, duration);
10231 }
10232 },
10233
10234 /**
10235 * Redraw the brush.
10236 * @private
10237 */
10238 redrawForBrush: function redrawForBrush() {
10239 var $$ = this,
10240 x = $$.x;
10241 $$.redraw({
10242 withTransition: !1,
10243 withY: $$.config.zoom_rescale,
10244 withSubchart: !1,
10245 withUpdateXDomain: !0,
10246 withDimension: !1
10247 }), $$.config.subchart_onbrush.call($$.api, x.orgDomain());
10248 },
10249
10250 /**
10251 * Transform context
10252 * @private
10253 * @param {Boolean} indicates transition is enabled
10254 * @param {Object} The return value of the generateTransitions method of Axis.
10255 */
10256 transformContext: function transformContext(withTransition, transitions) {
10257 var subXAxis,
10258 $$ = this;
10259 transitions && transitions.axisSubX ? subXAxis = transitions.axisSubX : (subXAxis = $$.context.select(".".concat(config_classes.axisX)), withTransition && (subXAxis = subXAxis.transition())), $$.context.attr("transform", $$.getTranslate("context")), subXAxis.attr("transform", $$.getTranslate("subx"));
10260 },
10261
10262 /**
10263 * Get default extent
10264 * @private
10265 * @returns {Array} default extent
10266 */
10267 getDefaultExtent: function getDefaultExtent() {
10268 var $$ = this,
10269 config = $$.config,
10270 extent = isFunction(config.axis_x_extent) ? config.axis_x_extent($$.getXDomain($$.data.targets)) : config.axis_x_extent;
10271 return $$.isTimeSeries() && (extent = [$$.parseDate(extent[0]), $$.parseDate(extent[1])]), extent;
10272 }
10273});
10274// EXTERNAL MODULE: external {"commonjs":"d3-zoom","commonjs2":"d3-zoom","amd":"d3-zoom","root":"d3"}
10275var external_commonjs_d3_zoom_commonjs2_d3_zoom_amd_d3_zoom_root_d3_ = __webpack_require__(24);
10276
10277// CONCATENATED MODULE: ./src/interactions/zoom.js
10278
10279
10280/**
10281 * Copyright (c) 2017 ~ present NAVER Corp.
10282 * billboard.js project is licensed under the MIT license
10283 */
10284
10285
10286
10287
10288
10289
10290
10291extend(ChartInternal_ChartInternal.prototype, {
10292 /**
10293 * Initialize zoom.
10294 * @private
10295 */
10296 initZoom: function initZoom() {
10297 var $$ = this;
10298 $$.zoomScale = null, $$.generateZoom();
10299 },
10300
10301 /**
10302 * Bind zoom event
10303 * @param {Boolean} bind Weather bind or unbound
10304 * @private
10305 */
10306 bindZoomEvent: function bindZoomEvent() {
10307 var bind = !(arguments.length > 0 && arguments[0] !== undefined) || arguments[0],
10308 $$ = this,
10309 zoomEnabled = $$.config.zoom_enabled;
10310 $$.redrawEventRect();
10311 var eventRects = $$.main.select(".".concat(config_classes.eventRects));
10312 zoomEnabled && bind ? $$.bindZoomOnEventRect(eventRects, zoomEnabled.type) : bind === !1 && ($$.api.unzoom(), eventRects.on(".zoom", null).on(".drag", null));
10313 },
10314
10315 /**
10316 * Generate zoom
10317 * @private
10318 */
10319 generateZoom: function generateZoom() {
10320 var $$ = this,
10321 config = $$.config,
10322 zoom = Object(external_commonjs_d3_zoom_commonjs2_d3_zoom_amd_d3_zoom_root_d3_["zoom"])().duration(0).on("start", $$.onZoomStart.bind($$)).on("zoom", $$.onZoom.bind($$)).on("end", $$.onZoomEnd.bind($$));
10323 // get zoom extent
10324
10325 /**
10326 * Update scale according zoom transform value
10327 * @param {Object} transform
10328 * @private
10329 */
10330 zoom.orgScaleExtent = function () {
10331 var extent = config.zoom_extent || [1, 10];
10332 return [extent[0], Math.max($$.getMaxDataCount() / extent[1], extent[1])];
10333 }, zoom.updateScaleExtent = function () {
10334 var ratio = diffDomain($$.x.orgDomain()) / diffDomain($$.getZoomDomain()),
10335 extent = this.orgScaleExtent();
10336 return this.scaleExtent([extent[0] * ratio, extent[1] * ratio]), this;
10337 }, zoom.updateTransformScale = function (transform) {
10338 // rescale from the original scale
10339 var newScale = transform.rescaleX($$.x),
10340 domain = $$.trimXDomain(newScale.domain()),
10341 rescale = config.zoom_rescale;
10342 newScale.domain(domain, $$.orgXDomain), $$.zoomScale = $$.getCustomizedScale(newScale), $$.xAxis.scale($$.zoomScale), rescale && $$.x.domain($$.zoomScale.orgDomain());
10343 }, $$.zoom = zoom;
10344 },
10345
10346 /**
10347 * 'start' event listener
10348 * @private
10349 */
10350 onZoomStart: function onZoomStart() {
10351 var $$ = this,
10352 event = external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["event"].sourceEvent;
10353 event && ($$.zoom.altDomain = event.altKey ? $$.x.orgDomain() : null, $$.zoom.startEvent = event, callFn($$.config.zoom_onzoomstart, $$.api, event));
10354 },
10355
10356 /**
10357 * 'zoom' event listener
10358 * @private
10359 */
10360 onZoom: function onZoom() {
10361 var $$ = this,
10362 config = $$.config,
10363 event = external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["event"];
10364
10365 if (config.zoom_enabled && event.sourceEvent) {
10366 var isMousemove = event.sourceEvent.type === "mousemove",
10367 transform = event.transform;
10368 return $$.zoom.updateTransformScale(transform), $$.filterTargetsToShow($$.data.targets).length === 0 ? void 0 : isMousemove && $$.zoom.altDomain ? ($$.x.domain($$.zoom.altDomain), void transform.scale($$.zoomScale).updateScaleExtent()) : void ($$.isCategorized() && $$.x.orgDomain()[0] === $$.orgXDomain[0] && $$.x.domain([$$.orgXDomain[0] - 1e-10, $$.x.orgDomain()[1]]), $$.redraw({
10369 withTransition: !1,
10370 withY: config.zoom_rescale,
10371 withSubchart: !1,
10372 withEventRect: !1,
10373 withDimension: !1
10374 }), $$.cancelClick = isMousemove, callFn(config.zoom_onzoom, $$.api, $$.subX.domain()));
10375 }
10376 },
10377
10378 /**
10379 * 'end' event listener
10380 * @private
10381 */
10382 onZoomEnd: function onZoomEnd() {
10383 var $$ = this,
10384 startEvent = $$.zoom.startEvent;
10385 // if click, do nothing. otherwise, click interaction will be canceled.
10386 !startEvent || event && startEvent.clientX === event.clientX && startEvent.clientY === event.clientY || ($$.redrawEventRect(), $$.updateZoom(), callFn($$.config.zoom_onzoomend, $$.api, $$.subX.domain()));
10387 },
10388
10389 /**
10390 * Get zoom domain
10391 * @returns {Array} zoom domain
10392 * @private
10393 */
10394 getZoomDomain: function getZoomDomain() {
10395 var $$ = this,
10396 config = $$.config,
10397 min = Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["min"])([$$.orgXDomain[0], config.zoom_x_min]),
10398 max = Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["max"])([$$.orgXDomain[1], config.zoom_x_max]);
10399 return [min, max];
10400 },
10401
10402 /**
10403 * Update zoom
10404 * @param {Boolean} force Force unzoom
10405 * @private
10406 */
10407 updateZoom: function updateZoom(force) {
10408 var $$ = this;
10409
10410 if ($$.zoomScale) {
10411 var zoomDomain = $$.zoomScale.domain(),
10412 xDomain = $$.subX.domain(),
10413 delta = .015,
10414 isfullyShown = (zoomDomain[0] <= xDomain[0] || zoomDomain[0] - delta <= xDomain[0]) && (xDomain[1] <= zoomDomain[1] || xDomain[1] <= zoomDomain[1] - delta);
10415 (force || isfullyShown) && ($$.xAxis.scale($$.subX), $$.x.domain($$.subX.orgDomain()), $$.zoomScale = null);
10416 }
10417 },
10418
10419 /**
10420 * Attach zoom event on <rect>
10421 * @private
10422 */
10423 bindZoomOnEventRect: function bindZoomOnEventRect(eventRects, type) {
10424 var $$ = this,
10425 behaviour = type === "drag" ? $$.zoomBehaviour : $$.zoom;
10426 eventRects.call(behaviour).on("dblclick.zoom", null);
10427 },
10428
10429 /**
10430 * Initialize the drag behaviour used for zooming.
10431 * @private
10432 */
10433 initZoomBehaviour: function initZoomBehaviour() {
10434 var $$ = this,
10435 config = $$.config,
10436 isRotated = config.axis_rotated,
10437 start = 0,
10438 end = 0,
10439 zoomRect = null;
10440 $$.zoomBehaviour = Object(external_commonjs_d3_drag_commonjs2_d3_drag_amd_d3_drag_root_d3_["drag"])().clickDistance(4).on("start", function () {
10441 $$.setDragStatus(!0), zoomRect || (zoomRect = $$.main.append("rect").attr("clip-path", $$.clipPath).attr("class", config_classes.zoomBrush).attr("width", isRotated ? $$.width : 0).attr("height", isRotated ? 0 : $$.height)), start = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["mouse"])(this)[0], end = start, zoomRect.attr("x", start).attr("width", 0), $$.onZoomStart();
10442 }).on("drag", function () {
10443 end = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["mouse"])(this)[0], zoomRect.attr("x", Math.min(start, end)).attr("width", Math.abs(end - start));
10444 }).on("end", function () {
10445 var _ref,
10446 scale = $$.zoomScale || $$.x;
10447
10448 if ($$.setDragStatus(!1), zoomRect.attr("x", 0).attr("width", 0), start > end && (_ref = [end, start], start = _ref[0], end = _ref[1], _ref), start < 0 && (end += Math.abs(start), start = 0), start !== end) $$.api.zoom([start, end].map(function (v) {
10449 return scale.invert(v);
10450 })), $$.onZoomEnd();else if ($$.isMultipleX()) $$.clickHandlerForMultipleXS.bind(this)($$);else {
10451 var _event = external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["event"].sourceEvent || external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["event"],
10452 _ref2 = "clientX" in _event ? [_event.clientX, _event.clientY] : [_event.x, _event.y],
10453 _ref3 = slicedToArray_default()(_ref2, 2),
10454 x = _ref3[0],
10455 y = _ref3[1],
10456 target = document.elementFromPoint(x, y);
10457
10458 $$.clickHandlerForSingleX.bind(target)(Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(target).datum(), $$);
10459 }
10460 });
10461 },
10462 setZoomResetButton: function setZoomResetButton() {
10463 var $$ = this,
10464 config = $$.config,
10465 resetButton = config.zoom_resetButton;
10466 resetButton && config.zoom_enabled.type === "drag" && ($$.zoom.resetBtn ? $$.zoom.resetBtn.style("display", null) : $$.zoom.resetBtn = $$.selectChart.append("div").classed(config_classes.button, !0).append("span").on("click", $$.api.unzoom.bind($$)).classed(config_classes.buttonZoomReset, !0).text(resetButton.text || "Reset Zoom"));
10467 }
10468});
10469// CONCATENATED MODULE: ./src/internals/color.js
10470/**
10471 * Copyright (c) 2017 ~ present NAVER Corp.
10472 * billboard.js project is licensed under the MIT license
10473 */
10474
10475
10476
10477
10478
10479/**
10480 * Set pattern's background color
10481 * (it adds a <rect> element to simulate bg-color)
10482 * @param {SVGPatternElement} pattern SVG pattern element
10483 * @param {String} color Color string
10484 * @param {String} id ID to be set
10485 * @return {{id: string, node: SVGPatternElement}}
10486 * @private
10487 */
10488
10489var colorizePattern = function (pattern, color, id) {
10490 var node = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(pattern.cloneNode(!0));
10491 return node.attr("id", id).insert("rect", ":first-child").attr("width", node.attr("width")).attr("height", node.attr("height")).style("fill", color), {
10492 id: id,
10493 node: node.node()
10494 };
10495},
10496 schemeCategory10 = ["#1f77b4", "#ff7f0e", "#2ca02c", "#d62728", "#9467bd", "#8c564b", "#e377c2", "#7f7f7f", "#bcbd22", "#17becf"]; // Replacement of d3.schemeCategory10.
10497// Contained differently depend on d3 version: v4(d3-scale), v5(d3-scale-chromatic)
10498
10499
10500extend(ChartInternal_ChartInternal.prototype, {
10501 /**
10502 * Get color pattern from CSS file
10503 * CSS should be defined as: background-image: url("#00c73c;#fa7171; ...");
10504 * @return {Array}
10505 * @private
10506 */
10507 getColorFromCss: function getColorFromCss() {
10508 var body = document.body,
10509 pattern = body["__colorPattern__"];
10510
10511 if (!pattern) {
10512 var span = document.createElement("span");
10513 span.className = config_classes.colorPattern, span.style.display = "none", body.appendChild(span);
10514 var content = window.getComputedStyle(span).backgroundImage;
10515 span.parentNode.removeChild(span), content.indexOf(";") > -1 && (pattern = content.replace(/url[^#]*|["'()]|(\s|%20)/g, "").split(";").map(function (v) {
10516 return v.trim().replace(/[\"'\s]/g, "");
10517 }).filter(Boolean), body["__colorPattern__"] = pattern);
10518 }
10519
10520 return pattern;
10521 },
10522 generateColor: function generateColor() {
10523 var $$ = this,
10524 config = $$.config,
10525 colors = config.data_colors,
10526 callback = config.data_color,
10527 ids = [],
10528 pattern = notEmpty(config.color_pattern) ? config.color_pattern : Object(external_commonjs_d3_scale_commonjs2_d3_scale_amd_d3_scale_root_d3_["scaleOrdinal"])($$.getColorFromCss() || schemeCategory10).range(),
10529 originalColorPattern = pattern;
10530
10531 if (isFunction(config.color_tiles)) {
10532 var tiles = config.color_tiles(),
10533 colorizedPatterns = pattern.map(function (p, index) {
10534 var color = p.replace(/[#\(\)\s,]/g, ""),
10535 id = "".concat($$.datetimeId, "-pattern-").concat(color, "-").concat(index);
10536 return colorizePattern(tiles[index % tiles.length], p, id);
10537 }); // Add background color to patterns
10538
10539 pattern = colorizedPatterns.map(function (p) {
10540 return "url(#".concat(p.id, ")");
10541 }), $$.patterns = colorizedPatterns;
10542 }
10543
10544 return function (d) {
10545 var color,
10546 id = d.id || d.data && d.data.id || d,
10547 isLine = $$.isTypeOf(id, ["line", "spline", "step"]) || !$$.config.data_types[id];
10548 return isFunction(colors[id]) ? color = colors[id](d) : colors[id] ? color = colors[id] : (ids.indexOf(id) < 0 && ids.push(id), color = isLine ? originalColorPattern[ids.indexOf(id) % originalColorPattern.length] : pattern[ids.indexOf(id) % pattern.length], colors[id] = color), isFunction(callback) ? callback(color, d) : color;
10549 };
10550 },
10551 generateLevelColor: function generateLevelColor() {
10552 var $$ = this,
10553 config = $$.config,
10554 colors = config.color_pattern,
10555 threshold = config.color_threshold,
10556 asValue = threshold.unit === "value",
10557 max = threshold.max || 100,
10558 values = threshold.values && threshold.values.length ? threshold.values : [];
10559 return notEmpty(threshold) ? function (value) {
10560 var color = colors[colors.length - 1];
10561
10562 for (var v, i = 0; i < values.length; i++) if (v = asValue ? value : value * 100 / max, v < values[i]) {
10563 color = colors[i];
10564 break;
10565 }
10566
10567 return color;
10568 } : null;
10569 }
10570});
10571// CONCATENATED MODULE: ./src/internals/format.js
10572/**
10573 * Copyright (c) 2017 ~ present NAVER Corp.
10574 * billboard.js project is licensed under the MIT license
10575 */
10576
10577
10578
10579var getFormat = function ($$, typeValue, v) {
10580 var config = $$.config,
10581 type = "axis_".concat(typeValue, "_tick_format"),
10582 format = config[type] ? config[type] : $$.defaultValueFormat;
10583 return format(v);
10584};
10585
10586extend(ChartInternal_ChartInternal.prototype, {
10587 getYFormat: function getYFormat(forArc) {
10588 var $$ = this,
10589 formatForY = $$.yFormat,
10590 formatForY2 = $$.y2Format;
10591 return forArc && !$$.hasType("gauge") && (formatForY = $$.defaultArcValueFormat, formatForY2 = $$.defaultArcValueFormat), function (v, ratio, id) {
10592 var format = $$.axis.getId(id) === "y2" ? formatForY2 : formatForY;
10593 return format.call($$, v, ratio);
10594 };
10595 },
10596 yFormat: function yFormat(v) {
10597 return getFormat(this, "y", v);
10598 },
10599 y2Format: function y2Format(v) {
10600 return getFormat(this, "y2", v);
10601 },
10602 defaultValueFormat: function defaultValueFormat(v) {
10603 return isValue(v) ? +v : "";
10604 },
10605 defaultArcValueFormat: function defaultArcValueFormat(v, ratio) {
10606 return "".concat((ratio * 100).toFixed(1), "%");
10607 },
10608 dataLabelFormat: function dataLabelFormat(targetId) {
10609 var $$ = this,
10610 dataLabels = $$.config.data_labels,
10611 defaultFormat = function (v) {
10612 return isValue(v) ? +v : "";
10613 },
10614 format = defaultFormat;
10615
10616 return isFunction(dataLabels.format) ? format = dataLabels.format : isObjectType(dataLabels.format) && (dataLabels.format[targetId] ? format = dataLabels.format[targetId] === !0 ? defaultFormat : dataLabels.format[targetId] : format = function () {
10617 return "";
10618 }), format;
10619 }
10620});
10621// CONCATENATED MODULE: ./src/internals/cache.js
10622/**
10623 * Copyright (c) 2017 ~ present NAVER Corp.
10624 * billboard.js project is licensed under the MIT license
10625 */
10626
10627
10628extend(ChartInternal_ChartInternal.prototype, {
10629 /**
10630 * Add cache
10631 * @param {String} key
10632 * @param {*} value
10633 * @param {Boolean} isDataType
10634 * @private
10635 */
10636 addCache: function addCache(key, value) {
10637 var isDataType = !!(arguments.length > 2 && arguments[2] !== undefined) && arguments[2];
10638 this.cache[key] = isDataType ? this.cloneTarget(value) : value;
10639 },
10640
10641 /**
10642 * Remove cache
10643 * @param {String|Array} key
10644 * @private
10645 */
10646 removeCache: function removeCache(key) {
10647 var _this = this;
10648
10649 toArray(key).forEach(function (v) {
10650 return delete _this.cache[v];
10651 });
10652 },
10653
10654 /**
10655 * Get cahce
10656 * @param {String|Array} key
10657 * @param {Boolean} isDataType
10658 * @return {*}
10659 * @private
10660 */
10661 getCache: function getCache(key) {
10662 var isDataType = !!(arguments.length > 1 && arguments[1] !== undefined) && arguments[1];
10663
10664 if (isDataType) {
10665 var targets = [];
10666
10667 for (var id, i = 0; id = key[i]; i++) id in this.cache && targets.push(this.cloneTarget(this.cache[id]));
10668
10669 return targets;
10670 }
10671
10672 return this.cache[key] || null;
10673 },
10674
10675 /**
10676 * reset cached data
10677 * @param {Boolean} all true: reset all data, false: reset only '$' prefixed key data
10678 * @private
10679 */
10680 resetCache: function resetCache(all) {
10681 var $$ = this;
10682
10683 for (var x in $$.cache) (all || /^\$/.test(x)) && ($$.cache[x] = null);
10684 }
10685});
10686// CONCATENATED MODULE: ./src/internals/class.js
10687/**
10688 * Copyright (c) 2017 ~ present NAVER Corp.
10689 * billboard.js project is licensed under the MIT license
10690 */
10691
10692
10693
10694extend(ChartInternal_ChartInternal.prototype, {
10695 CLASS: config_classes,
10696 generateClass: function generateClass(prefix, targetId) {
10697 return " ".concat(prefix, " ").concat(prefix + this.getTargetSelectorSuffix(targetId));
10698 },
10699 classText: function classText(d) {
10700 return this.generateClass(config_classes.text, d.index);
10701 },
10702 classTexts: function classTexts(d) {
10703 return this.generateClass(config_classes.texts, d.id);
10704 },
10705 classShape: function classShape(d) {
10706 return this.generateClass(config_classes.shape, d.index);
10707 },
10708 classShapes: function classShapes(d) {
10709 return this.generateClass(config_classes.shapes, d.id);
10710 },
10711 generateExtraLineClass: function generateExtraLineClass() {
10712 var $$ = this,
10713 classes = $$.config.line_classes || [],
10714 ids = [];
10715 return function (d) {
10716 var id = d.id || d.data && d.data.id || d;
10717 return ids.indexOf(id) < 0 && ids.push(id), classes[ids.indexOf(id) % classes.length];
10718 };
10719 },
10720 classLine: function classLine(d) {
10721 return this.classShape(d) + this.generateClass(config_classes.line, d.id);
10722 },
10723 classLines: function classLines(d) {
10724 return this.classShapes(d) + this.generateClass(config_classes.lines, d.id);
10725 },
10726 classCircle: function classCircle(d) {
10727 return this.classShape(d) + this.generateClass(config_classes.circle, d.index);
10728 },
10729 classCircles: function classCircles(d) {
10730 return this.classShapes(d) + this.generateClass(config_classes.circles, d.id);
10731 },
10732 classBar: function classBar(d) {
10733 return this.classShape(d) + this.generateClass(config_classes.bar, d.index);
10734 },
10735 classBars: function classBars(d) {
10736 return this.classShapes(d) + this.generateClass(config_classes.bars, d.id);
10737 },
10738 classArc: function classArc(d) {
10739 return this.classShape(d.data) + this.generateClass(config_classes.arc, d.data.id);
10740 },
10741 classArcs: function classArcs(d) {
10742 return this.classShapes(d.data) + this.generateClass(config_classes.arcs, d.data.id);
10743 },
10744 classArea: function classArea(d) {
10745 return this.classShape(d) + this.generateClass(config_classes.area, d.id);
10746 },
10747 classAreas: function classAreas(d) {
10748 return this.classShapes(d) + this.generateClass(config_classes.areas, d.id);
10749 },
10750 classRegion: function classRegion(d, i) {
10751 return "".concat(this.generateClass(config_classes.region, i), " ").concat("class" in d ? d.class : "");
10752 },
10753 classEvent: function classEvent(d) {
10754 return this.generateClass(config_classes.eventRect, d.index);
10755 },
10756 classTarget: function classTarget(id) {
10757 var additionalClassSuffix = this.config.data_classes[id],
10758 additionalClass = "";
10759 return additionalClassSuffix && (additionalClass = " ".concat(config_classes.target, "-").concat(additionalClassSuffix)), this.generateClass(config_classes.target, id) + additionalClass;
10760 },
10761 classFocus: function classFocus(d) {
10762 return this.classFocused(d) + this.classDefocused(d);
10763 },
10764 classFocused: function classFocused(d) {
10765 return " ".concat(this.focusedTargetIds.indexOf(d.id) >= 0 ? config_classes.focused : "");
10766 },
10767 classDefocused: function classDefocused(d) {
10768 return " ".concat(this.defocusedTargetIds.indexOf(d.id) >= 0 ? config_classes.defocused : "");
10769 },
10770 classChartText: function classChartText(d) {
10771 return config_classes.chartText + this.classTarget(d.id);
10772 },
10773 classChartLine: function classChartLine(d) {
10774 return config_classes.chartLine + this.classTarget(d.id);
10775 },
10776 classChartBar: function classChartBar(d) {
10777 return config_classes.chartBar + this.classTarget(d.id);
10778 },
10779 classChartArc: function classChartArc(d) {
10780 return config_classes.chartArc + this.classTarget(d.data.id);
10781 },
10782 classChartRadar: function classChartRadar(d) {
10783 return config_classes.chartRadar + this.classTarget(d.id);
10784 },
10785 getTargetSelectorSuffix: function getTargetSelectorSuffix(targetId) {
10786 return targetId || targetId === 0 ? "-".concat(targetId).replace(/[\s?!@#$%^&*()_=+,.<>'":;\[\]\/|~`{}\\]/g, "-") : "";
10787 },
10788 selectorTarget: function selectorTarget(id, prefix) {
10789 return "".concat(prefix || "", ".").concat(config_classes.target + this.getTargetSelectorSuffix(id));
10790 },
10791 selectorTargets: function selectorTargets(idsValue, prefix) {
10792 var $$ = this,
10793 ids = idsValue || [];
10794 return ids.length ? ids.map(function (id) {
10795 return $$.selectorTarget(id, prefix);
10796 }) : null;
10797 },
10798 selectorLegend: function selectorLegend(id) {
10799 return ".".concat(config_classes.legendItem + this.getTargetSelectorSuffix(id));
10800 },
10801 selectorLegends: function selectorLegends(ids) {
10802 var $$ = this;
10803 return ids && ids.length ? ids.map(function (id) {
10804 return $$.selectorLegend(id);
10805 }) : null;
10806 }
10807});
10808// CONCATENATED MODULE: ./src/api/api.focus.js
10809/**
10810 * Copyright (c) 2017 ~ present NAVER Corp.
10811 * billboard.js project is licensed under the MIT license
10812 */
10813
10814
10815
10816
10817extend(Chart_Chart.prototype, {
10818 /**
10819 * This API highlights specified targets and fade out the others.<br><br>
10820 * You can specify multiple targets by giving an array that includes id as String. If no argument is given, all of targets will be highlighted.
10821 * @method focus
10822 * @instance
10823 * @memberof Chart
10824 * @param {String|Array} targetIdsValue Target ids to be highlighted.
10825 * @example
10826 * // data1 will be highlighted and the others will be faded out
10827 * chart.focus("data1");
10828 *
10829 * // data1 and data2 will be highlighted and the others will be faded out
10830 * chart.focus(["data1", "data2"]);
10831 *
10832 * // all targets will be highlighted
10833 * chart.focus();
10834 */
10835 focus: function focus(targetIdsValue) {
10836 var $$ = this.internal,
10837 targetIds = $$.mapToTargetIds(targetIdsValue),
10838 candidates = $$.svg.selectAll($$.selectorTargets(targetIds.filter($$.isTargetToShow, $$)));
10839 this.revert(), this.defocus(), candidates.classed(config_classes.focused, !0).classed(config_classes.defocused, !1), $$.hasArcType() && $$.expandArc(targetIds), $$.toggleFocusLegend(targetIds, !0), $$.focusedTargetIds = targetIds, $$.defocusedTargetIds = $$.defocusedTargetIds.filter(function (id) {
10840 return targetIds.indexOf(id) < 0;
10841 });
10842 },
10843
10844 /**
10845 * This API fades out specified targets and reverts the others.<br><br>
10846 * You can specify multiple targets by giving an array that includes id as String. If no argument is given, all of targets will be faded out.
10847 * @method defocus
10848 * @instance
10849 * @memberof Chart
10850 * @param {String|Array} Target ids to be faded out.
10851 * @example
10852 * // data1 will be faded out and the others will be reverted.
10853 * chart.defocus("data1");
10854 *
10855 * // data1 and data2 will be faded out and the others will be reverted.
10856 * chart.defocus(["data1", "data2"]);
10857 *
10858 * // all targets will be faded out.
10859 * chart.defocus();
10860 */
10861 defocus: function defocus(targetIdsValue) {
10862 var $$ = this.internal,
10863 targetIds = $$.mapToTargetIds(targetIdsValue),
10864 candidates = $$.svg.selectAll($$.selectorTargets(targetIds.filter($$.isTargetToShow, $$)));
10865 candidates.classed(config_classes.focused, !1).classed(config_classes.defocused, !0), $$.hasArcType() && $$.unexpandArc(targetIds), $$.toggleFocusLegend(targetIds, !1), $$.focusedTargetIds = $$.focusedTargetIds.filter(function (id) {
10866 return targetIds.indexOf(id) < 0;
10867 }), $$.defocusedTargetIds = targetIds;
10868 },
10869
10870 /**
10871 * This API reverts specified targets.<br><br>
10872 * You can specify multiple targets by giving an array that includes id as String. If no argument is given, all of targets will be reverted.
10873 * @method revert
10874 * @instance
10875 * @memberof Chart
10876 * @param {String|Array} Target ids to be reverted
10877 * @example
10878 * // data1 will be reverted.
10879 * chart.revert("data1");
10880 *
10881 * // data1 and data2 will be reverted.
10882 * chart.revert(["data1", "data2"]);
10883 *
10884 * // all targets will be reverted.
10885 * chart.revert();
10886 */
10887 revert: function revert(targetIdsValue) {
10888 var $$ = this.internal,
10889 targetIds = $$.mapToTargetIds(targetIdsValue),
10890 candidates = $$.svg.selectAll($$.selectorTargets(targetIds));
10891 // should be for all targets
10892 candidates.classed(config_classes.focused, !1).classed(config_classes.defocused, !1), $$.hasArcType() && $$.unexpandArc(targetIds), $$.config.legend_show && ($$.showLegend(targetIds.filter($$.isLegendToShow.bind($$))), $$.legend.selectAll($$.selectorLegends(targetIds)).filter(function () {
10893 return Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this).classed(config_classes.legendItemFocused);
10894 }).classed(config_classes.legendItemFocused, !1)), $$.focusedTargetIds = [], $$.defocusedTargetIds = [];
10895 }
10896});
10897// CONCATENATED MODULE: ./src/api/api.show.js
10898/**
10899 * Copyright (c) 2017 ~ present NAVER Corp.
10900 * billboard.js project is licensed under the MIT license
10901 */
10902
10903
10904extend(Chart_Chart.prototype, {
10905 /**
10906 * Show/Hide data series
10907 * @private
10908 */
10909 _showHide: function _showHide(show, targetIdsValue, options) {
10910 var $$ = this.internal,
10911 targetIds = $$.mapToTargetIds(targetIdsValue);
10912 $$["".concat(show ? "remove" : "add", "HiddenTargetIds")](targetIds);
10913 var targets = $$.svg.selectAll($$.selectorTargets(targetIds)),
10914 opacity = show ? "1" : "0";
10915 targets.transition().style("opacity", opacity, "important").call($$.endall, function () {
10916 targets.style("opacity", null).style("opacity", opacity);
10917 }), options.withLegend && $$["".concat(show ? "show" : "hide", "Legend")](targetIds), $$.redraw({
10918 withUpdateOrgXDomain: !0,
10919 withUpdateXDomain: !0,
10920 withLegend: !0
10921 });
10922 },
10923
10924 /**
10925 * Show data series on chart
10926 * @method show
10927 * @instance
10928 * @memberof Chart
10929 * @param {String|Array} [targetIdsValue=all] The target id value.
10930 * @param {Object} [options] The object can consist with following members:<br>
10931 *
10932 * | Key | Type | default | Description |
10933 * | --- | --- | --- | --- |
10934 * | withLegend | Boolean | false | whether or not display legend |
10935 *
10936 * @example
10937 * // show 'data1'
10938 * chart.show("data1");
10939 *
10940 * // show 'data1' and 'data3'
10941 * chart.show(["data1", "data3"]);
10942 */
10943 show: function show(targetIdsValue) {
10944 var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
10945
10946 this._showHide(!0, targetIdsValue, options);
10947 },
10948
10949 /**
10950 * Hide data series from chart
10951 * @method hide
10952 * @instance
10953 * @memberof Chart
10954 * @param {String|Array} [targetIdsValue=all] The target id value.
10955 * @param {Object} [options] The object can consist with following members:<br>
10956 *
10957 * | Key | Type | default | Description |
10958 * | --- | --- | --- | --- |
10959 * | withLegend | Boolean | false | whether or not display legend |
10960 *
10961 * @example
10962 * // hide 'data1'
10963 * chart.hide("data1");
10964 *
10965 * // hide 'data1' and 'data3'
10966 * chart.hide(["data1", "data3"]);
10967 */
10968 hide: function hide(targetIdsValue) {
10969 var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
10970
10971 this._showHide(!1, targetIdsValue, options);
10972 },
10973
10974 /**
10975 * Toggle data series on chart. When target data is hidden, it will show. If is shown, it will hide in vice versa.
10976 * @method toggle
10977 * @instance
10978 * @memberof Chart
10979 * @param {String|Array} [targetIdsValue=all] The target id value.
10980 * @param {Object} [options] The object can consist with following members:<br>
10981 *
10982 * | Key | Type | default | Description |
10983 * | --- | --- | --- | --- |
10984 * | withLegend | Boolean | false | whether or not display legend |
10985 *
10986 * @example
10987 * // toggle 'data1'
10988 * chart.toggle("data1");
10989 *
10990 * // toggle 'data1' and 'data3'
10991 * chart.toggle(["data1", "data3"]);
10992 */
10993 toggle: function toggle(targetIds) {
10994 var _this = this,
10995 options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
10996 $$ = this.internal,
10997 targets = {
10998 show: [],
10999 hide: []
11000 };
11001
11002 // sort show & hide target ids
11003 // perform show & hide task separately
11004 // https://github.com/naver/billboard.js/issues/454
11005 $$.mapToTargetIds(targetIds).forEach(function (id) {
11006 return targets[$$.isTargetToShow(id) ? "hide" : "show"].push(id);
11007 }), targets.show.length && this.show(targets.show, options), targets.hide.length && setTimeout(function () {
11008 return _this.hide(targets.hide, options);
11009 }, 0);
11010 }
11011});
11012// CONCATENATED MODULE: ./src/api/api.zoom.js
11013/**
11014 * Copyright (c) 2017 ~ present NAVER Corp.
11015 * billboard.js project is licensed under the MIT license
11016 */
11017
11018
11019
11020
11021
11022/**
11023 * Zoom by giving x domain.
11024 * - **NOTE:** For `wheel` type zoom, the minimum zoom range will be set as the given domain.<br>
11025 * To get the initial state, [.unzoom()](#unzoom) should be called.
11026 * @method zoom
11027 * @instance
11028 * @memberof Chart
11029 * @param {Array} domainValue If domain is given, the chart will be zoomed to the given domain. If no argument is given, the current zoomed domain will be returned.
11030 * @return {Array} domain value in array
11031 * @example
11032 * // Zoom to specified domain
11033 * chart.zoom([10, 20]);
11034 *
11035 * // Get the current zoomed domain
11036 * chart.zoom();
11037 */
11038
11039var api_zoom_zoom = function (domainValue) {
11040 var resultDomain,
11041 $$ = this.internal,
11042 domain = domainValue;
11043
11044 if ($$.config.zoom_enabled && domain) {
11045 var isTimeSeries = $$.isTimeSeries();
11046
11047 if (isTimeSeries && (domain = domain.map(function (x) {
11048 return $$.parseDate(x);
11049 })), $$.config.subchart_show) {
11050 var xScale = $$.zoomScale || $$.x;
11051 $$.brush.getSelection().call($$.brush.move, [xScale(domain[0]), xScale(domain[1])]), resultDomain = domain;
11052 } else $$.x.domain(domain), $$.zoomScale = $$.x, $$.xAxis.scale($$.zoomScale), resultDomain = $$.zoomScale.orgDomain();
11053
11054 $$.redraw({
11055 withTransition: !0,
11056 withY: $$.config.zoom_rescale,
11057 withDimension: !1
11058 }), $$.setZoomResetButton(), callFn($$.config.zoom_onzoom, this, $$.x.orgDomain());
11059 } else resultDomain = $$.zoomScale ? $$.zoomScale.domain() : $$.x.orgDomain();
11060
11061 return resultDomain;
11062};
11063
11064extend(api_zoom_zoom, {
11065 /**
11066 * Enable and disable zooming.
11067 * @method zoom․enable
11068 * @instance
11069 * @memberof Chart
11070 * @param {String|Boolean} enabled Possible string values are "wheel" or "drag". If enabled is true, "wheel" will be used. If false is given, zooming will be disabled.<br>When set to false, the current zooming status will be reset.
11071 * @example
11072 * // Enable zooming using the mouse wheel
11073 * chart.zoom.enable(true);
11074 * // Or
11075 * chart.zoom.enable("wheel");
11076 *
11077 * // Enable zooming by dragging
11078 * chart.zoom.enable("drag");
11079 *
11080 * // Disable zooming
11081 * chart.zoom.enable(false);
11082 */
11083 enable: function enable() {
11084 var enabled = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "wheel",
11085 $$ = this.internal,
11086 config = $$.config,
11087 enableType = enabled;
11088 enabled && (enableType = isString(enabled) && /^(drag|wheel)$/.test(enabled) ? {
11089 type: enabled
11090 } : enabled), config.zoom_enabled = enableType, $$.zoom ? enabled === !1 && $$.bindZoomEvent(!1) : ($$.initZoom(), $$.initZoomBehaviour(), $$.bindZoomEvent()), $$.updateAndRedraw();
11091 },
11092
11093 /**
11094 * Set or get x Axis maximum zoom range value
11095 * @method zoom․max
11096 * @instance
11097 * @memberof Chart
11098 * @param {Number} [max] maximum value to set for zoom
11099 * @return {Number} zoom max value
11100 * @example
11101 * // Set maximum range value
11102 * chart.zoom.max(20);
11103 */
11104 max: function max(_max) {
11105 var $$ = this.internal,
11106 config = $$.config;
11107 return (_max === 0 || _max) && (config.zoom_x_max = Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["max"])([$$.orgXDomain[1], _max])), config.zoom_x_max;
11108 },
11109
11110 /**
11111 * Set or get x Axis minimum zoom range value
11112 * @method zoom․min
11113 * @instance
11114 * @memberof Chart
11115 * @param {Number} [min] minimum value tp set for zoom
11116 * @return {Number} zoom min value
11117 * @example
11118 * // Set minimum range value
11119 * chart.zoom.min(-1);
11120 */
11121 min: function min(_min) {
11122 var $$ = this.internal,
11123 config = $$.config;
11124 return (_min === 0 || _min) && (config.zoom_x_min = Object(external_commonjs_d3_array_commonjs2_d3_array_amd_d3_array_root_d3_["min"])([$$.orgXDomain[0], _min])), config.zoom_x_min;
11125 },
11126
11127 /**
11128 * Set zoom range
11129 * @method zoom․range
11130 * @instance
11131 * @memberof Chart
11132 * @param {Object} [range]
11133 * @return {Object} zoom range value
11134 * {
11135 * min: 0,
11136 * max: 100
11137 * }
11138 * @example
11139 * chart.zoom.range({
11140 * min: 10,
11141 * max: 100
11142 * });
11143 */
11144 range: function range(_range) {
11145 var zoom = this.zoom;
11146
11147 if (isObject(_range)) {
11148 var min = _range.min,
11149 max = _range.max;
11150 isDefined(min) && zoom.min(min), isDefined(max) && zoom.max(max);
11151 }
11152
11153 return {
11154 min: zoom.min(),
11155 max: zoom.max()
11156 };
11157 }
11158}), extend(Chart_Chart.prototype, {
11159 zoom: api_zoom_zoom,
11160
11161 /**
11162 * Unzoom zoomed area
11163 * @method unzoom
11164 * @instance
11165 * @memberof Chart
11166 * @example
11167 * chart.unzoom();
11168 */
11169 unzoom: function unzoom() {
11170 var $$ = this.internal,
11171 config = $$.config;
11172
11173 if ($$.zoomScale) {
11174 config.subchart_show ? $$.brush.getSelection().call($$.brush.move, null) : $$.zoom.updateTransformScale(external_commonjs_d3_zoom_commonjs2_d3_zoom_amd_d3_zoom_root_d3_["zoomIdentity"]), $$.updateZoom(!0), $$.zoom.resetBtn && $$.zoom.resetBtn.style("display", "none");
11175 // reset transform
11176 var eventRects = $$.main.select(".".concat(config_classes.eventRects));
11177 Object(external_commonjs_d3_zoom_commonjs2_d3_zoom_amd_d3_zoom_root_d3_["zoomTransform"])(eventRects.node()) !== external_commonjs_d3_zoom_commonjs2_d3_zoom_amd_d3_zoom_root_d3_["zoomIdentity"] && $$.zoom.transform(eventRects, external_commonjs_d3_zoom_commonjs2_d3_zoom_amd_d3_zoom_root_d3_["zoomIdentity"]), $$.redraw({
11178 withTransition: !0,
11179 withY: config.zoom_rescale
11180 });
11181 }
11182 }
11183});
11184// CONCATENATED MODULE: ./src/api/api.load.js
11185/**
11186 * Copyright (c) 2017 ~ present NAVER Corp.
11187 * billboard.js project is licensed under the MIT license
11188 */
11189
11190
11191extend(Chart_Chart.prototype, {
11192 /**
11193 * Load data to the chart.<br><br>
11194 * You can specify multiple targets by giving an array that includes id as String. If no argument is given, all of targets will be toggles.
11195 * - <b>Note:</b>
11196 * - unload should be used if some data needs to be unloaded simultaneously.
11197 * If you call unload API soon after/before load instead of unload param, chart will not be rendered properly because of cancel of animation.<br>
11198 * - done will be called after data loaded, but it's not after rendering.
11199 * It's because rendering will finish after some transition and there is some time lag between loading and rendering
11200 * @method load
11201 * @instance
11202 * @memberof Chart
11203 * @param {Object} args The object can consist with following members:<br>
11204 *
11205 * | Key | Description |
11206 * | --- | --- |
11207 * | - url<br>- json<br>- rows<br>- columns | The data will be loaded. If data that has the same target id is given, the chart will be updated. Otherwise, new target will be added |
11208 * | data | Data objects to be loaded |
11209 * | names | Same as data.names() |
11210 * | xs | Same as data.xs option |
11211 * | classes | The classes specified by data.classes will be updated. classes must be Object that has target id as keys. |
11212 * | categories | The categories specified by axis.x.categories or data.x will be updated. categories must be Array. |
11213 * | axes | The axes specified by data.axes will be updated. axes must be Object that has target id as keys. |
11214 * | colors | The colors specified by data.colors will be updated. colors must be Object that has target id as keys. |
11215 * | - type<br>- types | The type of targets will be updated. type must be String and types must be Object. |
11216 * | unload | Specify the data will be unloaded before loading new data. If true given, all of data will be unloaded. If target ids given as String or Array, specified targets will be unloaded. If absent or false given, unload will not occur. |
11217 * | done | The specified function will be called after data loaded.|
11218 *
11219 * @example
11220 * // Load data1 and unload data2 and data3
11221 * chart.load({
11222 * columns: [
11223 * ["data1", 100, 200, 150, ...],
11224 * ...
11225 * ],
11226 * unload: ["data2", "data3"],
11227 * url: "...",
11228 * done: function() { ... }
11229 * });
11230 */
11231 load: function load(args) {
11232 var $$ = this.internal,
11233 config = $$.config;
11234 // update xs if specified
11235 // update names if exists
11236 // update classes if exists
11237 // update axes if exists
11238 // update colors if exists
11239 args.xs && $$.addXs(args.xs), "names" in args && this.data.names(args.names), "classes" in args && Object.keys(args.classes).forEach(function (id) {
11240 config.data_classes[id] = args.classes[id];
11241 }), "categories" in args && $$.isCategorized() && (config.axis_x_categories = args.categories), "axes" in args && Object.keys(args.axes).forEach(function (id) {
11242 config.data_axes[id] = args.axes[id];
11243 }), "colors" in args && Object.keys(args.colors).forEach(function (id) {
11244 config.data_colors[id] = args.colors[id];
11245 }), "unload" in args && args.unload !== !1 ? $$.unload($$.mapToTargetIds(args.unload === !0 ? null : args.unload), function () {
11246 return $$.loadFromArgs(args);
11247 }) : $$.loadFromArgs(args);
11248 },
11249
11250 /**
11251 * Unload data to the chart.<br><br>
11252 * You can specify multiple targets by giving an array that includes id as String. If no argument is given, all of targets will be toggles.
11253 * - <b>Note:</b>
11254 * If you call load API soon after/before unload, unload param of load should be used. Otherwise chart will not be rendered properly because of cancel of animation.<br>
11255 * `done` will be called after data loaded, but it's not after rendering. It's because rendering will finish after some transition and there is some time lag between loading and rendering.
11256 * @method unload
11257 * @instance
11258 * @memberof Chart
11259 * @param {Object} args
11260 * | key | Type | Description |
11261 * | --- | --- | --- |
11262 * | ids | String &vert; Array | Target id data to be unloaded. If not given, all data will be unloaded. |
11263 * | done | Fuction | Callback after data is unloaded. |
11264 * @example
11265 * // Unload data2 and data3
11266 * chart.unload({
11267 * ids: ["data2", "data3"],
11268 * done: function() {
11269 * // called after the unloaded
11270 * }
11271 * });
11272 */
11273 unload: function unload(argsValue) {
11274 var $$ = this.internal,
11275 args = argsValue || {};
11276 isArray(args) ? args = {
11277 ids: args
11278 } : isString(args) && (args = {
11279 ids: [args]
11280 });
11281 var ids = $$.mapToTargetIds(args.ids);
11282 $$.unload(ids, function () {
11283 $$.redraw({
11284 withUpdateOrgXDomain: !0,
11285 withUpdateXDomain: !0,
11286 withLegend: !0
11287 }), $$.removeCache(ids), args.done && args.done();
11288 });
11289 }
11290});
11291// EXTERNAL MODULE: external {"commonjs":"d3-ease","commonjs2":"d3-ease","amd":"d3-ease","root":"d3"}
11292var external_commonjs_d3_ease_commonjs2_d3_ease_amd_d3_ease_root_d3_ = __webpack_require__(25);
11293
11294// CONCATENATED MODULE: ./src/api/api.flow.js
11295/**
11296 * Copyright (c) 2017 ~ present NAVER Corp.
11297 * billboard.js project is licensed under the MIT license
11298 */
11299
11300
11301
11302
11303
11304
11305
11306extend(Chart_Chart.prototype, {
11307 /**
11308 * Flow data to the chart.<br><br>
11309 * By this API, you can append new data points to the chart.
11310 * @method flow
11311 * @instance
11312 * @memberof Chart
11313 * @param {Object} args The object can consist with following members:<br>
11314 *
11315 * | Key | Type | Description |
11316 * | --- | --- | --- |
11317 * | json | Object | Data as JSON format (@see [data․json](Options.html#.data%25E2%2580%25A4json)) |
11318 * | rows | Array | Data in array as row format (@see [data․rows](Options.html#.data%25E2%2580%25A4json)) |
11319 * | columns | Array | Data in array as column format (@see [data․columns](Options.html#.data%25E2%2580%25A4columns)) |
11320 * | to | String | The lower x edge will move to that point. If not given, the lower x edge will move by the number of given data points |
11321 * | length | Number | The lower x edge will move by the number of this argument |
11322 * | duration | Number | The duration of the transition will be specified value. If not given, transition.duration will be used as default |
11323 * | done | Function | The specified function will be called when flow ends |
11324 *
11325 * - **NOTE:**
11326 * If json, rows and columns given, the data will be loaded.<br>
11327 * If data that has the same target id is given, the chart will be appended.<br>
11328 * Otherwise, new target will be added. One of these is required when calling.<br>
11329 * If json specified, keys is required as well as data.json.
11330 * @example
11331 * // 2 data points will be apprended to the tail and popped from the head.
11332 * // After that, 4 data points will be appended and no data points will be poppoed.
11333 * chart.flow({
11334 * columns: [
11335 * ["x", "2018-01-11", "2018-01-21"],
11336 * ["data1", 500, 200],
11337 * ["data2", 100, 300],
11338 * ["data3", 200, 120]
11339 * ],
11340 * to: "2013-01-11",
11341 * done: function () {
11342 * chart.flow({
11343 * columns: [
11344 * ["x", "2018-02-11", "2018-02-12", "2018-02-13", "2018-02-14"],
11345 * ["data1", 200, 300, 100, 250],
11346 * ["data2", 100, 90, 40, 120],
11347 * ["data3", 100, 100, 300, 500]
11348 * ],
11349 * length: 2,
11350 * duration: 1500
11351 * });
11352 * }
11353 * });
11354 */
11355 flow: function flow(args) {
11356 var data,
11357 domain,
11358 diff,
11359 to,
11360 $$ = this.internal,
11361 notfoundIds = [],
11362 orgDataCount = $$.getMaxDataCount(),
11363 length = 0,
11364 tail = 0;
11365 if (args.json) data = $$.convertJsonToData(args.json, args.keys);else if (args.rows) data = $$.convertRowsToData(args.rows);else if (args.columns) data = $$.convertColumnsToData(args.columns);else return;
11366 var targets = $$.convertDataToTargets(data, !0); // Update/Add data
11367
11368 $$.data.targets.forEach(function (t) {
11369 var found = !1;
11370
11371 for (var i = 0; i < targets.length; i++) if (t.id === targets[i].id) {
11372 found = !0, t.values[t.values.length - 1] && (tail = t.values[t.values.length - 1].index + 1), length = targets[i].values.length;
11373
11374 for (var j = 0; j < length; j++) targets[i].values[j].index = tail + j, $$.isTimeSeries() || (targets[i].values[j].x = tail + j);
11375
11376 t.values = t.values.concat(targets[i].values), targets.splice(i, 1);
11377 break;
11378 }
11379
11380 found || notfoundIds.push(t.id);
11381 }), $$.data.targets.forEach(function (t) {
11382 for (var i = 0; i < notfoundIds.length; i++) if (t.id === notfoundIds[i]) {
11383 tail = t.values[t.values.length - 1].index + 1;
11384
11385 for (var j = 0; j < length; j++) t.values.push({
11386 id: t.id,
11387 index: tail + j,
11388 x: $$.isTimeSeries() ? $$.getOtherTargetX(tail + j) : tail + j,
11389 value: null
11390 });
11391 }
11392 }), $$.data.targets.length && targets.forEach(function (t) {
11393 var missing = [];
11394
11395 for (var i = $$.data.targets[0].values[0].index; i < tail; i++) missing.push({
11396 id: t.id,
11397 index: i,
11398 x: $$.isTimeSeries() ? $$.getOtherTargetX(i) : i,
11399 value: null
11400 });
11401
11402 t.values.forEach(function (v) {
11403 v.index += tail, $$.isTimeSeries() || (v.x += tail);
11404 }), t.values = missing.concat(t.values);
11405 }), $$.data.targets = $$.data.targets.concat(targets);
11406 // add remained
11407 // check data count because behavior needs to change when it"s only one
11408 // const dataCount = $$.getMaxDataCount();
11409 var baseTarget = $$.data.targets[0],
11410 baseValue = baseTarget.values[0];
11411 // Set targets
11412 // Redraw with new targets
11413 isDefined(args.to) ? (length = 0, to = $$.isTimeSeries() ? $$.parseDate(args.to) : args.to, baseTarget.values.forEach(function (v) {
11414 v.x < to && length++;
11415 })) : isDefined(args.length) && (length = args.length), orgDataCount ? orgDataCount === 1 && $$.isTimeSeries() && (diff = (baseTarget.values[baseTarget.values.length - 1].x - baseValue.x) / 2, domain = [new Date(+baseValue.x - diff), new Date(+baseValue.x + diff)], $$.updateXDomain(null, !0, !0, !1, domain)) : (diff = $$.isTimeSeries() ? baseTarget.values.length > 1 ? baseTarget.values[baseTarget.values.length - 1].x - baseValue.x : baseValue.x - $$.getXDomain($$.data.targets)[0] : 1, domain = [baseValue.x - diff, baseValue.x], $$.updateXDomain(null, !0, !0, !1, domain)), $$.updateTargets($$.data.targets), $$.redraw({
11416 flow: {
11417 index: baseValue.index,
11418 length: length,
11419 duration: isValue(args.duration) ? args.duration : $$.config.transition_duration,
11420 done: args.done,
11421 orgDataCount: orgDataCount
11422 },
11423 withLegend: !0,
11424 withTransition: orgDataCount > 1,
11425 withTrimXDomain: !1,
11426 withUpdateXAxis: !0
11427 });
11428 }
11429}), extend(ChartInternal_ChartInternal.prototype, {
11430 /**
11431 * Generate flow
11432 * @memberof ChartInternal
11433 * @private
11434 * @param {Object} args
11435 * @return {Function}
11436 */
11437 generateFlow: function generateFlow(args) {
11438 var $$ = this,
11439 config = $$.config;
11440 return function () {
11441 var translateX,
11442 targets = args.targets,
11443 flow = args.flow,
11444 drawBar = args.drawBar,
11445 drawLine = args.drawLine,
11446 drawArea = args.drawArea,
11447 cx = args.cx,
11448 cy = args.cy,
11449 xv = args.xv,
11450 xForText = args.xForText,
11451 yForText = args.yForText,
11452 duration = args.duration,
11453 scaleX = 1,
11454 flowIndex = flow.index,
11455 flowLength = flow.length,
11456 flowStart = $$.getValueOnIndex($$.data.targets[0].values, flowIndex),
11457 flowEnd = $$.getValueOnIndex($$.data.targets[0].values, flowIndex + flowLength),
11458 orgDomain = $$.x.domain(),
11459 durationForFlow = flow.duration || duration,
11460 done = flow.done || function () {},
11461 wait = $$.generateWait(),
11462 xgrid = $$.xgrid || Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["selectAll"])([]),
11463 xgridLines = $$.xgridLines || Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["selectAll"])([]),
11464 mainRegion = $$.mainRegion || Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["selectAll"])([]),
11465 mainText = $$.mainText || Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["selectAll"])([]),
11466 mainBar = $$.mainBar || Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["selectAll"])([]),
11467 mainLine = $$.mainLine || Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["selectAll"])([]),
11468 mainArea = $$.mainArea || Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["selectAll"])([]),
11469 mainCircle = $$.mainCircle || Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["selectAll"])([]);
11470
11471 $$.flowing = !0, $$.data.targets.forEach(function (d) {
11472 d.values.splice(0, flowLength);
11473 });
11474 // update x domain to generate axis elements for flow
11475 var domain = $$.updateXDomain(targets, !0, !0); // update elements related to x scale
11476
11477 $$.updateXGrid && $$.updateXGrid(!0), flow.orgDataCount ? flow.orgDataCount === 1 || (flowStart && flowStart.x) === (flowEnd && flowEnd.x) ? translateX = $$.x(orgDomain[0]) - $$.x(domain[0]) : $$.isTimeSeries() ? translateX = $$.x(orgDomain[0]) - $$.x(domain[0]) : translateX = $$.x(flowStart.x) - $$.x(flowEnd.x) : $$.data.targets[0].values.length === 1 ? $$.isTimeSeries() ? (flowStart = $$.getValueOnIndex($$.data.targets[0].values, 0), flowEnd = $$.getValueOnIndex($$.data.targets[0].values, $$.data.targets[0].values.length - 1), translateX = $$.x(flowStart.x) - $$.x(flowEnd.x)) : translateX = diffDomain(domain) / 2 : translateX = $$.x(orgDomain[0]) - $$.x(domain[0]), scaleX = diffDomain(orgDomain) / diffDomain(domain);
11478 var transform = "translate(".concat(translateX, ",0) scale(").concat(scaleX, ",1)");
11479 $$.hideXGridFocus();
11480 var gt = Object(external_commonjs_d3_transition_commonjs2_d3_transition_amd_d3_transition_root_d3_["transition"])().ease(external_commonjs_d3_ease_commonjs2_d3_ease_amd_d3_ease_root_d3_["easeLinear"]).duration(durationForFlow);
11481 wait.add([$$.axes.x.transition(gt).call(function (g) {
11482 return $$.xAxis.setTransition(gt).create(g);
11483 }), mainBar.transition(gt).attr("transform", transform), mainLine.transition(gt).attr("transform", transform), mainArea.transition(gt).attr("transform", transform), mainCircle.transition(gt).attr("transform", transform), mainText.transition(gt).attr("transform", transform), mainRegion.filter($$.isRegionOnX).transition(gt).attr("transform", transform), xgrid.transition(gt).attr("transform", transform), xgridLines.transition(gt).attr("transform", transform)]), gt.call(wait, function () {
11484 var shapes = [],
11485 texts = [],
11486 eventRects = [];
11487
11488 // remove flowed elements
11489 if (flowLength) {
11490 for (var index, i = 0; i < flowLength; i++) index = flowIndex + i, shapes.push(".".concat(config_classes.shape, "-").concat(index)), texts.push(".".concat(config_classes.text, "-").concat(index)), eventRects.push(".".concat(config_classes.eventRect, "-").concat(index));
11491
11492 $$.svg.selectAll(".".concat(config_classes.shapes)).selectAll(shapes).remove(), $$.svg.selectAll(".".concat(config_classes.texts)).selectAll(texts).remove(), $$.svg.selectAll(".".concat(config_classes.eventRects)).selectAll(eventRects).remove(), $$.svg.select(".".concat(config_classes.xgrid)).remove();
11493 } // draw again for removing flowed elements and reverting attr
11494
11495
11496 if (xgrid.size() && xgrid.attr("transform", null).attr($$.xgridAttr), xgridLines.attr("transform", null), xgridLines.select("line").attr("x1", config.axis_rotated ? 0 : xv).attr("x2", config.axis_rotated ? $$.width : xv), xgridLines.select("text").attr("x", config.axis_rotated ? $$.width : 0).attr("y", xv), mainBar.attr("transform", null).attr("d", drawBar), mainLine.attr("transform", null).attr("d", drawLine), mainArea.attr("transform", null).attr("d", drawArea), mainCircle.attr("transform", null), $$.isCirclePoint()) mainCircle.attr("cx", cx).attr("cy", cy);else {
11497 var xFunc = function (d) {
11498 return cx(d) - config.point_r;
11499 },
11500 yFunc = function (d) {
11501 return cy(d) - config.point_r;
11502 };
11503
11504 mainCircle.attr("x", xFunc).attr("y", yFunc).attr("cx", cx) // when pattern is used, it possibly contain 'circle' also.
11505 .attr("cy", cy);
11506 }
11507 mainText.attr("transform", null).attr("x", xForText).attr("y", yForText).style("fill-opacity", $$.opacityForText.bind($$)), mainRegion.attr("transform", null), mainRegion.select("rect").filter($$.isRegionOnX).attr("x", $$.regionX.bind($$)).attr("width", $$.regionWidth.bind($$)), config.interaction_enabled && $$.redrawEventRect(), done(), $$.flowing = !1;
11508 });
11509 };
11510 }
11511});
11512// CONCATENATED MODULE: ./src/api/api.selection.js
11513/**
11514 * Copyright (c) 2017 ~ present NAVER Corp.
11515 * billboard.js project is licensed under the MIT license
11516 */
11517
11518
11519
11520
11521extend(Chart_Chart.prototype, {
11522 /**
11523 * Get selected data points.<br><br>
11524 * By this API, you can get selected data points information. To use this API, data.selection.enabled needs to be set true.
11525 * @method selected
11526 * @instance
11527 * @memberof Chart
11528 * @param {String} [targetId] You can filter the result by giving target id that you want to get. If not given, all of data points will be returned.
11529 * @return {Array} dataPoint Array of the data points.<br>ex.) `[{x: 1, value: 200, id: "data1", index: 1, name: "data1"}, ...]`
11530 * @example
11531 * // all selected data points will be returned.
11532 * chart.selected();
11533 * // --> ex.) [{x: 1, value: 200, id: "data1", index: 1, name: "data1"}, ... ]
11534 *
11535 * // all selected data points of data1 will be returned.
11536 * chart.selected("data1");
11537 */
11538 selected: function selected(targetId) {
11539 var $$ = this.internal,
11540 dataPoint = [];
11541 return $$.main.selectAll(".".concat(config_classes.shapes + $$.getTargetSelectorSuffix(targetId))).selectAll(".".concat(config_classes.shape)).filter(function () {
11542 return Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this).classed(config_classes.SELECTED);
11543 }).each(function (d) {
11544 return dataPoint.push(d);
11545 }), dataPoint;
11546 },
11547
11548 /**
11549 * Set data points to be selected. (`[data.selection.enabled](Options.html#.data%25E2%2580%25A4selection%25E2%2580%25A4enabled) option should be set true to use this method)`
11550 * @method select
11551 * @instance
11552 * @memberof Chart
11553 * @param {String|Array} [ids] id value to get selected.
11554 * @param {Array} [indices] The index array of data points. If falsy value given, will select all data points.
11555 * @param {Boolean} [resetOther] Unselect already selected.
11556 * @example
11557 * // select all data points
11558 * chart.select();
11559 *
11560 * // select all from 'data2'
11561 * chart.select("data2");
11562 *
11563 * // select all from 'data1' and 'data2'
11564 * chart.select(["data1", "data2"]);
11565 *
11566 * // select from 'data1', indices 2 and unselect others selected
11567 * chart.select("data1", [2], true);
11568 *
11569 * // select from 'data1', indices 0, 3 and 5
11570 * chart.select("data1", [0, 3, 5]);
11571 */
11572 select: function select(ids, indices, resetOther) {
11573 var $$ = this.internal,
11574 config = $$.config;
11575 config.data_selection_enabled && $$.main.selectAll(".".concat(config_classes.shapes)).selectAll(".".concat(config_classes.shape)).each(function (d, i) {
11576 var shape = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this),
11577 id = d.data ? d.data.id : d.id,
11578 toggle = $$.getToggle(this, d).bind($$),
11579 isTargetId = config.data_selection_grouped || !ids || ids.indexOf(id) >= 0,
11580 isTargetIndex = !indices || indices.indexOf(i) >= 0,
11581 isSelected = shape.classed(config_classes.SELECTED);
11582 // line/area selection not supported yet
11583 shape.classed(config_classes.line) || shape.classed(config_classes.area) || (isTargetId && isTargetIndex ? config.data_selection_isselectable(d) && !isSelected && toggle(!0, shape.classed(config_classes.SELECTED, !0), d, i) : isDefined(resetOther) && resetOther && isSelected && toggle(!1, shape.classed(config_classes.SELECTED, !1), d, i));
11584 });
11585 },
11586
11587 /**
11588 * Set data points to be un-selected.
11589 * @method unselect
11590 * @instance
11591 * @memberof Chart
11592 * @param {String|Array} [ids] id value to be unselected.
11593 * @param {Array} [indices] The index array of data points. If falsy value given, will select all data points.
11594 * @example
11595 * // unselect all data points
11596 * chart.unselect();
11597 *
11598 * // unselect all from 'data1'
11599 * chart.unselect("data1");
11600 *
11601 * // unselect from 'data1', indices 2
11602 * chart.unselect("data1", [2]);
11603 */
11604 unselect: function unselect(ids, indices) {
11605 var $$ = this.internal,
11606 config = $$.config;
11607 config.data_selection_enabled && $$.main.selectAll(".".concat(config_classes.shapes)).selectAll(".".concat(config_classes.shape)).each(function (d, i) {
11608 var shape = Object(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["select"])(this),
11609 id = d.data ? d.data.id : d.id,
11610 toggle = $$.getToggle(this, d).bind($$),
11611 isTargetId = config.data_selection_grouped || !ids || ids.indexOf(id) >= 0,
11612 isTargetIndex = !indices || indices.indexOf(i) >= 0,
11613 isSelected = shape.classed(config_classes.SELECTED);
11614 // line/area selection not supported yet
11615 shape.classed(config_classes.line) || shape.classed(config_classes.area) || isTargetId && isTargetIndex && config.data_selection_isselectable(d) && isSelected && toggle(!1, shape.classed(config_classes.SELECTED, !1), d, i);
11616 });
11617 }
11618});
11619// CONCATENATED MODULE: ./src/api/api.transform.js
11620/**
11621 * Copyright (c) 2017 ~ present NAVER Corp.
11622 * billboard.js project is licensed under the MIT license
11623 */
11624
11625
11626
11627extend(Chart_Chart.prototype, {
11628 /**
11629 * Change the type of the chart.
11630 * @method transform
11631 * @instance
11632 * @memberof Chart
11633 * @param {String} type Specify the type to be transformed. The types listed in data.type can be used.
11634 * @param {String|Array} targetIds Specify targets to be transformed. If not given, all targets will be the candidate.
11635 * @example
11636 * // all targets will be bar chart.
11637 * chart.transform("bar");
11638 *
11639 * // only data1 will be bar chart.
11640 * chart.transform("bar", "data1");
11641 *
11642 * // only data1 and data2 will be bar chart.
11643 * chart.transform("bar", ["data1", "data2"]);
11644 */
11645 transform: function transform(type, targetIds) {
11646 var $$ = this.internal,
11647 options = ["pie", "donut"].indexOf(type) >= 0 ? {
11648 withTransform: !0
11649 } : null;
11650 $$.transformTo(targetIds, type, options);
11651 }
11652}), extend(ChartInternal_ChartInternal.prototype, {
11653 /**
11654 * Change the type of the chart.
11655 * @private
11656 * @param {String|Array} targetIds
11657 * @param {String} type
11658 * @param {Object} optionsForRedraw
11659 */
11660 transformTo: function transformTo(targetIds, type, optionsForRedraw) {
11661 var $$ = this,
11662 options = optionsForRedraw || {
11663 withTransitionForAxis: !$$.hasArcType()
11664 };
11665 // this is needed when transforming to arc
11666 options.withTransitionForTransform = !1, $$.transiting = !1, $$.setTargetType(targetIds, type), $$.updateTargets($$.data.targets), $$.updateAndRedraw(options);
11667 }
11668});
11669// CONCATENATED MODULE: ./src/api/api.group.js
11670/**
11671 * Copyright (c) 2017 ~ present NAVER Corp.
11672 * billboard.js project is licensed under the MIT license
11673 */
11674
11675
11676extend(Chart_Chart.prototype, {
11677 /**
11678 * Update groups for the targets.
11679 * @method groups
11680 * @instance
11681 * @memberof Chart
11682 * @param {Array} groups This argument needs to be an Array that includes one or more Array that includes target ids to be grouped.
11683 * @return {Array} Grouped data names array
11684 * @example
11685 * // data1 and data2 will be a new group.
11686 * chart.groups([
11687 * ["data1", "data2"]
11688 * ]);
11689 */
11690 groups: function groups(_groups) {
11691 var $$ = this.internal,
11692 config = $$.config;
11693 return isUndefined(_groups) ? config.data_groups : (config.data_groups = _groups, $$.redraw(), config.data_groups);
11694 }
11695});
11696// CONCATENATED MODULE: ./src/api/api.grid.js
11697/**
11698 * Copyright (c) 2017 ~ present NAVER Corp.
11699 * billboard.js project is licensed under the MIT license
11700 */
11701
11702
11703/**
11704 * Update x grid lines.
11705 * @method xgrids
11706 * @instance
11707 * @memberof Chart
11708 * @param {Array} grids X grid lines will be replaced with this argument. The format of this argument is the same as grid.x.lines.
11709 * @example
11710 * // Show 2 x grid lines
11711 * chart.xgrids([
11712 * {value: 1, text: "Label 1"},
11713 * {value: 4, text: "Label 4"}
11714 * ]);
11715 */
11716
11717var xgrids = function (grids) {
11718 var $$ = this.internal,
11719 config = $$.config;
11720 return grids ? (config.grid_x_lines = grids, $$.redrawWithoutRescale(), config.grid_x_lines) : config.grid_x_lines;
11721};
11722
11723extend(xgrids, {
11724 /**
11725 * Add x grid lines.<br>
11726 * This API adds new x grid lines instead of replacing like xgrids.
11727 * @method xgrids․add
11728 * @instance
11729 * @memberof Chart
11730 * @param {Array|Object} grids New x grid lines will be added. The format of this argument is the same as grid.x.lines and it's possible to give an Object if only one line will be added.
11731 * @example
11732 * // Add a new x grid line
11733 * chart.xgrids.add(
11734 * {value: 4, text: "Label 4"}
11735 * );
11736 *
11737 * // Add new x grid lines
11738 * chart.xgrids.add([
11739 * {value: 2, text: "Label 2"},
11740 * {value: 4, text: "Label 4"}
11741 * ]);
11742 */
11743 add: function add(grids) {
11744 return this.xgrids(this.internal.config.grid_x_lines.concat(grids || []));
11745 },
11746
11747 /**
11748 * Remove x grid lines.<br>
11749 * This API removes x grid lines.
11750 * @method xgrids․remove
11751 * @instance
11752 * @memberof Chart
11753 * @param {Object} params This argument should include value or class. If value is given, the x grid lines that have specified x value will be removed. If class is given, the x grid lines that have specified class will be removed. If args is not given, all of x grid lines will be removed.
11754 * @example
11755 * // x grid line on x = 2 will be removed
11756 * chart.xgrids.remove({value: 2});
11757 *
11758 * // x grid lines that have 'grid-A' will be removed
11759 * chart.xgrids.remove({
11760 * class: "grid-A"
11761 * });
11762 *
11763 * // all of x grid lines will be removed
11764 * chart.xgrids.remove();
11765 */
11766 remove: function remove(params) {
11767 // TODO: multiple
11768 this.internal.removeGridLines(params, !0);
11769 }
11770});
11771
11772/**
11773 * Update y grid lines.
11774 * @method ygrids
11775 * @instance
11776 * @memberof Chart
11777 * @param {Array} grids Y grid lines will be replaced with this argument. The format of this argument is the same as grid.y.lines.
11778 * @example
11779 * // Show 2 y grid lines
11780 * chart.ygrids([
11781 * {value: 100, text: "Label 1"},
11782 * {value: 400, text: "Label 4"}
11783 * ]);
11784 */
11785var ygrids = function (grids) {
11786 var $$ = this.internal,
11787 config = $$.config;
11788 return grids ? (config.grid_y_lines = grids, $$.redrawWithoutRescale(), config.grid_y_lines) : config.grid_y_lines;
11789};
11790
11791extend(ygrids, {
11792 /**
11793 * Add y grid lines.<br>
11794 * This API adds new y grid lines instead of replacing like ygrids.
11795 * @method ygrids․add
11796 * @instance
11797 * @memberof Chart
11798 * @param {Array|Object} grids New y grid lines will be added. The format of this argument is the same as grid.y.lines and it's possible to give an Object if only one line will be added.
11799 * @example
11800 * // Add a new x grid line
11801 * chart.ygrids.add(
11802 * {value: 400, text: "Label 4"}
11803 * );
11804 *
11805 * // Add new x grid lines
11806 * chart.ygrids.add([
11807 * {value: 200, text: "Label 2"},
11808 * {value: 400, text: "Label 4"}
11809 * ]);
11810 */
11811 add: function add(grids) {
11812 return this.ygrids(this.internal.config.grid_y_lines.concat(grids || []));
11813 },
11814
11815 /**
11816 * Remove y grid lines.<br>
11817 * This API removes x grid lines.
11818 * @method ygrids․remove
11819 * @instance
11820 * @memberof Chart
11821 * @param {Object} params This argument should include value or class. If value is given, the y grid lines that have specified y value will be removed. If class is given, the y grid lines that have specified class will be removed. If args is not given, all of y grid lines will be removed.
11822 * @example
11823 * // y grid line on y = 200 will be removed
11824 * chart.ygrids.remove({value: 200});
11825 *
11826 * // y grid lines that have 'grid-A' will be removed
11827 * chart.ygrids.remove({
11828 * class: "grid-A"
11829 * });
11830 *
11831 * // all of y grid lines will be removed
11832 * chart.ygrids.remove();
11833 */
11834 remove: function remove(params) {
11835 // TODO: multiple
11836 this.internal.removeGridLines(params, !1);
11837 }
11838}), extend(Chart_Chart.prototype, {
11839 xgrids: xgrids,
11840 ygrids: ygrids
11841});
11842// CONCATENATED MODULE: ./src/api/api.region.js
11843/**
11844 * Copyright (c) 2017 ~ present NAVER Corp.
11845 * billboard.js project is licensed under the MIT license
11846 */
11847
11848
11849
11850/**
11851 * Update regions.
11852 * @method regions
11853 * @instance
11854 * @memberof Chart
11855 * @param {Array} regions Regions will be replaced with this argument. The format of this argument is the same as regions.
11856 * @return {Array} regions
11857 * @example
11858 * // Show 2 regions
11859 * chart.regions([
11860 * {axis: "x", start: 5, class: "regionX"},
11861 * {axis: "y", end: 50, class: "regionY"}
11862 * ]);
11863 */
11864
11865var api_region_regions = function (_regions) {
11866 var $$ = this.internal,
11867 config = $$.config;
11868 return _regions ? (config.regions = _regions, $$.redrawWithoutRescale(), _regions) : config.regions;
11869};
11870
11871extend(api_region_regions, {
11872 /**
11873 * Add new region.<br><br>
11874 * This API adds new region instead of replacing like regions.
11875 * @method regions․add
11876 * @instance
11877 * @memberof Chart
11878 * @param {Array|Object} regions New region will be added. The format of this argument is the same as regions and it's possible to give an Object if only one region will be added.
11879 * @return {Array} regions
11880 * @example
11881 * // Add a new region
11882 * chart.regions.add(
11883 * {axis: "x", start: 5, class: "regionX"}
11884 * );
11885 *
11886 * // Add new regions
11887 * chart.regions.add([
11888 * {axis: "x", start: 5, class: "regionX"},
11889 * {axis: "y", end: 50, class: "regionY"}
11890 *]);
11891 */
11892 add: function add(regions) {
11893 var $$ = this.internal,
11894 config = $$.config;
11895 return regions ? (config.regions = config.regions.concat(regions), $$.redrawWithoutRescale(), config.regions) : config.regions;
11896 },
11897
11898 /**
11899 * Remove regions.<br><br>
11900 * This API removes regions.
11901 * @method regions․remove
11902 * @instance
11903 * @memberof Chart
11904 * @param {Object} regions This argument should include classes. If classes is given, the regions that have one of the specified classes will be removed. If args is not given, all of regions will be removed.
11905 * @return {Array} regions Removed regions
11906 * @example
11907 * // regions that have 'region-A' or 'region-B' will be removed.
11908 * chart.regions.remove({
11909 * classes: [
11910 * "region-A", "region-B"
11911 * ]
11912 * });
11913 *
11914 * // all of regions will be removed.
11915 * chart.regions.remove();
11916 */
11917 remove: function remove(optionsValue) {
11918 var $$ = this.internal,
11919 config = $$.config,
11920 options = optionsValue || {},
11921 duration = getOption(options, "duration", config.transition_duration),
11922 classes = getOption(options, "classes", [config_classes.region]),
11923 regions = $$.main.select(".".concat(config_classes.regions)).selectAll(classes.map(function (c) {
11924 return ".".concat(c);
11925 }));
11926 return (duration ? regions.transition().duration(duration) : regions).style("opacity", "0").remove(), regions = config.regions, Object.keys(options).length ? (regions = regions.filter(function (region) {
11927 var found = !1;
11928 return !region.class || (region.class.split(" ").forEach(function (c) {
11929 classes.indexOf(c) >= 0 && (found = !0);
11930 }), !found);
11931 }), config.regions = regions) : config.regions = [], regions;
11932 }
11933}), extend(Chart_Chart.prototype, {
11934 regions: api_region_regions
11935});
11936// CONCATENATED MODULE: ./src/api/api.data.js
11937/**
11938 * Copyright (c) 2017 ~ present NAVER Corp.
11939 * billboard.js project is licensed under the MIT license
11940 */
11941
11942
11943/**
11944 * Get data loaded in the chart.
11945 * @method data
11946 * @instance
11947 * @memberof Chart
11948 * @param {String|Array} targetIds If this argument is given, this API returns the specified target data. If this argument is not given, all of data will be returned.
11949 * @return {Array} Data objects
11950 * @example
11951 * // Get only data1 data
11952 * chart.data("data1");
11953 * // --> [{id: "data1", id_org: "data1", values: Array(6)}, ...]
11954 *
11955 * // Get data1 and data2 data
11956 * chart.data(["data1", "data2"]);
11957 *
11958 * // Get all data
11959 * chart.data();
11960 */
11961
11962var api_data_data = function (targetIds) {
11963 var targets = this.internal.data.targets;
11964 return isUndefined(targetIds) ? targets : targets.filter(function (t) {
11965 return targetIds.indexOf(t.id) >= 0;
11966 });
11967};
11968
11969extend(api_data_data, {
11970 /**
11971 * Get data shown in the chart.
11972 * @method data․shown
11973 * @instance
11974 * @memberof Chart
11975 * @param {String|Array} targetIds If this argument is given, this API filters the data with specified target ids. If this argument is not given, all shown data will be returned.
11976 * @return {Array} Data objects
11977 * @example
11978 * // Get shown data by filtering to include only data1 data
11979 * chart.data.shown("data1");
11980 * // --> [{id: "data1", id_org: "data1", values: Array(6)}, ...]
11981 *
11982 * // Get shown data by filtering to include data1 and data2 data
11983 * chart.data.shown(["data1", "data2"]);
11984 *
11985 * // Get all shown data
11986 * chart.data.shown();
11987 */
11988 shown: function shown(targetIds) {
11989 return this.internal.filterTargetsToShow(this.data(targetIds));
11990 },
11991
11992 /**
11993 * Get values of the data loaded in the chart.
11994 * @method data․values
11995 * @instance
11996 * @memberof Chart
11997 * @param {String|Array} targetIds This API returns the values of specified target. If this argument is not given, null will be retruned
11998 * @return {Array} Data values
11999 * @example
12000 * // Get data1 values
12001 * chart.data.values("data1");
12002 * // --> [10, 20, 30, 40]
12003 */
12004 values: function (targetId) {
12005 var flat = !(arguments.length > 1 && arguments[1] !== undefined) || arguments[1],
12006 values = null;
12007
12008 if (targetId) {
12009 var targets = this.data(targetId);
12010 targets && isArray(targets) && (values = [], targets.forEach(function (v) {
12011 var dataValue = v.values.map(function (d) {
12012 return d.value;
12013 });
12014 flat ? values = values.concat(dataValue) : values.push(dataValue);
12015 }));
12016 }
12017
12018 return values;
12019 },
12020
12021 /**
12022 * Get and set names of the data loaded in the chart.
12023 * @method data․names
12024 * @instance
12025 * @memberof Chart
12026 * @param {Object} names If this argument is given, the names of data will be updated. If not given, the current names will be returned. The format of this argument is the same as
12027 * @return {Object} Corresponding names according its key value, if specified names values.
12028 * @example
12029 * // Get current names
12030 * chart.data.names();
12031 * // --> {data1: "test1", data2: "test2"}
12032 *
12033 * // Update names
12034 * chart.data.names({
12035 * data1: "New Name 1",
12036 * data2: "New Name 2"
12037 *});
12038 */
12039 names: function names(_names) {
12040 return this.internal.clearLegendItemTextBoxCache(), this.internal.updateDataAttributes("names", _names);
12041 },
12042
12043 /**
12044 * Get and set colors of the data loaded in the chart.
12045 * @method data․colors
12046 * @instance
12047 * @memberof Chart
12048 * @param {Object} colors If this argument is given, the colors of data will be updated. If not given, the current colors will be returned. The format of this argument is the same as [data.colors](./Options.html#.data%25E2%2580%25A4colors).
12049 * @return {Object} Corresponding data color value according its key value.
12050 * @example
12051 * // Get current colors
12052 * chart.data.colors();
12053 * // --> {data1: "#00c73c", data2: "#fa7171"}
12054 *
12055 * // Update colors
12056 * chart.data.colors({
12057 * data1: "#FFFFFF",
12058 * data2: "#000000"
12059 * });
12060 */
12061 colors: function colors(_colors) {
12062 return this.internal.updateDataAttributes("colors", _colors);
12063 },
12064
12065 /**
12066 * Get and set axes of the data loaded in the chart.
12067 * @method data․axes
12068 * @instance
12069 * @memberof Chart
12070 * @param {Object} axes If this argument is given, the axes of data will be updated. If not given, the current axes will be returned. The format of this argument is the same as
12071 * @return {Object} Corresponding axes value for data, if specified axes value.
12072 * @example
12073 * // Get current axes
12074 * chart.data.axes();
12075 * // --> {data1: "y"}
12076 *
12077 * // Update axes
12078 * chart.data.axes({
12079 * data1: "y",
12080 * data2: "y2"
12081 * });
12082 */
12083 axes: function axes(_axes) {
12084 return this.internal.updateDataAttributes("axes", _axes);
12085 },
12086
12087 /**
12088 * Get the minimum data value bound to the chart
12089 * @method data․min
12090 * @instance
12091 * @memberof Chart
12092 * @return {Array} Data objects
12093 * @example
12094 * // Get current axes
12095 * chart.data.min();
12096 * // --> [{x: 0, value: 30, id: "data1", index: 0}, ...]
12097 */
12098 min: function min() {
12099 return this.internal.getMinMaxData().min;
12100 },
12101
12102 /**
12103 * Get the maximum data value bound to the chart
12104 * @method data․max
12105 * @instance
12106 * @memberof Chart
12107 * @return {Array} Data objects
12108 * @example
12109 * // Get current axes
12110 * chart.data.max();
12111 * // --> [{x: 3, value: 400, id: "data1", index: 3}, ...]
12112 */
12113 max: function max() {
12114 return this.internal.getMinMaxData().max;
12115 }
12116}), extend(Chart_Chart.prototype, {
12117 data: api_data_data
12118});
12119// CONCATENATED MODULE: ./src/api/api.category.js
12120/**
12121 * Copyright (c) 2017 ~ present NAVER Corp.
12122 * billboard.js project is licensed under the MIT license
12123 */
12124
12125
12126extend(Chart_Chart.prototype, {
12127 /**
12128 * Set specified category name on category axis.
12129 * @method category
12130 * @instance
12131 * @memberof Chart
12132 * @param {Number} i index of category to be changed
12133 * @param {String} category category value to be changed
12134 * @example
12135 * chart.category(2, "Category 3");
12136 */
12137 category: function category(i, _category) {
12138 var $$ = this.internal,
12139 config = $$.config;
12140 return arguments.length > 1 && (config.axis_x_categories[i] = _category, $$.redraw()), config.axis_x_categories[i];
12141 },
12142
12143 /**
12144 * Set category names on category axis.
12145 * @method categories
12146 * @instance
12147 * @memberof Chart
12148 * @param {Array} categories This must be an array that includes category names in string. If category names are included in the date by data.x option, this is not required.
12149 * @example
12150 * chart.categories([
12151 * "Category 1", "Category 2", ...
12152 * ]);
12153 */
12154 categories: function categories(_categories) {
12155 var $$ = this.internal,
12156 config = $$.config;
12157 return arguments.length ? (config.axis_x_categories = _categories, $$.redraw(), config.axis_x_categories) : config.axis_x_categories;
12158 }
12159});
12160// CONCATENATED MODULE: ./src/api/api.color.js
12161/**
12162 * Copyright (c) 2017 ~ present NAVER Corp.
12163 * billboard.js project is licensed under the MIT license
12164 */
12165
12166
12167extend(Chart_Chart.prototype, {
12168 /**
12169 * Get the color
12170 * @method color
12171 * @instance
12172 * @memberof Chart
12173 * @param {String} id id to get the color
12174 * @example
12175 * chart.color("data1");
12176 */
12177 color: function color(id) {
12178 return this.internal.color(id); // more patterns
12179 }
12180});
12181// CONCATENATED MODULE: ./src/api/api.x.js
12182/**
12183 * Copyright (c) 2017 ~ present NAVER Corp.
12184 * billboard.js project is licensed under the MIT license
12185 */
12186
12187
12188extend(Chart_Chart.prototype, {
12189 /**
12190 * Get and set x values for the chart.
12191 * @method x
12192 * @instance
12193 * @memberof Chart
12194 * @param {Array} x If x is given, x values of every target will be updated. If no argument is given, current x values will be returned as an Object whose keys are the target ids.
12195 * @return {Object} xs
12196 * @example
12197 * // Get current x values
12198 * chart.x();
12199 *
12200 * // Update x values for all targets
12201 * chart.x([100, 200, 300, 400, ...]);
12202 */
12203 x: function x(_x) {
12204 var $$ = this.internal,
12205 isCategorized = $$.isCustomX() && $$.isCategorized();
12206 return isArray(_x) && (isCategorized ? $$.api.categories(_x) : ($$.updateTargetX($$.data.targets, _x), $$.redraw({
12207 withUpdateOrgXDomain: !0,
12208 withUpdateXDomain: !0
12209 }))), isCategorized ? $$.api.categories() : $$.data.xs;
12210 },
12211
12212 /**
12213 * Get and set x values for the chart.
12214 * @method xs
12215 * @instance
12216 * @memberof Chart
12217 * @param {Array} xs If xs is given, specified target's x values will be updated. If no argument is given, current x values will be returned as an Object whose keys are the target ids.
12218 * @return {Object} xs
12219 * @example
12220 * // Get current x values
12221 * chart.xs();
12222 *
12223 * // Update x values for all targets
12224 * chart.xs({
12225 * data1: [10, 20, 30, 40, ...],
12226 * data2: [100, 200, 300, 400, ...]
12227 * });
12228 */
12229 xs: function xs(_xs) {
12230 var $$ = this.internal;
12231 return isObject(_xs) && ($$.updateTargetXs($$.data.targets, _xs), $$.redraw({
12232 withUpdateOrgXDomain: !0,
12233 withUpdateXDomain: !0
12234 })), $$.data.xs;
12235 }
12236});
12237// CONCATENATED MODULE: ./src/api/api.axis.js
12238/**
12239 * Copyright (c) 2017 ~ present NAVER Corp.
12240 * billboard.js project is licensed under the MIT license
12241 */
12242
12243
12244/**
12245 * Set the min/max value
12246 * @param {Chart} $$
12247 * @param {String} type
12248 * @param {Object} value
12249 * @return {undefined}
12250 * @private
12251 */
12252
12253var setMinMax = function ($$, type, value) {
12254 var config = $$.config,
12255 axisX = "axis_x_".concat(type),
12256 axisY = "axis_y_".concat(type),
12257 axisY2 = "axis_y2_".concat(type);
12258 return isDefined(value) && (isObjectType(value) ? (isValue(value.x) && (config[axisX] = value.x), isValue(value.y) && (config[axisY] = value.y), isValue(value.y2) && (config[axisY2] = value.y2)) : (config[axisY] = value, config[axisY2] = value), $$.redraw({
12259 withUpdateOrgXDomain: !0,
12260 withUpdateXDomain: !0
12261 })), undefined;
12262},
12263 getMinMax = function ($$, type) {
12264 var config = $$.config;
12265 return {
12266 x: config["axis_x_".concat(type)],
12267 y: config["axis_y_".concat(type)],
12268 y2: config["axis_y2_".concat(type)]
12269 };
12270},
12271 api_axis_axis = extend(function () {}, {
12272 /**
12273 * Get and set axis labels.
12274 * @method axis․labels
12275 * @instance
12276 * @memberof Chart
12277 * @param {Object} labels specified axis' label to be updated.
12278 * @example
12279 * // Update axis' label
12280 * chart.axis.labels({
12281 * x: "New X Axis Label",
12282 * y: "New Y Axis Label"
12283 * });
12284 */
12285 labels: function labels(_labels) {
12286 var $$ = this.internal;
12287 arguments.length && (Object.keys(_labels).forEach(function (axisId) {
12288 $$.axis.setLabelText(axisId, _labels[axisId]);
12289 }), $$.axis.updateLabels());
12290 },
12291
12292 /**
12293 * Get and set axis min value.
12294 * @method axis․min
12295 * @instance
12296 * @memberof Chart
12297 * @param {Object} min If min is given, specified axis' min value will be updated.<br>
12298 * If no argument is given, the min values set on generating option for each axis will be returned.
12299 * If not set any min values on generation, it will return `undefined`.
12300 * @example
12301 * // Update axis' min
12302 * chart.axis.min({
12303 * x: -10,
12304 * y: 1000,
12305 * y2: 100
12306 * });
12307 */
12308 min: function min(_min) {
12309 var $$ = this.internal;
12310 return arguments.length ? setMinMax($$, "min", _min) : getMinMax($$, "min");
12311 },
12312
12313 /**
12314 * Get and set axis max value.
12315 * @method axis․max
12316 * @instance
12317 * @memberof Chart
12318 * @param {Object} max If max is given, specified axis' max value will be updated.<br>
12319 * If no argument is given, the max values set on generating option for each axis will be returned.
12320 * If not set any max values on generation, it will return `undefined`.
12321 * @example
12322 * // Update axis' label
12323 * chart.axis.max({
12324 * x: 100,
12325 * y: 1000,
12326 * y2: 10000
12327 * });
12328 */
12329 max: function max(_max) {
12330 var $$ = this.internal;
12331 return arguments.length ? setMinMax($$, "max", _max) : getMinMax($$, "max");
12332 },
12333
12334 /**
12335 * Get and set axis min and max value.
12336 * @method axis․range
12337 * @instance
12338 * @memberof Chart
12339 * @param {Object} range If range is given, specified axis' min and max value will be updated. If no argument is given, the current min and max values for each axis will be returned.
12340 * @example
12341 * // Update axis' label
12342 * chart.axis.range({
12343 * min: {
12344 * x: -10,
12345 * y: -1000,
12346 * y2: -10000
12347 * },
12348 * max: {
12349 * x: 100,
12350 * y: 1000,
12351 * y2: 10000
12352 * },
12353 * });
12354 */
12355 range: function range(_range) {
12356 var axis = this.axis;
12357 if (arguments.length) isDefined(_range.max) && axis.max(_range.max), isDefined(_range.min) && axis.min(_range.min);else return {
12358 max: axis.max(),
12359 min: axis.min()
12360 };
12361 return undefined;
12362 }
12363});
12364/**
12365 * Get the min/max value
12366 * @param {Chart} $$
12367 * @param {String} type
12368 * @return {{x, y, y2}}
12369 * @private
12370 */
12371
12372
12373extend(Chart_Chart.prototype, {
12374 axis: api_axis_axis
12375});
12376// CONCATENATED MODULE: ./src/api/api.legend.js
12377/**
12378 * Copyright (c) 2017 ~ present NAVER Corp.
12379 * billboard.js project is licensed under the MIT license
12380 */
12381
12382
12383/**
12384 * Define legend
12385 * @ignore
12386 */
12387
12388var legend = extend(function () {}, {
12389 /**
12390 * Show legend for each target.
12391 * @method legend․show
12392 * @instance
12393 * @memberof Chart
12394 * @param {String|Array} targetIds
12395 * - If targetIds is given, specified target's legend will be shown.
12396 * - If only one target is the candidate, String can be passed.
12397 * - If no argument is given, all of target's legend will be shown.
12398 * @example
12399 * // Show legend for data1.
12400 * chart.legend.show("data1");
12401 *
12402 * // Show legend for data1 and data2.
12403 * chart.legend.show(["data1", "data2"]);
12404 *
12405 * // Show all legend.
12406 * chart.legend.show();
12407 */
12408 show: function show(targetIds) {
12409 var $$ = this.internal;
12410 $$.showLegend($$.mapToTargetIds(targetIds)), $$.updateAndRedraw({
12411 withLegend: !0
12412 });
12413 },
12414
12415 /**
12416 * Hide legend for each target.
12417 * @method legend․hide
12418 * @instance
12419 * @memberof Chart
12420 * @param {String|Array} targetIds
12421 * - If targetIds is given, specified target's legend will be hidden.
12422 * - If only one target is the candidate, String can be passed.
12423 * - If no argument is given, all of target's legend will be hidden.
12424 * @example
12425 * // Hide legend for data1.
12426 * chart.legend.hide("data1");
12427 *
12428 * // Hide legend for data1 and data2.
12429 * chart.legend.hide(["data1", "data2"]);
12430 *
12431 * // Hide all legend.
12432 * chart.legend.hide();
12433 */
12434 hide: function hide(targetIds) {
12435 var $$ = this.internal;
12436 $$.hideLegend($$.mapToTargetIds(targetIds)), $$.updateAndRedraw({
12437 withLegend: !0
12438 });
12439 }
12440});
12441extend(Chart_Chart.prototype, {
12442 legend: legend
12443});
12444// CONCATENATED MODULE: ./src/internals/browser.js
12445/**
12446 * Copyright (c) 2017 ~ present NAVER Corp.
12447 * billboard.js project is licensed under the MIT license
12448 */
12449
12450/**
12451 * Window object
12452 * @module
12453 * @ignore
12454 */
12455
12456/* eslint-disable no-new-func */
12457
12458var win = isDefined(window) && window.Math === Math ? window : isDefined(self) && (self.Math === Math ? self : Function("return this")()),
12459 browser_doc = win.document;
12460/* eslint-enable no-new-func */
12461
12462
12463// CONCATENATED MODULE: ./src/api/api.chart.js
12464/**
12465 * Copyright (c) 2017 ~ present NAVER Corp.
12466 * billboard.js project is licensed under the MIT license
12467 */
12468
12469
12470
12471extend(Chart_Chart.prototype, {
12472 /**
12473 * Resize the chart.
12474 * @method resize
12475 * @instance
12476 * @memberof Chart
12477 * @param {Object} size This argument should include width and height in pixels.
12478 * @example
12479 * // Resize to 640x480
12480 * chart.resize({
12481 * width: 640,
12482 * height: 480
12483 * });
12484 */
12485 resize: function resize(size) {
12486 var config = this.internal.config;
12487 config.size_width = size ? size.width : null, config.size_height = size ? size.height : null, this.flush();
12488 },
12489
12490 /**
12491 * Force to redraw.
12492 * @method flush
12493 * @instance
12494 * @memberof Chart
12495 * @param {Boolean} [soft] For soft redraw.
12496 * @example
12497 * chart.flush();
12498 *
12499 * // for soft redraw
12500 * chart.flush(true);
12501 */
12502 flush: function flush(soft) {
12503 var $$ = this.internal; // reset possible zoom scale
12504
12505 $$.zoomScale = null, soft ? $$.redraw({
12506 withTransform: !0,
12507 withUpdateXDomain: !0,
12508 withUpdateOrgXDomain: !0,
12509 withLegend: !0
12510 }) : $$.updateAndRedraw({
12511 withLegend: !0,
12512 withTransition: !1,
12513 withTransitionForTransform: !1
12514 });
12515 },
12516
12517 /**
12518 * Reset the chart object and remove element and events completely.
12519 * @method destroy
12520 * @instance
12521 * @memberof Chart
12522 * @example
12523 * chart.destroy();
12524 */
12525 destroy: function destroy() {
12526 var _this = this,
12527 $$ = this.internal;
12528
12529 return notEmpty($$) && ($$.charts.splice($$.charts.indexOf(this), 1), isDefined($$.resizeTimeout) && win.clearTimeout($$.resizeTimeout), win.removeEventListener("resize", $$.resizeFunction), $$.selectChart.classed("bb", !1).html(""), Object.keys(this).forEach(function (key) {
12530 key === "internal" && Object.keys($$).forEach(function (k) {
12531 $$[k] = null;
12532 }), _this[key] = null, delete _this[key];
12533 })), null;
12534 },
12535
12536 /**
12537 * Get or set single config option value.
12538 * @method config
12539 * @instance
12540 * @memberof Chart
12541 * @param {String} name The option key name.
12542 * @param {*} [value] The value accepted for indicated option.
12543 * @param {Boolean} [redraw] Set to redraw with the new option changes.
12544 * - **NOTE:** Doesn't guarantee work in all circumstances. It can be applied for limited options only.
12545 * @example
12546 * // Getter
12547 * chart.config("gauge.max");
12548 *
12549 * // Setter
12550 * chart.config("gauge.max", 100);
12551 *
12552 * // Setter & redraw with the new option
12553 * chart.config("gauge.max", 100, true);
12554 */
12555 config: function config(name, value, redraw) {
12556 var res,
12557 $$ = this.internal,
12558 key = name && name.replace(/\./g, "_");
12559 return key in $$.config && (isDefined(value) ? ($$.config[key] = value, res = value, redraw && this.flush(!0)) : res = $$.config[key]), res;
12560 }
12561});
12562// CONCATENATED MODULE: ./src/api/api.tooltip.js
12563/**
12564 * Copyright (c) 2017 ~ present NAVER Corp.
12565 * billboard.js project is licensed under the MIT license
12566 */
12567
12568
12569/**
12570 * Define tooltip
12571 * @ignore
12572 */
12573
12574var tooltip = extend(function () {}, {
12575 /**
12576 * Show tooltip
12577 * @method tooltip․show
12578 * @instance
12579 * @memberof Chart
12580 * @param {Object} args The object can consist with following members:<br>
12581 *
12582 * | Key | Type | Description |
12583 * | --- | --- | --- |
12584 * | index | Number | Determine focus by index |
12585 * | x | Number &vert; Date | Determine focus by x Axis index |
12586 * | data | Object | Determine focus data with following keys: `x` or `index`.<br>When [data.xs](Options.html#.data%25E2%2580%25A4xs) option is set, the target is determined by mouse position and needs specify `x`, `id` and `value`. |
12587 * | mouse | Array | Determine x and y coordinate value relative the targeted x Axis element.<br>It should be used along with `data`, `index` or `x` value. The default value is set as `[0,0]` |
12588 *
12589 * @example
12590 * // show the 2nd x Axis coordinate tooltip
12591 * chart.tooltip.show({
12592 * index: 1
12593 * });
12594 *
12595 * // show tooltip for the 3rd x Axis in x:50 and y:100 coordinate relative the x Axis element.
12596 * chart.tooltip.show({
12597 * data: {x: 2},
12598 * mouse: [50, 100]
12599 * });
12600 *
12601 * // show tooltip for timeseries x axis
12602 * chart.tooltip.show({
12603 * x: new Date("2018-01-02 00:00")
12604 * });
12605 */
12606 show: function show() {
12607 var index,
12608 mouse,
12609 args = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
12610 $$ = this.internal;
12611 // emulate events to show
12612 args.mouse && (mouse = args.mouse), args.data ? $$.isMultipleX() ? (mouse = [$$.x(args.data.x), $$.getYScale(args.data.id)(args.data.value)], index = null) : index = isValue(args.data.index) ? args.data.index : $$.getIndexByX(args.data.x) : isDefined(args.x) ? index = $$.getIndexByX(args.x) : isDefined(args.index) && (index = args.index), ($$.inputType === "mouse" ? ["mouseover", "mousemove"] : ["touchstart"]).forEach(function (eventName) {
12613 $$.dispatchEvent(eventName, index, mouse);
12614 });
12615 },
12616
12617 /**
12618 * Hide tooltip
12619 * @method tooltip․hide
12620 * @instance
12621 * @memberof Chart
12622 */
12623 hide: function hide() {
12624 var $$ = this.internal;
12625 $$.hideTooltip(), $$.hideXGridFocus(), $$.unexpandCircles(), $$.unexpandBars();
12626 }
12627});
12628extend(Chart_Chart.prototype, {
12629 tooltip: tooltip
12630});
12631// CONCATENATED MODULE: ./src/internals/ua.js
12632/**
12633 * Copyright (c) 2017 ~ present NAVER Corp.
12634 * billboard.js project is licensed under the MIT license
12635 */
12636
12637
12638var ua = window.navigator.userAgent;
12639extend(ChartInternal_ChartInternal.prototype, {
12640 isSafari: function isSafari() {
12641 return ua.indexOf("Safari") > -1 && !this.isChrome();
12642 },
12643 isChrome: function isChrome() {
12644 return ua.indexOf("Chrome") > -1;
12645 },
12646 isMobile: function isMobile() {
12647 // https://developer.mozilla.org/en-US/docs/Web/HTTP/Browser_detection_using_the_user_agent
12648 return ua.indexOf("Mobi") > -1;
12649 }
12650});
12651// CONCATENATED MODULE: ./src/api/api.export.js
12652/**
12653 * Copyright (c) 2017 ~ present NAVER Corp.
12654 * billboard.js project is licensed under the MIT license
12655 */
12656
12657
12658
12659/**
12660 * Encode to base64
12661 * @param {String} str
12662 * @return {String}
12663 * @private
12664 * @see https://developer.mozilla.org/ko/docs/Web/API/WindowBase64/Base64_encoding_and_decoding
12665 */
12666
12667var b64EncodeUnicode = function (str) {
12668 return btoa(encodeURIComponent(str).replace(/%([0-9A-F]{2})/g, function (match, p) {
12669 return String.fromCharCode("0x".concat(p));
12670 }));
12671},
12672 nodeToSvgDataUrl = function (node) {
12673 var _node$getBoundingClie = node.getBoundingClientRect(),
12674 width = _node$getBoundingClie.width,
12675 height = _node$getBoundingClie.height,
12676 clone = node.cloneNode(!0),
12677 styleSheets = toArray(document.styleSheets),
12678 cssRules = getCssRules(styleSheets),
12679 cssText = cssRules.filter(function (r) {
12680 return r.cssText;
12681 }).map(function (r) {
12682 return r.cssText;
12683 });
12684
12685 clone.setAttribute("xmlns", external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["namespaces"].xhtml);
12686 var nodeXml = new XMLSerializer().serializeToString(clone),
12687 dataStr = "<svg xmlns=\"".concat(external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_["namespaces"].svg, "\" width=\"").concat(width, "\" height=\"").concat(height, "\">\n\t\t\t<foreignObject width=\"100%\" height=\"100%\">\n\t\t\t\t<style>").concat(cssText.join("\n"), "</style>\n\t\t\t\t").concat(nodeXml, "\n\t\t\t</foreignObject></svg>").replace(/#/g, "%23").replace("/\n/g", "%0A"); // foreignObject not supported in IE11 and below
12688 // https://msdn.microsoft.com/en-us/library/hh834675(v=vs.85).aspx
12689
12690 return "data:image/svg+xml;base64,".concat(b64EncodeUnicode(dataStr));
12691};
12692/**
12693 * Convert svg node to data url
12694 * @param {HTMLElement} node
12695 * @return {String}
12696 * @private
12697 */
12698
12699
12700extend(Chart_Chart.prototype, {
12701 /**
12702 * Export chart as an image.
12703 * - **NOTE:**
12704 * - IE11 and below not work properly due to the lack of the feature(<a href="https://msdn.microsoft.com/en-us/library/hh834675(v=vs.85).aspx">foreignObject</a>) support
12705 * - The basic CSS file(ex. billboard.css) should be at same domain as API call context to get correct styled export image.
12706 * @method export
12707 * @instance
12708 * @memberof Chart
12709 * @param {String} [mimeType=image/png] The desired output image format. (ex. 'image/png' for png, 'image/jpeg' for jpeg format)
12710 * @param {Function} [callback] The callback to be invoked when export is ready.
12711 * @return {String} dataURI
12712 * @example
12713 * chart.export();
12714 * // --> "data:image/svg+xml;base64,PHN..."
12715 *
12716 * // Initialize the download automatically
12717 * chart.export("image/png", dataUrl => {
12718 * const link = document.createElement("a");
12719 *
12720 * link.download = `${Date.now()}.png`;
12721 * link.href = dataUrl;
12722 * link.innerHTML = "Download chart as image";
12723 *
12724 * document.body.appendChild(link);
12725 * });
12726 */
12727 export: function _export() {
12728 var mimeType = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "image/png",
12729 callback = arguments.length > 1 ? arguments[1] : undefined,
12730 svgDataUrl = nodeToSvgDataUrl(this.element);
12731
12732 if (isFunction(callback)) {
12733 var img = new Image();
12734 img.crosssOrigin = "Anonymous", img.onload = function () {
12735 var canvas = document.createElement("canvas"),
12736 ctx = canvas.getContext("2d");
12737 canvas.width = img.width, canvas.height = img.height, ctx.drawImage(img, 0, 0), canvas.toBlob(function (blob) {
12738 callback(window.URL.createObjectURL(blob));
12739 }, mimeType);
12740 }, img.src = svgDataUrl;
12741 }
12742
12743 return svgDataUrl;
12744 }
12745});
12746// EXTERNAL MODULE: ./src/scss/billboard.scss
12747var billboard = __webpack_require__(26);
12748
12749// CONCATENATED MODULE: ./src/core.js
12750/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "bb", function() { return bb; });
12751/**
12752 * Copyright (c) 2017 ~ present NAVER Corp.
12753 * billboard project is licensed under the MIT license
12754 */
12755
12756
12757
12758
12759
12760
12761
12762
12763
12764
12765
12766
12767
12768
12769
12770
12771
12772
12773
12774
12775
12776
12777
12778
12779
12780
12781
12782
12783
12784
12785
12786
12787
12788
12789
12790
12791
12792
12793
12794
12795
12796
12797
12798
12799
12800
12801
12802
12803
12804
12805
12806
12807
12808
12809 // base CSS
12810
12811
12812/**
12813 * @namespace bb
12814 * @version 1.7.1
12815 */
12816
12817var bb = {
12818 /**
12819 * Version information
12820 * @property {String} version version
12821 * @example
12822 * bb.version; // "1.0.0"
12823 * @memberof bb
12824 */
12825 version: "1.7.1",
12826
12827 /**
12828 * Generate chart
12829 * @param {Options} options chart options
12830 * @memberof bb
12831 * @return {Chart}
12832 * @see {@link Options} for different generation options
12833 * @see {@link Chart} for different methods API
12834 * @example
12835 * <!-- chart holder -->
12836 * <div id="LineChart"></div>
12837 * @example
12838 * // generate chart with options
12839 * var chart = bb.generate({
12840 * "bindto": "#LineChart"
12841 * "data": {
12842 * "columns": [
12843 * ["data1", 30, 200, 100, 400, 150, 250],
12844 * ["data2", 50, 20, 10, 40, 15, 25]
12845 * ]
12846 * }
12847 * });
12848 *
12849 * // call some API
12850 * // ex) get the data of 'data1'
12851 * chart.data("data1");
12852 */
12853 generate: function generate(config) {
12854 var inst = new Chart_Chart(config);
12855 return inst.internal.charts = this.instance, this.instance.push(inst), inst;
12856 },
12857
12858 /**
12859 * An array containing instance created
12860 * @property {Array} instance instance array
12861 * @example
12862 * // generate charts
12863 * var chart1 = bb.generate(...);
12864 * var chart2 = bb.generate(...);
12865 *
12866 * bb.instance; // [ chart1, chart2, ... ]
12867 * @memberof bb
12868 */
12869 instance: [],
12870
12871 /**
12872 * Internal chart object
12873 * @private
12874 */
12875 chart: {
12876 fn: Chart_Chart.prototype,
12877 internal: {
12878 fn: ChartInternal_ChartInternal.prototype,
12879 axis: {
12880 fn: Axis_Axis.prototype
12881 }
12882 }
12883 }
12884};
12885
12886/* harmony default export */ var core = __webpack_exports__["default"] = (bb);
12887
12888/***/ })
12889/******/ ]);
12890});
12891//# sourceMappingURL=billboard.js.map
\No newline at end of file