billboard 차트 type 주입 방식 변경 (#440) (#441)

Co-authored-by: kim jeong yong <[email protected]>

package.json

@@ -1,6 +1,6 @@
 {
     "name": "@entrylabs/tool",
-    "version": "2.0.2",
+    "version": "2.0.3",
     "license": "MIT",
     "repository": {
         "type": "git",

src/components/widget/Chart/Bar.jsx

@@ -43,7 +43,7 @@ const Bar = ({ chart, table, size }) => {
     const theme = Theme.getStyle('popup');
     const chartRef = useRef(null);
     const { id, xIndex = -1, order, categoryIndexes = [], type } = chart;
-  
+
     useEffect(() => {
         if (!isDrawable(chart)) {
             return;
@@ -66,7 +66,7 @@ const Bar = ({ chart, table, size }) => {
             },
             data: {
                 columns,
-                type: bar(),
+                type: 'bar',
             },
             axis: {
                 x: {

src/components/widget/Chart/Histogram.jsx

@@ -1,5 +1,5 @@
 import { useEffect, useRef } from 'react';
-import bb, { areaStep } from 'billboard.js';
+import bb from 'billboard.js';
 import Theme from '@utils/Theme';
 import '@assets/entry/scss/widget/insight.css';
 import { GRAPH_COLOR } from '@constants/dataAnalytics';
@@ -30,7 +30,7 @@ const Histogram = ({ chart, table, size }) => {
             data: {
                 x: 'histogram_chart_x',
                 columns: getHistogramChart(table, categoryIndexes, bin, boundary),
-                type: areaStep(),
+                type: 'area-step',
             },
             axis: {
                 x: {

src/components/widget/Chart/Line.jsx

@@ -1,5 +1,5 @@
 import { useEffect, useRef } from 'react';
-import bb, { line } from 'billboard.js';
+import bb from 'billboard.js';
 import Theme from '@utils/Theme';
 import '@assets/entry/scss/widget/insight.css';
 import { GRAPH_COLOR } from '@constants/dataAnalytics';
@@ -64,7 +64,7 @@ const Line = ({ chart, table, size }) => {
             },
             data: {
                 columns,
-                type: line(),
+                type: 'line',
             },
             axis: {
                 x: {

src/components/widget/Chart/Pie.jsx

@@ -1,5 +1,5 @@
 import { useEffect, useRef } from 'react';
-import bb, { pie } from 'billboard.js';
+import bb from 'billboard.js';
 import Theme from '@utils/Theme';
 import '@assets/entry/scss/widget/insight.css';
 import { GRAPH_COLOR } from '@constants/dataAnalytics';
@@ -32,7 +32,7 @@ const Pie = ({ table, chart, size }) => {
                     pieChart[0],
                     ...pieChart.slice(1).map((value, index) => [index, value[1]]),
                 ],
-                type: pie(),
+                type: 'pie',
             },
             axis: {
                 x: {

src/components/widget/Chart/Plotly.jsx

@@ -1,4 +1,4 @@
-import { useState, useRef, useEffect, useCallback } from 'react';
+import { useState, useRef, useEffect } from 'react';
 import Plotly from 'react-plotly.js';
 import Theme from '@utils/Theme';
 import { corr } from '@utils/dataAnalytics';

src/components/widget/Chart/Scatter.jsx

@@ -1,5 +1,5 @@
 import { useEffect, useRef } from 'react';
-import bb, { scatter } from 'billboard.js';
+import bb from 'billboard.js';
 import Theme from '@utils/Theme';
 import '@assets/entry/scss/widget/insight.css';
 import { GRAPH_COLOR, SCATTER_POINT_PATTERN } from '@constants/dataAnalytics';
@@ -41,7 +41,7 @@ const Scatter = ({ chart, table, size }) => {
             data: {
                 xs: scatterXs(columns),
                 columns,
-                type: scatter(),
+                type: 'scatter',
             },
             axis: {
                 x: {