tvision-charts-component 3.3.24

package/dist/esm/basicBar/_example/GroupedBar.js

@@ -0,0 +1,35 @@
+import { __assign } from "tslib";
+import React from 'react';
+import { BasicBar } from '@tencent/tcharts-component';
+export default function GroupedBar() {
+    var options = {
+        xAxis: {
+            boundaryGap: true,
+            data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+        },
+        dataSource: [
+            {
+                name: '昨日设备',
+                type: 'bar',
+                barWidth: '60%',
+                data: [10, 52, 200, 534, 390, 330, 220],
+            },
+            {
+                name: '较上周',
+                type: 'bar',
+                barWidth: '60%',
+                data: [8, 56, 100, 334, 290, 380, 200],
+            },
+            {
+                name: '较上月',
+                type: 'bar',
+                barWidth: '60%',
+                data: [6, 62, 140, 434, 590, 430, 420],
+            },
+        ],
+    };
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", null, "\u5206\u7EC4\u67F1\u72B6\u56FE"),
+        React.createElement(BasicBar, __assign({ height: 500 }, options))));
+}
+//# sourceMappingURL=GroupedBar.js.map

package/dist/esm/basicBar/_example/GroupedBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GroupedBar.js","sourceRoot":"","sources":["../../../../src/basicBar/_example/GroupedBar.jsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AAEtD,MAAM,CAAC,OAAO,UAAU,UAAU;IAChC,IAAM,OAAO,GAAG;QACd,KAAK,EAAE;YACL,WAAW,EAAE,IAAI;YACjB,IAAI,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC;SACxD;QACD,UAAU,EAAE;YACV;gBACE,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,KAAK;gBACX,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;aACxC;YACD;gBACE,IAAI,EAAE,KAAK;gBACX,IAAI,EAAE,KAAK;gBACX,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,CAAC,CAAC,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;aACvC;YACD;gBACE,IAAI,EAAE,KAAK;gBACX,IAAI,EAAE,KAAK;gBACX,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,CAAC,CAAC,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;aACvC;SACF;KACF,CAAC;IACF,OAAO,CACL;QACE,kEAAgB;QAChB,oBAAC,QAAQ,aAAC,MAAM,EAAE,GAAG,IAAM,OAAO,EAAI,CACrC,CACJ,CAAC;AACJ,CAAC"}

package/dist/esm/basicBar/_example/GroupedBar.jsx

@@ -0,0 +1,37 @@
+import React from 'react';
+import { BasicBar } from '@tencent/tcharts-component';
+
+export default function GroupedBar() {
+  const options = {
+    xAxis: {
+      boundaryGap: true,
+      data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+    },
+    dataSource: [
+      {
+        name: '昨日设备',
+        type: 'bar',
+        barWidth: '60%',
+        data: [10, 52, 200, 534, 390, 330, 220],
+      },
+      {
+        name: '较上周',
+        type: 'bar',
+        barWidth: '60%',
+        data: [8, 56, 100, 334, 290, 380, 200],
+      },
+      {
+        name: '较上月',
+        type: 'bar',
+        barWidth: '60%',
+        data: [6, 62, 140, 434, 590, 430, 420],
+      },
+    ],
+  };
+  return (
+    <>
+      <div>分组柱状图</div>
+      <BasicBar height={500} {...options} />
+    </>
+  );
+}

package/dist/esm/basicBar/_example/HorizontalBar.d.ts

@@ -0,0 +1 @@
+export default function HorizontalRotate(): JSX.Element;

package/dist/esm/basicBar/_example/HorizontalBar.js

