UNPKG

27.9 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 * https://naver.github.io/billboard.js/
7 *
8 * @version 3.14.2
9 * @requires billboard.js
10 * @summary billboard.js plugin
11 */
12(function webpackUniversalModuleDefinition(root, factory) {
13 if(typeof exports === 'object' && typeof module === 'object')
14 module.exports = factory(require("d3-brush"), require("d3-selection"));
15 else if(typeof define === 'function' && define.amd)
16 define("bb", ["d3-brush", "d3-selection"], factory);
17 else if(typeof exports === 'object')
18 exports["bb"] = factory(require("d3-brush"), require("d3-selection"));
19 else
20 root["bb"] = root["bb"] || {}, root["bb"]["plugin"] = root["bb"]["plugin"] || {}, root["bb"]["plugin"]["tableview"] = factory(root["d3"], root["d3"]);
21})(this, function(__WEBPACK_EXTERNAL_MODULE__3__, __WEBPACK_EXTERNAL_MODULE__1__) {
22return /******/ (function() { // webpackBootstrap
23/******/ "use strict";
24/******/ var __webpack_modules__ = ([
25/* 0 */,
26/* 1 */
27/***/ (function(module) {
28
29module.exports = __WEBPACK_EXTERNAL_MODULE__1__;
30
31/***/ }),
32/* 2 */,
33/* 3 */
34/***/ (function(module) {
35
36module.exports = __WEBPACK_EXTERNAL_MODULE__3__;
37
38/***/ })
39/******/ ]);
40/************************************************************************/
41/******/ // The module cache
42/******/ var __webpack_module_cache__ = {};
43/******/
44/******/ // The require function
45/******/ function __webpack_require__(moduleId) {
46/******/ // Check if module is in cache
47/******/ var cachedModule = __webpack_module_cache__[moduleId];
48/******/ if (cachedModule !== undefined) {
49/******/ return cachedModule.exports;
50/******/ }
51/******/ // Create a new module (and put it into the cache)
52/******/ var module = __webpack_module_cache__[moduleId] = {
53/******/ // no module.id needed
54/******/ // no module.loaded needed
55/******/ exports: {}
56/******/ };
57/******/
58/******/ // Execute the module function
59/******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
60/******/
61/******/ // Return the exports of the module
62/******/ return module.exports;
63/******/ }
64/******/
65/************************************************************************/
66/******/ /* webpack/runtime/define property getters */
67/******/ !function() {
68/******/ // define getter functions for harmony exports
69/******/ __webpack_require__.d = function(exports, definition) {
70/******/ for(var key in definition) {
71/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
72/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
73/******/ }
74/******/ }
75/******/ };
76/******/ }();
77/******/
78/******/ /* webpack/runtime/hasOwnProperty shorthand */
79/******/ !function() {
80/******/ __webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }
81/******/ }();
82/******/
83/************************************************************************/
84var __webpack_exports__ = {};
85// This entry needs to be wrapped in an IIFE because it needs to be isolated against other modules in the chunk.
86!function() {
87
88// EXPORTS
89__webpack_require__.d(__webpack_exports__, {
90 "default": function() { return /* binding */ TableView; }
91});
92
93// EXTERNAL MODULE: external {"commonjs":"d3-brush","commonjs2":"d3-brush","amd":"d3-brush","root":"d3"}
94var external_commonjs_d3_brush_commonjs2_d3_brush_amd_d3_brush_root_d3_ = __webpack_require__(3);
95// EXTERNAL MODULE: external {"commonjs":"d3-selection","commonjs2":"d3-selection","amd":"d3-selection","root":"d3"}
96var external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_ = __webpack_require__(1);
97;// ./src/module/browser.ts
98function getGlobal() {
99 return typeof globalThis === "object" && globalThis !== null && globalThis.Object === Object && globalThis || typeof global === "object" && global !== null && global.Object === Object && global || typeof self === "object" && self !== null && self.Object === Object && self || Function("return this")();
100}
101function getFallback(w) {
102 const hasRAF = typeof (w == null ? void 0 : w.requestAnimationFrame) === "function" && typeof (w == null ? void 0 : w.cancelAnimationFrame) === "function";
103 const hasRIC = typeof (w == null ? void 0 : w.requestIdleCallback) === "function" && typeof (w == null ? void 0 : w.cancelIdleCallback) === "function";
104 const request = (cb) => setTimeout(cb, 1);
105 const cancel = (id) => clearTimeout(id);
106 return [
107 hasRAF ? w.requestAnimationFrame : request,
108 hasRAF ? w.cancelAnimationFrame : cancel,
109 hasRIC ? w.requestIdleCallback : request,
110 hasRIC ? w.cancelIdleCallback : cancel
111 ];
112}
113const win = getGlobal();
114const doc = win == null ? void 0 : win.document;
115const [
116 requestAnimationFrame,
117 cancelAnimationFrame,
118 requestIdleCallback,
119 cancelIdleCallback
120] = getFallback(win);
121
122
123;// ./src/module/util.ts
124var __defProp = Object.defineProperty;
125var __getOwnPropSymbols = Object.getOwnPropertySymbols;
126var __hasOwnProp = Object.prototype.hasOwnProperty;
127var __propIsEnum = Object.prototype.propertyIsEnumerable;
128var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
129var __spreadValues = (a, b) => {
130 for (var prop in b || (b = {}))
131 if (__hasOwnProp.call(b, prop))
132 __defNormalProp(a, prop, b[prop]);
133 if (__getOwnPropSymbols)
134 for (var prop of __getOwnPropSymbols(b)) {
135 if (__propIsEnum.call(b, prop))
136 __defNormalProp(a, prop, b[prop]);
137 }
138 return a;
139};
140
141
142
143
144const isValue = (v) => v || v === 0;
145const isFunction = (v) => typeof v === "function";
146const isString = (v) => typeof v === "string";
147const isNumber = (v) => typeof v === "number";
148const isUndefined = (v) => typeof v === "undefined";
149const isDefined = (v) => typeof v !== "undefined";
150const isBoolean = (v) => typeof v === "boolean";
151const ceil10 = (v) => Math.ceil(v / 10) * 10;
152const asHalfPixel = (n) => Math.ceil(n) + 0.5;
153const diffDomain = (d) => d[1] - d[0];
154const isObjectType = (v) => typeof v === "object";
155const isEmpty = (o) => isUndefined(o) || o === null || isString(o) && o.length === 0 || isObjectType(o) && !(o instanceof Date) && Object.keys(o).length === 0 || isNumber(o) && isNaN(o);
156const notEmpty = (o) => !isEmpty(o);
157const isArray = (arr) => Array.isArray(arr);
158const isObject = (obj) => obj && !(obj == null ? void 0 : obj.nodeType) && isObjectType(obj) && !isArray(obj);
159function getOption(options, key, defaultValue) {
160 return isDefined(options[key]) ? options[key] : defaultValue;
161}
162function hasValue(dict, value) {
163 let found = false;
164 Object.keys(dict).forEach((key) => dict[key] === value && (found = true));
165 return found;
166}
167function callFn(fn, thisArg, ...args) {
168 const isFn = isFunction(fn);
169 isFn && fn.call(thisArg, ...args);
170 return isFn;
171}
172function endall(transition, cb) {
173 let n = 0;
174 const end = function(...args) {
175 !--n && cb.apply(this, ...args);
176 };
177 if ("duration" in transition) {
178 transition.each(() => ++n).on("end", end);
179 } else {
180 ++n;
181 transition.call(end);
182 }
183}
184function sanitize(str) {
185 return isString(str) ? str.replace(/<(script|img)?/ig, "&lt;").replace(/(script)?>/ig, "&gt;") : str;
186}
187function setTextValue(node, text, dy = [-1, 1], toMiddle = false) {
188 if (!node || !isString(text)) {
189 return;
190 }
191 if (text.indexOf("\n") === -1) {
192 node.text(text);
193 } else {
194 const diff = [node.text(), text].map((v) => v.replace(/[\s\n]/g, ""));
195 if (diff[0] !== diff[1]) {
196 const multiline = text.split("\n");
197 const len = toMiddle ? multiline.length - 1 : 1;
198 node.html("");
199 multiline.forEach((v, i) => {
200 node.append("tspan").attr("x", 0).attr("dy", `${i === 0 ? dy[0] * len : dy[1]}em`).text(v);
201 });
202 }
203 }
204}
205function getRectSegList(path) {
206 const { x, y, width, height } = path.getBBox();
207 return [
208 { x, y: y + height },
209 // seg0
210 { x, y },
211 // seg1
212 { x: x + width, y },
213 // seg2
214 { x: x + width, y: y + height }
215 // seg3
216 ];
217}
218function getPathBox(path) {
219 const { width, height } = path.getBoundingClientRect();
220 const items = getRectSegList(path);
221 const x = items[0].x;
222 const y = Math.min(items[0].y, items[1].y);
223 return {
224 x,
225 y,
226 width,
227 height
228 };
229}
230function getPointer(event, element) {
231 var _a;
232 const touches = event && ((_a = event.touches || event.sourceEvent && event.sourceEvent.touches) == null ? void 0 : _a[0]);
233 let pointer = [0, 0];
234 try {
235 pointer = (0,external_commonjs_d3_selection_commonjs2_d3_selection_amd_d3_selection_root_d3_.pointer)(touches || event, element);
236 } catch (e) {
237 }
238 return pointer.map((v) => isNaN(v) ? 0 : v);
239}
240function getBrushSelection(ctx) {
241 const { event, $el } = ctx;
242 const main = $el.subchart.main || $el.main;
243 let selection;
244 if (event && event.type === "brush") {
245 selection = event.selection;
246 } else if (main && (selection = main.select(".bb-brush").node())) {
247 selection = (0,external_commonjs_d3_brush_commonjs2_d3_brush_amd_d3_brush_root_d3_.brushSelection)(selection);
248 }
249 return selection;
250}
251function getBoundingRect(node) {
252 const needEvaluate = !("rect" in node) || "rect" in node && node.hasAttribute("width") && node.rect.width !== +node.getAttribute("width");
253 return needEvaluate ? node.rect = node.getBoundingClientRect() : node.rect;
254}
255function getRandom(asStr = true, min = 0, max = 1e4) {
256 const crpt = win.crypto || win.msCrypto;
257 const rand = crpt ? min + crpt.getRandomValues(new Uint32Array(1))[0] % (max - min + 1) : Math.floor(Math.random() * (max - min) + min);
258 return asStr ? String(rand) : rand;
259}
260function findIndex(arr, v, start, end, isRotated) {
261 if (start > end) {
262 return -1;
263 }
264 const mid = Math.floor((start + end) / 2);
265 let { x, w = 0 } = arr[mid];
266 if (isRotated) {
267 x = arr[mid].y;
268 w = arr[mid].h;
269 }
270 if (v >= x && v <= x + w) {
271 return mid;
272 }
273 return v < x ? findIndex(arr, v, start, mid - 1, isRotated) : findIndex(arr, v, mid + 1, end, isRotated);
274}
275function brushEmpty(ctx) {
276 const selection = getBrushSelection(ctx);
277 if (selection) {
278 return selection[0] === selection[1];
279 }
280 return true;
281}
282function deepClone(...objectN) {
283 const clone = (v) => {
284 if (isObject(v) && v.constructor) {
285 const r = new v.constructor();
286 for (const k in v) {
287 r[k] = clone(v[k]);
288 }
289 return r;
290 }
291 return v;
292 };
293 return objectN.map((v) => clone(v)).reduce((a, c) => __spreadValues(__spreadValues({}, a), c));
294}
295function extend(target = {}, source) {
296 if (isArray(source)) {
297 source.forEach((v) => extend(target, v));
298 }
299 for (const p in source) {
300 if (/^\d+$/.test(p) || p in target) {
301 continue;
302 }
303 target[p] = source[p];
304 }
305 return target;
306}
307const capitalize = (str) => str.charAt(0).toUpperCase() + str.slice(1);
308function camelize(str, separator = "-") {
309 return str.split(separator).map((v, i) => i ? v.charAt(0).toUpperCase() + v.slice(1).toLowerCase() : v.toLowerCase()).join("");
310}
311const toArray = (v) => [].slice.call(v);
312function addCssRules(style, selector, prop) {
313 const { rootSelector = "", sheet } = style;
314 const getSelector = (s) => s.replace(/\s?(bb-)/g, ".$1").replace(/\.+/g, ".");
315 const rule = `${rootSelector} ${getSelector(selector)} {${prop.join(";")}}`;
316 return sheet[sheet.insertRule ? "insertRule" : "addRule"](
317 rule,
318 sheet.cssRules.length
319 );
320}
321function getCssRules(styleSheets) {
322 let rules = [];
323 styleSheets.forEach((sheet) => {
324 var _a;
325 try {
326 if (sheet.cssRules && sheet.cssRules.length) {
327 rules = rules.concat(toArray(sheet.cssRules));
328 }
329 } catch (e) {
330 (_a = win.console) == null ? void 0 : _a.warn(`Error while reading rules from ${sheet.href}: ${e.toString()}`);
331 }
332 });
333 return rules;
334}
335function getScrollPosition(node) {
336 var _a, _b, _c, _d, _e, _f;
337 return {
338 x: ((_b = (_a = win.pageXOffset) != null ? _a : win.scrollX) != null ? _b : 0) + ((_c = node.scrollLeft) != null ? _c : 0),
339 y: ((_e = (_d = win.pageYOffset) != null ? _d : win.scrollY) != null ? _e : 0) + ((_f = node.scrollTop) != null ? _f : 0)
340 };
341}
342function getTransformCTM(node, x = 0, y = 0, inverse = true) {
343 const point = new DOMPoint(x, y);
344 const screen = node.getScreenCTM();
345 const res = point.matrixTransform(
346 inverse ? screen == null ? void 0 : screen.inverse() : screen
347 );
348 if (inverse === false) {
349 const rect = node.getBoundingClientRect();
350 res.x -= rect.x;
351 res.y -= rect.y;
352 }
353 return res;
354}
355function getTranslation(node) {
356 const transform = node ? node.transform : null;
357 const baseVal = transform && transform.baseVal;
358 return baseVal && baseVal.numberOfItems ? baseVal.getItem(0).matrix : { a: 0, b: 0, c: 0, d: 0, e: 0, f: 0 };
359}
360function getUnique(data) {
361 const isDate = data[0] instanceof Date;
362 const d = (isDate ? data.map(Number) : data).filter((v, i, self) => self.indexOf(v) === i);
363 return isDate ? d.map((v) => new Date(v)) : d;
364}
365function mergeArray(arr) {
366 return arr && arr.length ? arr.reduce((p, c) => p.concat(c)) : [];
367}
368function mergeObj(target, ...objectN) {
369 if (!objectN.length || objectN.length === 1 && !objectN[0]) {
370 return target;
371 }
372 const source = objectN.shift();
373 if (isObject(target) && isObject(source)) {
374 Object.keys(source).forEach((key) => {
375 const value = source[key];
376 if (isObject(value)) {
377 !target[key] && (target[key] = {});
378 target[key] = mergeObj(target[key], value);
379 } else {
380 target[key] = isArray(value) ? value.concat() : value;
381 }
382 });
383 }
384 return mergeObj(target, ...objectN);
385}
386function sortValue(data, isAsc = true) {
387 let fn;
388 if (data[0] instanceof Date) {
389 fn = isAsc ? (a, b) => a - b : (a, b) => b - a;
390 } else {
391 if (isAsc && !data.every(isNaN)) {
392 fn = (a, b) => a - b;
393 } else if (!isAsc) {
394 fn = (a, b) => a > b && -1 || a < b && 1 || a === b && 0;
395 }
396 }
397 return data.concat().sort(fn);
398}
399function getMinMax(type, data) {
400 let res = data.filter((v) => notEmpty(v));
401 if (res.length) {
402 if (isNumber(res[0])) {
403 res = Math[type](...res);
404 } else if (res[0] instanceof Date) {
405 res = sortValue(res, type === "min")[0];
406 }
407 } else {
408 res = void 0;
409 }
410 return res;
411}
412const getRange = (start, end, step = 1) => {
413 const res = [];
414 const n = Math.max(0, Math.ceil((end - start) / step)) | 0;
415 for (let i = start; i < n; i++) {
416 res.push(start + i * step);
417 }
418 return res;
419};
420const emulateEvent = {
421 mouse: (() => {
422 const getParams = () => ({
423 bubbles: false,
424 cancelable: false,
425 screenX: 0,
426 screenY: 0,
427 clientX: 0,
428 clientY: 0
429 });
430 try {
431 new MouseEvent("t");
432 return (el, eventType, params = getParams()) => {
433 el.dispatchEvent(new MouseEvent(eventType, params));
434 };
435 } catch (e) {
436 return (el, eventType, params = getParams()) => {
437 const mouseEvent = doc.createEvent("MouseEvent");
438 mouseEvent.initMouseEvent(
439 eventType,
440 params.bubbles,
441 params.cancelable,
442 win,
443 0,
444 // the event's mouse click count
445 params.screenX,
446 params.screenY,
447 params.clientX,
448 params.clientY,
449 false,
450 false,
451 false,
452 false,
453 0,
454 null
455 );
456 el.dispatchEvent(mouseEvent);
457 };
458 }
459 })(),
460 touch: (el, eventType, params) => {
461 const touchObj = new Touch(mergeObj({
462 identifier: Date.now(),
463 target: el,
464 radiusX: 2.5,
465 radiusY: 2.5,
466 rotationAngle: 10,
467 force: 0.5
468 }, params));
469 el.dispatchEvent(new TouchEvent(eventType, {
470 cancelable: true,
471 bubbles: true,
472 shiftKey: true,
473 touches: [touchObj],
474 targetTouches: [],
475 changedTouches: [touchObj]
476 }));
477 }
478};
479function tplProcess(tpl, data) {
480 let res = tpl;
481 for (const x in data) {
482 res = res.replace(new RegExp(`{=${x}}`, "g"), data[x]);
483 }
484 return res;
485}
486function parseDate(date) {
487 var _a;
488 let parsedDate;
489 if (date instanceof Date) {
490 parsedDate = date;
491 } else if (isString(date)) {
492 const { config, format } = this;
493 parsedDate = (_a = format.dataTime(config.data_xFormat)(date)) != null ? _a : new Date(date);
494 } else if (isNumber(date) && !isNaN(date)) {
495 parsedDate = /* @__PURE__ */ new Date(+date);
496 }
497 if (!parsedDate || isNaN(+parsedDate)) {
498 console && console.error && console.error(`Failed to parse x '${date}' to Date object`);
499 }
500 return parsedDate;
501}
502function hasViewBox(svg) {
503 const attr = svg.attr("viewBox");
504 return attr ? /(\d+(\.\d+)?){3}/.test(attr) : false;
505}
506function hasStyle(node, condition, all = false) {
507 const isD3Node = !!node.node;
508 let has = false;
509 for (const [key, value] of Object.entries(condition)) {
510 has = isD3Node ? node.style(key) === value : node.style[key] === value;
511 if (all === false && has) {
512 break;
513 }
514 }
515 return has;
516}
517function isTabVisible() {
518 var _a, _b;
519 return ((_a = doc) == null ? void 0 : _a.hidden) === false || ((_b = doc) == null ? void 0 : _b.visibilityState) === "visible";
520}
521function convertInputType(mouse, touch) {
522 const { DocumentTouch, matchMedia, navigator } = win;
523 const hasPointerCoarse = matchMedia == null ? void 0 : matchMedia("(pointer:coarse)").matches;
524 let hasTouch = false;
525 if (touch) {
526 if (navigator && "maxTouchPoints" in navigator) {
527 hasTouch = navigator.maxTouchPoints > 0;
528 } else if ("ontouchmove" in win || DocumentTouch && doc instanceof DocumentTouch) {
529 hasTouch = true;
530 } else {
531 if (hasPointerCoarse) {
532 hasTouch = true;
533 } else {
534 const UA = navigator.userAgent;
535 hasTouch = /\b(BlackBerry|webOS|iPhone|IEMobile)\b/i.test(UA) || /\b(Android|Windows Phone|iPad|iPod)\b/i.test(UA);
536 }
537 }
538 }
539 const hasMouse = mouse && !hasPointerCoarse && (matchMedia == null ? void 0 : matchMedia("(pointer:fine)").matches);
540 return hasMouse && "mouse" || hasTouch && "touch" || "mouse";
541}
542function runUntil(fn, conditionFn) {
543 if (conditionFn() === false) {
544 requestAnimationFrame(() => runUntil(fn, conditionFn));
545 } else {
546 fn();
547 }
548}
549
550;// ./src/config/config.ts
551
552function loadConfig(config) {
553 const thisConfig = this.config;
554 let target;
555 let keys;
556 let read;
557 const find = () => {
558 const key = keys.shift();
559 if (key && target && isObjectType(target) && key in target) {
560 target = target[key];
561 return find();
562 } else if (!key) {
563 return target;
564 }
565 return void 0;
566 };
567 Object.keys(thisConfig).forEach((key) => {
568 target = config;
569 keys = key.split("_");
570 read = find();
571 if (isDefined(read)) {
572 thisConfig[key] = read;
573 }
574 });
575 if (this.api) {
576 this.state.orgConfig = config;
577 }
578}
579
580;// ./src/Plugin/Plugin.ts
581var Plugin_defProp = Object.defineProperty;
582var Plugin_defNormalProp = (obj, key, value) => key in obj ? Plugin_defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
583var __publicField = (obj, key, value) => Plugin_defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
584class Plugin {
585 /**
586 * Constructor
587 * @param {Any} options config option object
588 * @private
589 */
590 constructor(options = {}) {
591 __publicField(this, "$$");
592 __publicField(this, "options");
593 this.options = options;
594 }
595 /**
596 * Lifecycle hook for 'beforeInit' phase.
597 * @private
598 */
599 $beforeInit() {
600 }
601 /**
602 * Lifecycle hook for 'init' phase.
603 * @private
604 */
605 $init() {
606 }
607 /**
608 * Lifecycle hook for 'afterInit' phase.
609 * @private
610 */
611 $afterInit() {
612 }
613 /**
614 * Lifecycle hook for 'redraw' phase.
615 * @private
616 */
617 $redraw() {
618 }
619 /**
620 * Lifecycle hook for 'willDestroy' phase.
621 * @private
622 */
623 $willDestroy() {
624 Object.keys(this).forEach((key) => {
625 this[key] = null;
626 delete this[key];
627 });
628 }
629}
630__publicField(Plugin, "version", "3.14.2");
631
632;// ./src/Plugin/tableview/const.ts
633
634const defaultStyle = {
635 id: "__tableview-style__",
636 class: "bb-tableview",
637 rule: `.bb-tableview {
638 border-collapse:collapse;
639 border-spacing:0;
640 background:#fff;
641 min-width:100%;
642 margin-top:10px;
643 font-family:sans-serif;
644 font-size:.9em;
645 }
646 .bb-tableview tr:hover {
647 background:#eef7ff;
648 }
649 .bb-tableview thead tr {
650 background:#f8f8f8;
651 }
652 .bb-tableview caption,.bb-tableview td,.bb-tableview th {
653 text-align: center;
654 border:1px solid silver;
655 padding:.5em;
656 }
657 .bb-tableview caption {
658 font-size:1.1em;
659 font-weight:700;
660 margin-bottom: -1px;
661 }`
662};
663const tpl = {
664 body: `<caption>{=title}</caption>
665 <thead><tr>{=thead}</tr></thead>
666 <tbody>{=tbody}</tbody>`,
667 thead: `<th scope="col">{=title}</th>`,
668 tbodyHeader: `<th scope="row">{=value}</th>`,
669 tbody: `<td>{=value}</td>`
670};
671
672;// ./src/Plugin/tableview/Options.ts
673class Options {
674 constructor() {
675 return {
676 /**
677 * Set tableview holder selector.
678 * - **NOTE:** If not set, will append new holder element dynamically right after chart element.
679 * @name selector
680 * @memberof plugin-tableview
681 * @type {string}
682 * @default undefined
683 * @example
684 * selector: "#table-holder"
685 */
686 selector: void 0,
687 /**
688 * Set category title text
689 * @name categoryTitle
690 * @memberof plugin-tableview
691 * @type {string}
692 * @default "Category"
693 * @example
694 * categoryTitle: "#table-holder"
695 */
696 categoryTitle: "Category",
697 /**
698 * Set category text format function.
699 * @name categoryFormat
700 * @memberof plugin-tableview
701 * @type {Function}
702 * @returns {string}
703 * @default function(v) { // will return formatted value according x Axis type }}
704 * @example
705 * categoryFormat: "#table-holder"
706 */
707 categoryFormat: function(v) {
708 let category = v;
709 if (this.$$.axis.isCategorized()) {
710 category = this.$$.categoryName(v);
711 } else if (this.$$.axis.isTimeSeries()) {
712 category = v.toLocaleDateString();
713 }
714 return category;
715 },
716 /**
717 * Set tableview holder class name.
718 * @name class
719 * @memberof plugin-tableview
720 * @type {string}
721 * @default undefined
722 * @example
723 * class: "table-class-name"
724 */
725 class: void 0,
726 /**
727 * Set to apply default style(`.bb-tableview`) to tableview element.
728 * @name style
729 * @memberof plugin-tableview
730 * @type {boolean}
731 * @default true
732 * @example
733 * style: false
734 */
735 style: true,
736 /**
737 * Set tableview title text.
738 * - **NOTE:** If set [title.text](https://naver.github.io/billboard.js/release/latest/doc/Options.html#.title), will be used when this option value is empty.
739 * @name title
740 * @memberof plugin-tableview
741 * @type {string}
742 * @default undefined
743 * @example
744 * title: "Table Title Text"
745 */
746 title: void 0,
747 /**
748 * Update tableview from data visibility update(ex. legend toggle).
749 * @name updateOnToggle
750 * @memberof plugin-tableview
751 * @type {boolean}
752 * @default true
753 * @example
754 * legendToggleUpdate: false
755 */
756 updateOnToggle: true,
757 /**
758 * Set how null value to be shown.
759 * @name nullString
760 * @memberof plugin-tableview
761 * @type {string}
762 * @default "-"
763 * @example
764 * nullString: "N/A"
765 */
766 nullString: "-"
767 };
768 }
769}
770
771;// ./src/Plugin/tableview/index.ts
772var tableview_defProp = Object.defineProperty;
773var __defProps = Object.defineProperties;
774var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
775var tableview_getOwnPropSymbols = Object.getOwnPropertySymbols;
776var tableview_hasOwnProp = Object.prototype.hasOwnProperty;
777var tableview_propIsEnum = Object.prototype.propertyIsEnumerable;
778var tableview_defNormalProp = (obj, key, value) => key in obj ? tableview_defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
779var tableview_spreadValues = (a, b) => {
780 for (var prop in b || (b = {}))
781 if (tableview_hasOwnProp.call(b, prop))
782 tableview_defNormalProp(a, prop, b[prop]);
783 if (tableview_getOwnPropSymbols)
784 for (var prop of tableview_getOwnPropSymbols(b)) {
785 if (tableview_propIsEnum.call(b, prop))
786 tableview_defNormalProp(a, prop, b[prop]);
787 }
788 return a;
789};
790var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
791var tableview_publicField = (obj, key, value) => tableview_defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
792
793
794
795
796
797class TableView extends Plugin {
798 constructor(options) {
799 super(options);
800 tableview_publicField(this, "config");
801 tableview_publicField(this, "element");
802 this.config = new Options();
803 return this;
804 }
805 $beforeInit() {
806 loadConfig.call(this, this.options);
807 }
808 $init() {
809 const { class: className, selector, style } = this.config;
810 let element = document.querySelector(
811 selector || `.${className || defaultStyle.class}`
812 );
813 if (!element) {
814 const chart = this.$$.$el.chart.node();
815 element = document.createElement("table");
816 chart.parentNode.insertBefore(element, chart.nextSibling);
817 }
818 if (element.tagName !== "TABLE") {
819 const table = document.createElement("table");
820 element.appendChild(table);
821 element = table;
822 }
823 if (style && !document.getElementById(defaultStyle.id)) {
824 const s = document.createElement("style");
825 s.id = defaultStyle.id;
826 s.innerHTML = defaultStyle.rule;
827 (document.head || document.getElementsByTagName("head")[0]).appendChild(s);
828 }
829 element.classList.add(...[style && defaultStyle.class, className].filter(Boolean));
830 this.element = element;
831 }
832 /**
833 * Generate table
834 * @private
835 */
836 generateTable() {
837 const { $$, config, element } = this;
838 const dataToShow = $$.filterTargetsToShow($$.data.targets);
839 let thead = tplProcess(tpl.thead, {
840 title: dataToShow.length ? this.config.categoryTitle : ""
841 });
842 let tbody = "";
843 const rows = [];
844 dataToShow.forEach((v) => {
845 thead += tplProcess(tpl.thead, { title: v.id });
846 v.values.forEach((d, i) => {
847 if (!rows[i]) {
848 rows[i] = [d.x];
849 }
850 rows[i].push(d.value);
851 });
852 });
853 rows.forEach((v) => {
854 tbody += `<tr>${v.map(
855 (d, i) => tplProcess(i ? tpl.tbody : tpl.tbodyHeader, {
856 value: i === 0 ? config.categoryFormat.bind(this)(d) : isNumber(d) ? d.toLocaleString() : config.nullString
857 })
858 ).join("")}</tr>`;
859 });
860 const rx = /(<\/?(script|img)[^>]*>|<[^>]+><\/[^>]+>)/ig;
861 const r = tplProcess(tpl.body, __spreadProps(tableview_spreadValues({}, config), {
862 title: config.title || $$.config.title_text || "",
863 thead,
864 tbody
865 })).replace(rx, "");
866 element.innerHTML = r;
867 }
868 $redraw() {
869 const { state } = this.$$;
870 const doNotUpdate = state.resizing || !this.config.updateOnToggle && state.toggling;
871 !doNotUpdate && this.generateTable();
872 }
873 $willDestroy() {
874 var _a, _b;
875 (_a = this.element.parentNode) == null ? void 0 : _a.removeChild(this.element);
876 if (this.$$.charts.length === 1) {
877 const s = document.getElementById(defaultStyle.id);
878 (_b = s == null ? void 0 : s.parentNode) == null ? void 0 : _b.removeChild(s);
879 }
880 }
881}
882
883}();
884__webpack_exports__ = __webpack_exports__["default"];
885/******/ return __webpack_exports__;
886/******/ })()
887;
888});
\No newline at end of file