@@ -0,0 +1,92 @@
+import { __assign } from "tslib";
+import React from 'react';
+import { BasicBar } from '@tencent/tcharts-component';
+export default function HorizontalRotate() {
+    var options = {
+        color: ['#3398DB'],
+        tooltip: {
+            trigger: 'axis',
+            show: true,
+            axisPointer: {
+                type: 'shadow',
+                shadowStyle: {
+                    color: '#e5e5e5',
+                },
+            },
+        },
+        legend: {
+            orient: 'vertical',
+            x: 'left',
+            show: true,
+            data: ['日志条数', '请求数量', '服务器数量'],
+        },
+        grid: {
+            left: 10,
+            right: 10,
+            bottom: 10,
+            top: 10,
+            containLabel: true,
+        },
+        xAxis: [
+            {
+                type: 'value',
+                axisLine: {
+                    show: true,
+                    inside: false,
+                },
+                axisLabel: {
+                    show: true,
+                    inside: false,
+                    margin: 8,
+                },
+            },
+        ],
+        yAxis: {
+            boundaryGap: true,
+            axisLabel: {
+                inside: false,
+            },
+            type: 'category',
+            data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+            axisTick: {
+                alignWithLabel: true,
+            },
+        },
+        dataSource: [
+            {
+                name: '直接访问',
+                type: 'bar',
+                barWidth: '60%',
+                data: [10, 52, 200, 334, 390, 330, 220],
+            },
+            {
+                name: '请求数量',
+                type: 'bar',
+                barWidth: '60%',
+                data: [100, 520, 20, 33, 39, 33, 22],
+            },
+            {
+                name: '服务器数量',
+                type: 'bar',
+                barWidth: '60%',
+                data: [110, 152, 120, 300, 390, 330, 122],
+            },
+            {
+                name: 'IP数量',
+                type: 'bar',
+                barWidth: '60%',
+                data: [130, 112, 160, 90, 100, 30, 122],
+            },
+            {
+                name: '日志level',
+                type: 'bar',
+                barWidth: '60%',
+                data: [130, 112, 160, 90, 100, 30, 122],
+            },
+        ],
+    };
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", null, "\u6A2A\u5411\u67F1\u72B6\u56FE"),
+        React.createElement(BasicBar, __assign({ height: 500 }, options))));
+}
+//# sourceMappingURL=HorizontalBar.js.map

package/dist/esm/basicBar/_example/HorizontalBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HorizontalBar.js","sourceRoot":"","sources":["../../../../src/basicBar/_example/HorizontalBar.jsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AAEtD,MAAM,CAAC,OAAO,UAAU,gBAAgB;IACtC,IAAM,OAAO,GAAG;QACd,KAAK,EAAE,CAAC,SAAS,CAAC;QAClB,OAAO,EAAE;YACP,OAAO,EAAE,MAAM;YACf,IAAI,EAAE,IAAI;YACV,WAAW,EAAE;gBACX,IAAI,EAAE,QAAQ;gBACd,WAAW,EAAE;oBACX,KAAK,EAAE,SAAS;iBACjB;aACF;SACF;QACD,MAAM,EAAE;YACN,MAAM,EAAE,UAAU;YAClB,CAAC,EAAE,MAAM;YACT,IAAI,EAAE,IAAI;YACV,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC;SAChC;QACD,IAAI,EAAE;YACJ,IAAI,EAAE,EAAE;YACR,KAAK,EAAE,EAAE;YACT,MAAM,EAAE,EAAE;YACV,GAAG,EAAE,EAAE;YACP,YAAY,EAAE,IAAI;SACnB;QACD,KAAK,EAAE;YACL;gBACE,IAAI,EAAE,OAAO;gBACb,QAAQ,EAAE;oBACR,IAAI,EAAE,IAAI;oBACV,MAAM,EAAE,KAAK;iBACd;gBACD,SAAS,EAAE;oBACT,IAAI,EAAE,IAAI;oBACV,MAAM,EAAE,KAAK;oBACb,MAAM,EAAE,CAAC;iBACV;aACF;SACF;QACD,KAAK,EAAE;YACL,WAAW,EAAE,IAAI;YACjB,SAAS,EAAE;gBACT,MAAM,EAAE,KAAK;aACd;YACD,IAAI,EAAE,UAAU;YAChB,IAAI,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC;YACvD,QAAQ,EAAE;gBACR,cAAc,EAAE,IAAI;aACrB;SACF;QACD,UAAU,EAAE;YACV;gBACE,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,KAAK;gBACX,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;aACxC;YACD;gBACE,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,KAAK;gBACX,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;aACrC;YACD;gBACE,IAAI,EAAE,OAAO;gBACb,IAAI,EAAE,KAAK;gBACX,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;aAC1C;YACD;gBACE,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,KAAK;gBACX,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,EAAE,EAAE,GAAG,EAAE,EAAE,EAAE,GAAG,CAAC;aACxC;YACD;gBACE,IAAI,EAAE,SAAS;gBACf,IAAI,EAAE,KAAK;gBACX,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,EAAE,EAAE,GAAG,EAAE,EAAE,EAAE,GAAG,CAAC;aACxC;SACF;KACF,CAAC;IAEF,OAAO,CACL;QACE,kEAAgB;QAChB,oBAAC,QAAQ,aAAC,MAAM,EAAE,GAAG,IAAM,OAAO,EAAI,CACrC,CACJ,CAAC;AACJ,CAAC"}

package/dist/esm/basicBar/_example/HorizontalBar.jsx

@@ -0,0 +1,95 @@
+import React from 'react';
+import { BasicBar } from '@tencent/tcharts-component';
+
+export default function HorizontalRotate() {
+  const options = {
+    color: ['#3398DB'],
+    tooltip: {
+      trigger: 'axis',
+      show: true,
+      axisPointer: {
+        type: 'shadow',
+        shadowStyle: {
+          color: '#e5e5e5',
+        },
+      },
+    },
+    legend: {
+      orient: 'vertical',
+      x: 'left',
+      show: true,
+      data: ['日志条数', '请求数量', '服务器数量'],
+    },
+    grid: {
+      left: 10,
+      right: 10,
+      bottom: 10,
+      top: 10,
+      containLabel: true,
+    },
+    xAxis: [
+      {
+        type: 'value',
+        axisLine: {
+          show: true,
+          inside: false,
+        },
+        axisLabel: {
+          show: true,
+          inside: false,
+          margin: 8,
+        },
+      },
+    ],
+    yAxis: {
+      boundaryGap: true,
+      axisLabel: {
+        inside: false,
+      },
+      type: 'category',
+      data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+      axisTick: {
+        alignWithLabel: true,
+      },
+    },
+    dataSource: [
+      {
+        name: '直接访问',
+        type: 'bar',
+        barWidth: '60%',
+        data: [10, 52, 200, 334, 390, 330, 220],
+      },
+      {
+        name: '请求数量',
+        type: 'bar',
+        barWidth: '60%',
+        data: [100, 520, 20, 33, 39, 33, 22],
+      },
+      {
+        name: '服务器数量',
+        type: 'bar',
+        barWidth: '60%',
+        data: [110, 152, 120, 300, 390, 330, 122],
+      },
+      {
+        name: 'IP数量',
+        type: 'bar',
+        barWidth: '60%',
+        data: [130, 112, 160, 90, 100, 30, 122],
+      },
+      {
+        name: '日志level',
+        type: 'bar',
+        barWidth: '60%',
+        data: [130, 112, 160, 90, 100, 30, 122],
+      },
+    ],
+  };
+
+  return (
+    <>
+      <div>横向柱状图</div>
+      <BasicBar height={500} {...options} />
+    </>
+  );
+}

package/dist/esm/basicBar/_example/HorizontalStackedBar.d.ts

@@ -0,0 +1 @@
+export default function HorizontalStackedBar(): JSX.Element;

package/dist/esm/basicBar/_example/HorizontalStackedBar.js

@@ -0,0 +1,97 @@
+import { __assign } from "tslib";
+import React from 'react';
+import { BasicBar } from '@tencent/tcharts-component';
+export default function HorizontalStackedBar() {
+    var options = {
+        color: ['#3398DB'],
+        tooltip: {
+            trigger: 'axis',
+            show: true,
+            axisPointer: {
+                type: 'shadow',
+                shadowStyle: {
+                    color: '#e5e5e5',
+                },
+            },
+        },
+        legend: {
+            orient: 'vertical',
+            x: 'left',
+            show: true,
+            data: ['日志条数', '请求数量', '服务器数量'],
+        },
+        grid: {
+            left: 10,
+            right: 10,
+            bottom: 10,
+            top: 10,
+            containLabel: true,
+        },
+        xAxis: [
+            {
+                type: 'value',
+                axisLine: {
+                    show: true,
+                    inside: false,
+                },
+                axisLabel: {
+                    show: true,
+                    inside: false,
+                    margin: 8,
+                },
+            },
+        ],
+        yAxis: {
+            boundaryGap: true,
+            axisLabel: {
+                inside: false,
+            },
+            type: 'category',
+            data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+            axisTick: {
+                alignWithLabel: true,
+            },
+        },
+        dataSource: [
+            {
+                name: '直接访问',
+                type: 'bar',
+                barWidth: '60%',
+                data: [10, 52, 200, 334, 390, 330, 220],
+                stack: 'a',
+            },
+            {
+                name: '请求数量',
+                type: 'bar',
+                barWidth: '60%',
+                data: [100, 520, 20, 33, 39, 33, 22],
+                stack: 'a',
+            },
+            {
+                name: '服务器数量',
+                type: 'bar',
+                barWidth: '60%',
+                data: [110, 152, 120, 300, 390, 330, 122],
+                stack: 'a',
+            },
+            {
+                name: 'IP数量',
+                type: 'bar',
+                barWidth: '60%',
+                data: [130, 112, 160, 90, 100, 30, 122],
+                stack: 'a',
+            },
+            {
+                name: '日志level',
+                type: 'bar',
+                barWidth: '60%',
+                data: [130, 112, 160, 90, 100, 30, 122],
+                stack: 'a',
+            },
+        ],
+    };
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", null, "\u6A2A\u5411\u5806\u53E0\u56FE"),
+        React.createElement(BasicBar, __assign({ height: 500 }, options))));
+}
+//# sourceMappingURL=HorizontalStackedBar.js.map

package/dist/esm/basicBar/_example/HorizontalStackedBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HorizontalStackedBar.js","sourceRoot":"","sources":["../../../../src/basicBar/_example/HorizontalStackedBar.jsx"],"names":[],"mappings":"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"}

package/dist/esm/basicBar/_example/HorizontalStackedBar.jsx

@@ -0,0 +1,100 @@
+import React from 'react';
+import { BasicBar } from '@tencent/tcharts-component';
+
+export default function HorizontalStackedBar() {
+  const options = {
+    color: ['#3398DB'],
+    tooltip: {
+      trigger: 'axis',
+      show: true,
+      axisPointer: {
+        type: 'shadow',
+        shadowStyle: {
+          color: '#e5e5e5',
+        },
+      },
+    },
+    legend: {
+      orient: 'vertical',
+      x: 'left',
+      show: true,
+      data: ['日志条数', '请求数量', '服务器数量'],
+    },
+    grid: {
+      left: 10,
+      right: 10,
+      bottom: 10,
+      top: 10,
+      containLabel: true,
+    },
+    xAxis: [
+      {
+        type: 'value',
+        axisLine: {
+          show: true,
+          inside: false,
+        },
+        axisLabel: {
+          show: true,
+          inside: false,
+          margin: 8,
+        },
+      },
+    ],
+    yAxis: {
+      boundaryGap: true,
+      axisLabel: {
+        inside: false,
+      },
+      type: 'category',
+      data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+      axisTick: {
+        alignWithLabel: true,
+      },
+    },
+    dataSource: [
+      {
+        name: '直接访问',
+        type: 'bar',
+        barWidth: '60%',
+        data: [10, 52, 200, 334, 390, 330, 220],
+        stack: 'a',
+      },
+      {
+        name: '请求数量',
+        type: 'bar',
+        barWidth: '60%',
+        data: [100, 520, 20, 33, 39, 33, 22],
+        stack: 'a',
+      },
+      {
+        name: '服务器数量',
+        type: 'bar',
+        barWidth: '60%',
+        data: [110, 152, 120, 300, 390, 330, 122],
+        stack: 'a',
+      },
+      {
+        name: 'IP数量',
+        type: 'bar',
+        barWidth: '60%',
+        data: [130, 112, 160, 90, 100, 30, 122],
+        stack: 'a',
+      },
+      {
+        name: '日志level',
+        type: 'bar',
+        barWidth: '60%',
+        data: [130, 112, 160, 90, 100, 30, 122],
+        stack: 'a',
+      },
+    ],
+  };
+
+  return (
+    <>
+      <div>横向堆叠图</div>
+      <BasicBar height={500} {...options} />
+    </>
+  );
+}

package/dist/esm/basicBar/_example/LabelRotate.d.ts

@@ -0,0 +1 @@
+export default function LabelRotate(): JSX.Element;

package/dist/esm/basicBar/_example/LabelRotate.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import { BasicBar } from '@tencent/tcharts-component';
+export default function LabelRotate() {
+    var xAxis = {
+        axisLabel: { rotate: 60 },
+        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+    };
+    var dataSource = [
+        {
+            name: '日志数量',
+            type: 'bar',
+            barWidth: '60%',
+            data: [10, 52, 200, 334, 390, 330, 220],
+        },
+    ];
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", null, "x\u8F74\u6587\u5B57\u65CB\u8F6C\u7684\u67F1\u72B6\u56FE"),
+        React.createElement(BasicBar, { xAxis: xAxis, dataSource: dataSource, height: 500 })));
+}
+//# sourceMappingURL=LabelRotate.js.map

package/dist/esm/basicBar/_example/LabelRotate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LabelRotate.js","sourceRoot":"","sources":["../../../../src/basicBar/_example/LabelRotate.jsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AAEtD,MAAM,CAAC,OAAO,UAAU,WAAW;IACjC,IAAM,KAAK,GAAG;QACZ,SAAS,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE;QACzB,IAAI,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC;KACxD,CAAC;IACF,IAAM,UAAU,GAAG;QACjB;YACE,IAAI,EAAE,MAAM;YACZ,IAAI,EAAE,KAAK;YACX,QAAQ,EAAE,KAAK;YACf,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;SACxC;KACF,CAAC;IAEF,OAAO,CACL;QACE,2FAAqB;QACrB,oBAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,EAAE,GAAG,GAAI,CAC9D,CACJ,CAAC;AACJ,CAAC"}

package/dist/esm/basicBar/_example/LabelRotate.jsx

@@ -0,0 +1,24 @@
+import React from 'react';
+import { BasicBar } from '@tencent/tcharts-component';
+
+export default function LabelRotate() {
+  const xAxis = {
+    axisLabel: { rotate: 60 },
+    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+  };
+  const dataSource = [
+    {
+      name: '日志数量',
+      type: 'bar',
+      barWidth: '60%',
+      data: [10, 52, 200, 334, 390, 330, 220],
+    },
+  ];
+
+  return (
+    <>
+      <div>x轴文字旋转的柱状图</div>
+      <BasicBar xAxis={xAxis} dataSource={dataSource} height={500} />
+    </>
+  );
+}

package/dist/esm/basicBar/_example/StackedBar.d.ts

@@ -0,0 +1 @@
+export default function StackedBar(): JSX.Element;

package/dist/esm/basicBar/_example/StackedBar.js

@@ -0,0 +1,44 @@
+import { __assign } from "tslib";
+import React from 'react';
+import { BasicBar } from '@tencent/tcharts-component';
+export default function StackedBar() {
+    var options = {
+        xAxis: {
+            data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+        },
+        dataSource: [
+            {
+                name: '日志数量',
+                type: 'bar',
+                data: [
+                    3.399,
+                    18.199,
+                    1.199,
+                    0.9,
+                    18.6,
+                    2.6,
+                    3.899,
+                ],
+                stack: 'a',
+            },
+            {
+                name: '请求数量',
+                type: 'bar',
+                data: [
+                    4.099,
+                    4.4,
+                    3.399,
+                    3.7,
+                    3.899,
+                    3.799,
+                    4.099,
+                ],
+                stack: 'a',
+            },
+        ],
+    };
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", null, "\u5806\u53E0\u67F1\u72B6\u56FE"),
+        React.createElement(BasicBar, __assign({ height: 500 }, options))));
+}
+//# sourceMappingURL=StackedBar.js.map

package/dist/esm/basicBar/_example/StackedBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StackedBar.js","sourceRoot":"","sources":["../../../../src/basicBar/_example/StackedBar.jsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AAEtD,MAAM,CAAC,OAAO,UAAU,UAAU;IAChC,IAAM,OAAO,GAAG;QACd,KAAK,EAAE;YACL,IAAI,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC;SACxD;QACD,UAAU,EAAE;YACV;gBACE,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,KAAK;gBACX,IAAI,EAAE;oBACJ,KAAK;oBACL,MAAM;oBACN,KAAK;oBACL,GAAG;oBACH,IAAI;oBACJ,GAAG;oBACH,KAAK;iBACN;gBACD,KAAK,EAAE,GAAG;aACX;YACD;gBACE,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,KAAK;gBACX,IAAI,EAAE;oBACJ,KAAK;oBACL,GAAG;oBACH,KAAK;oBACL,GAAG;oBACH,KAAK;oBACL,KAAK;oBACL,KAAK;iBACN;gBACD,KAAK,EAAE,GAAG;aACX;SACF;KACF,CAAC;IACF,OAAO,CACL;QACE,kEAAgB;QAChB,oBAAC,QAAQ,aAAC,MAAM,EAAE,GAAG,IAAM,OAAO,EAAI,CACrC,CACJ,CAAC;AACJ,CAAC"}

package/dist/esm/basicBar/_example/StackedBar.jsx

@@ -0,0 +1,46 @@
+import React from 'react';
+import { BasicBar } from '@tencent/tcharts-component';
+
+export default function StackedBar() {
+  const options = {
+    xAxis: {
+      data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+    },
+    dataSource: [
+      {
+        name: '日志数量',
+        type: 'bar',
+        data: [
+          3.399,
+          18.199,
+          1.199,
+          0.9,
+          18.6,
+          2.6,
+          3.899,
+        ],
+        stack: 'a',
+      },
+      {
+        name: '请求数量',
+        type: 'bar',
+        data: [
+          4.099,
+          4.4,
+          3.399,
+          3.7,
+          3.899,
+          3.799,
+          4.099,
+        ],
+        stack: 'a',
+      },
+    ],
+  };
+  return (
+    <>
+      <div>堆叠柱状图</div>
+      <BasicBar height={500} {...options} />
+    </>
+  );
+}

package/dist/esm/basicBar/_example/VerticalWaterfallBar.d.ts

@@ -0,0 +1 @@
+export default function VerticalWaterfallBar(): JSX.Element;