@xq-labs/data-ui-v2 0.2.1 → 0.3.0

package/lib/{index-7abf647e.js → index-a0ecafa1.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var colors = require('./colors-55265c91.js');
+var colors = require('./colors-19a7242d.js');
 var echarts = require('echarts/core');
 var charts = require('echarts/charts');
 var components = require('echarts/components');
@@ -90,10 +90,11 @@ var PIE_HEIGHT_MODE = {
   VALUE: 'value'
 };
 var DEFAULT_HEIGHT_RANGE = {
-  min: 20,
-  max: 80
+  min: 10,
+  max: 25
 };
-var DEFAULT_3D_VIEW_ALPHA = 28;
+var DEFAULT_3D_VIEW_DISTANCE = 120;
+var DEFAULT_3D_VIEW_ALPHA = 55;
 var DEFAULT_INTERNAL_DIAMETER_RATIO = 0.6;
 var DEFAULT_ROSE_RADIUS_RANGE = [0.75, 1.15];
 var DEFAULT_LABEL_OPTIONS = {
@@ -111,6 +112,17 @@ var DEFAULT_LABEL_OPTIONS = {
   verticalGap: 8,
   radialOffset: 0.12
 };
+var DEFAULT_TOOLTIP_STYLE = {
+  backgroundColor: '#fff',
+  borderColor: 'transparent',
+  borderWidth: 0,
+  padding: [8, 12],
+  textStyle: {
+    color: '#333',
+    fontSize: 12
+  },
+  extraCssText: 'box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); border-radius: 4px;'
+};
 
 /**
  * 将输入值转为安全数字。
@@ -217,6 +229,9 @@ function buildPieChartData(data) {
 function replaceLabelTemplate(template, params) {
   return template.replace(/\{b\}/g, params.name).replace(/\{c\}/g, params.value).replace(/\{d\}/g, params.percent);
 }
+function escapeTooltipHtml(value) {
+  return String(value).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&#39;');
+}
 function formatPieLabelText(formatter, params) {
   if (typeof formatter === 'function') {
     return formatter(params);
@@ -226,29 +241,65 @@ function formatPieLabelText(formatter, params) {
   }
   return "".concat(params.name, "\n").concat(params.percent, "%");
 }
+function createFallbackTooltipMarker(color) {
+  var markerColor = escapeTooltipHtml(color || '#6B98F8');
+  return "<span style=\"display:inline-block;margin-right:4px;border-radius:50%;width:10px;height:10px;background-color:".concat(markerColor, ";\"></span>");
+}
+function formatPieTooltipContent(_ref) {
+  var marker = _ref.marker,
+    name = _ref.name,
+    value = _ref.value,
+    color = _ref.color;
+  var safeMarker = marker || createFallbackTooltipMarker(color);
+  return "".concat(safeMarker).concat(escapeTooltipHtml(name), ":").concat(escapeTooltipHtml(value));
+}
+
+/**
+ * 创建饼图统一 hover tooltip 样式。
+ * 默认呈现为白底阴影卡片，内容为“彩色圆点 + 名称:值”，贴近业务看板常见展示形态。
+ */
+function createPieTooltipOption(formatter) {
+  return colors._objectSpread2(colors._objectSpread2({}, DEFAULT_TOOLTIP_STYLE), {}, {
+    formatter: formatter
+  });
+}
+function formatPie2DTooltip() {
+  var params = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  return formatPieTooltipContent({
+    marker: params.marker,
+    name: params.name === undefined ? '' : params.name,
+    value: params.value === undefined ? '' : params.value,
+    color: params.color
+  });
+}
 
 /**
  * 格式化 3D 饼图默认 tooltip 文案。
  * surface 系列 hover 时拿到的 `params.value` 实际是参数方程采样值，
  * 不能直接当业务值展示，因此统一回退到扇区自身的 `pieData`。
  */
-function formatPieTooltipText(name, value, percent) {
-  return "".concat(name, ": ").concat(value, " (").concat(percent, "%)");
+function formatPie3DTooltip(params, pieData) {
+  return formatPieTooltipContent({
+    marker: params && params.marker,
+    name: pieData && pieData.name !== undefined ? pieData.name : '',
+    value: pieData && pieData.value !== undefined ? pieData.value : 0,
+    color: pieData && pieData.itemStyle && pieData.itemStyle.color
+  });
 }
 
 /**
  * 为单个 3D 扇区生成专用 tooltip。
  * 这样即使鼠标落在 surface 网格采样点上，展示的仍然是业务名称、原始值与百分比。
  */
-function createPie3DTooltip(pieData, totalValue) {
+function createPie3DTooltip(pieData) {
   var value = toNumber(pieData && pieData.value, 0);
-  var percent = totalValue > 0 ? Number((value / totalValue * 100).toFixed(2)) : 0;
   var name = pieData && pieData.name !== undefined ? pieData.name : '';
-  return {
-    formatter: function formatter() {
-      return formatPieTooltipText(name, value, percent);
-    }
-  };
+  return createPieTooltipOption(function (params) {
+    return formatPie3DTooltip(params, colors._objectSpread2(colors._objectSpread2({}, pieData), {}, {
+      name: name,
+      value: value
+    }));
+  });
 }
 function multiplyMat4Vec4(matrix, vector) {
   return [matrix[0] * vector[0] + matrix[4] * vector[1] + matrix[8] * vector[2] + matrix[12] * vector[3], matrix[1] * vector[0] + matrix[5] * vector[1] + matrix[9] * vector[2] + matrix[13] * vector[3], matrix[2] * vector[0] + matrix[6] * vector[1] + matrix[10] * vector[2] + matrix[14] * vector[3], matrix[3] * vector[0] + matrix[7] * vector[1] + matrix[11] * vector[2] + matrix[15] * vector[3]];
@@ -457,11 +508,9 @@ function createHeightValues(values, mode, minHeight, maxHeight) {
   }
   return mapValueToRange(values, safeMinHeight, safeMaxHeight);
 }
-function createAdaptiveViewControl(showLabelLine, maxHeight) {
-  var baseDistance = showLabelLine ? 175 : 180;
-  var extraDistance = Math.max(0, maxHeight - 200) * 0.18;
+function createDefaultViewControl() {
   return {
-    distance: baseDistance + extraDistance,
+    distance: DEFAULT_3D_VIEW_DISTANCE,
     alpha: DEFAULT_3D_VIEW_ALPHA
   };
 }
@@ -598,9 +647,6 @@ function buildPie3DSeries(pieData) {
   var valueList = renderPieData.map(function (item) {
     return Math.max(0, toNumber(item.value, 0));
   });
-  var totalValue = valueList.reduce(function (sum, value) {
-    return sum + value;
-  }, 0);
   var angleValueList = getAngleValueList(valueList);
   var totalAngleValue = angleValueList.reduce(function (sum, value) {
     return sum + value;
@@ -634,7 +680,7 @@ function buildPie3DSeries(pieData) {
         selected: false,
         hovered: false
       },
-      tooltip: createPie3DTooltip(item, totalValue),
+      tooltip: createPie3DTooltip(item),
       itemStyle: colors._objectSpread2({}, item.itemStyle),
       parametricEquation: getParametricEquation(startRatio, endRatio, false, false, geometry)
     };
@@ -729,7 +775,7 @@ function createPie3DOption(input, variant) {
     hideZeroValueSlices: input.hideZeroValueSlices !== false
   };
   var pie3D = buildPie3DSeries(data, chartConfig);
-  var viewControl = createAdaptiveViewControl(chartConfig.showLabelLine, safeMaxHeight);
+  var viewControl = createDefaultViewControl();
   return {
     xAxis3D: {
       min: -pie3D.axisLimit,
@@ -916,10 +962,9 @@ function buildPieOption() {
   });
   var baseOption = {
     color: colors.DEFAULT_COLORS,
-    tooltip: {
-      trigger: 'item',
-      formatter: '{b}: {c} ({d}%)'
-    },
+    tooltip: colors._objectSpread2({
+      trigger: 'item'
+    }, createPieTooltipOption(formatPie2DTooltip)),
     legend: {
       data: normalizedData.map(function (item) {
         return item.name;
@@ -948,33 +993,26 @@ function buildPieOption() {
   return colors.mergeChartOption(colors.mergeChartOption(baseOption, presetOption, variantOption), customOption);
 }
 
-var runtimePromise = null;
-var ECHARTS_GL_PACKAGE_NAME = 'echarts-gl';
-var MISSING_RUNTIME_MESSAGE = '使用 PieChart 3D 能力需要安装 echarts-gl，请执行 npm install echarts-gl。';
-var createMissingRuntimeError = function createMissingRuntimeError(error) {
-  var runtimeError = new Error(MISSING_RUNTIME_MESSAGE);
-  runtimeError.cause = error;
-  return runtimeError;
-};
-var importRuntime = function importRuntime() {
-  var dynamicImport = new Function('packageName', 'return import(packageName)');
-  return dynamicImport(ECHARTS_GL_PACKAGE_NAME);
+var SURFACE_SERIES_TYPE = 'series.surface';
+var MISSING_RUNTIME_MESSAGE = "使用 PieChart 3D 能力前，请先在业务页面中执行 import '@xq-labs/data-ui-v2/pie-chart/3d-runtime'。";
+var hasSurfaceSeriesRuntime = function hasSurfaceSeriesRuntime() {
+  return echarts.SeriesModel && (typeof echarts.SeriesModel.getClass === 'function' && !!echarts.SeriesModel.getClass('series', 'surface') || typeof echarts.SeriesModel.getClassesByMainType === 'function' && echarts.SeriesModel.getClassesByMainType('series').some(function (seriesClass) {
+    return seriesClass && seriesClass.type === SURFACE_SERIES_TYPE;
+  }));
 };
 
 /**
- * 按需加载 echarts-gl 运行时。
+ * 检测 PieChart 3D 运行时是否已经由业务项目接入。
  *
- * 这里不能在模块顶层静态加载 echarts-gl，否则只使用 2D 饼图的业务方也会被迫安装。
- * 加载结果会被缓存，避免同一个页面内多个 3D 饼图重复触发运行时加载。
+ * 方案 B 修订版下，组件库不再负责动态加载 `echarts-gl`，
+ * 而是要求业务项目在使用 3D PieChart 的页面中显式执行桥接入口：
+ * `import '@xq-labs/data-ui-v2/pie-chart/3d-runtime'`
  */
 function ensureEchartsGlRuntime() {
-  if (!runtimePromise) {
-    runtimePromise = importRuntime()["catch"](function (error) {
-      runtimePromise = null;
-      throw createMissingRuntimeError(error);
-    });
+  if (hasSurfaceSeriesRuntime()) {
+    return Promise.resolve();
   }
-  return runtimePromise;
+  return Promise.reject(new Error(MISSING_RUNTIME_MESSAGE));
 }
 
 echarts__namespace.use([charts.PieChart, components.TooltipComponent, components.LegendComponent, components.GridComponent, components.TitleComponent, components.GraphicComponent, renderers.CanvasRenderer]);
@@ -1049,7 +1087,7 @@ var script = {
      */
     minHeight: {
       type: Number,
-      "default": 20
+      "default": 10
     },
     /**
      * 3D 模式下的最大扇区高度。
@@ -1057,7 +1095,7 @@ var script = {
      */
     maxHeight: {
       type: Number,
-      "default": 80
+      "default": 25
     },
     /**
      * 环图内径比例。
@@ -1160,13 +1198,13 @@ var script = {
     },
     /**
      * 判断当前是否进入 3D 饼图能力。
-     * 只有 3D 才需要加载 echarts-gl，2D 场景不应触发任何 3D 运行时依赖。
+     * 只有 3D 才需要 echarts-gl 桥接入口，2D 场景不应触发任何 3D 运行时依赖。
      */
     is3D: function is3D() {
       return this.dimension === '3d';
     },
     /**
-     * 标识 echarts-gl 是否已经加载完成。
+     * 标识 echarts-gl 运行时是否已经注册完成。
      * 3D option 只有在运行时就绪后才会生成 surface 序列。
      */
     isEchartsGlReady: function isEchartsGlReady() {
@@ -1174,14 +1212,14 @@ var script = {
     },
     /**
      * 汇总外部 loading 与 3D 运行时加载状态。
-     * 这样 3D 首次加载 echarts-gl 时，底层 BaseChart 能保持 loading 态。
+     * 这样 3D 首次检测运行时期间，底层 BaseChart 能保持 loading 态。
      */
     chartLoading: function chartLoading() {
       return this.loading || this.is3D && this.echartsGlStatus === 'loading';
     },
     /**
      * 汇总数据空态与 3D 运行时失败状态。
-     * 缺少 echarts-gl 时不让 BaseChart 继续渲染空 surface option。
+     * 缺少 3D 桥接运行时时不让 BaseChart 继续渲染空 surface option。
      */
     chartEmpty: function chartEmpty() {
       return this.isEmpty || this.is3D && this.echartsGlStatus === 'failed';
@@ -1197,7 +1235,7 @@ var script = {
       if (this.is3D && this.echartsGlStatus === 'failed') {
         return {
           empty: colors._objectSpread2(colors._objectSpread2({}, emptyConfig), {}, {
-            text: this.echartsGlErrorMessage || '使用 3D 饼图需要安装 echarts-gl'
+            text: this.echartsGlErrorMessage || "使用 PieChart 3D 能力前，请先在业务页面中执行 import '@xq-labs/data-ui-v2/pie-chart/3d-runtime'。"
           }),
           loading: colors._objectSpread2({}, loadingConfig)
         };
@@ -1237,7 +1275,7 @@ var script = {
   watch: {
     /**
      * dimension 是 2D/3D 分发的公开开关。
-     * 只有切到 3D 时才按需加载 echarts-gl，避免 2D 使用方被迫安装 3D 运行时。
+     * 只有切到 3D 时才检测 3D 运行时，避免 2D 使用方被迫安装 3D 运行时。
      */
     dimension: {
       immediate: true,
@@ -1269,7 +1307,7 @@ var script = {
       this.$emit('ready', chart);
     },
     /**
-     * 在真正进入 3D 能力时按需加载 echarts-gl。
+     * 在真正进入 3D 能力时检测 echarts-gl 桥接入口是否已经注册。
      *
      * 返回 Promise 是为了让单测和后续业务扩展能准确等待状态变化；
      * 2D、已就绪、加载中三种场景会直接返回 resolved Promise。
@@ -1285,7 +1323,7 @@ var script = {
         _this.echartsGlStatus = 'ready';
       })["catch"](function (error) {
         _this.echartsGlStatus = 'failed';
-        _this.echartsGlErrorMessage = error && error.message ? error.message : '使用 3D 饼图需要安装 echarts-gl';
+        _this.echartsGlErrorMessage = error && error.message ? error.message : "使用 PieChart 3D 能力前，请先在业务页面中执行 import '@xq-labs/data-ui-v2/pie-chart/3d-runtime'。";
         _this.$emit('runtime-error', error);
       });
     },
@@ -1323,7 +1361,7 @@ var script = {
   }
 };
 
-var css_248z = "\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n";
+var css_248z = "\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n";
 withInstall.styleInject(css_248z);
 
 /* script */
@@ -1355,7 +1393,7 @@ __vue_render__._withStripped = true;
 /* style */
 var __vue_inject_styles__ = undefined;
 /* scoped */
-var __vue_scope_id__ = "data-v-19bfc774";
+var __vue_scope_id__ = "data-v-7f129cbd";
 /* module identifier */
 var __vue_module_identifier__ = undefined;
 /* functional template */

package/lib/{index-b9e0c40b.js → index-cc49894a.js}

@@ -5,7 +5,7 @@ var charts = require('echarts/charts');
 var components = require('echarts/components');
 var renderers = require('echarts/renderers');
 var withInstall = require('./with-install-4304a8ea.js');
-var colors = require('./colors-55265c91.js');
+var colors = require('./colors-19a7242d.js');
 
 function _interopNamespaceDefault(e) {
   var n = Object.create(null);
@@ -1079,6 +1079,8 @@ function createCylinderBarLineOption(normalizedInput) {
 }
 
 var DEFAULT_VARIANT = 'flat';
+var DEFAULT_X_AXIS_SCROLL_VISIBLE_COUNT = 8;
+var DEFAULT_X_AXIS_SCROLL_GRID_BOTTOM = 56;
 var BAR_LINE_PUBLIC_VARIANTS = ['flat', 'cylinder', 'cube'];
 
 // 公开 variant 能力在此处收口：只允许 flat / cylinder / cube。
@@ -1124,6 +1126,93 @@ function createBaseOption(normalizedInput) {
     }
   };
 }
+function isValidNumber(value) {
+  return Number.isFinite(Number(value));
+}
+function normalizePositiveInteger(value, fallback) {
+  var normalizedValue = Number(value);
+  if (!Number.isFinite(normalizedValue) || normalizedValue <= 0) {
+    return fallback;
+  }
+  return Math.floor(normalizedValue);
+}
+function normalizeStartIndex(startIndex) {
+  if (!isValidNumber(startIndex)) {
+    return null;
+  }
+  var normalizedStartIndex = Math.floor(Number(startIndex));
+  return normalizedStartIndex >= 0 ? normalizedStartIndex : null;
+}
+function toPercent(value, total) {
+  return Number((value / total * 100).toFixed(2));
+}
+
+/**
+ * 归一化横轴滚动配置。
+ * 该配置只服务 X 轴类目过多的场景，不扩展 Y 轴滚动，避免 API 语义变复杂。
+ */
+function normalizeXAxisScrollConfig() {
+  var xAxisScroll = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var scrollConfig = xAxisScroll && colors._typeof(xAxisScroll) === 'object' ? xAxisScroll : {};
+  return {
+    enabled: scrollConfig.enabled === true,
+    visibleCount: normalizePositiveInteger(scrollConfig.visibleCount, DEFAULT_X_AXIS_SCROLL_VISIBLE_COUNT),
+    startPosition: scrollConfig.startPosition === 'start' ? 'start' : 'end',
+    startIndex: normalizeStartIndex(scrollConfig.startIndex),
+    showSlider: scrollConfig.showSlider !== false,
+    inside: scrollConfig.inside !== false
+  };
+}
+
+/**
+ * 根据横轴类目数量生成 ECharts dataZoom。
+ * 默认从末尾向前取 `visibleCount` 个类目，满足“最新数据优先展示”的看板诉求。
+ */
+function createXAxisScrollOption() {
+  var categories = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+  var xAxisScroll = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  var scrollConfig = normalizeXAxisScrollConfig(xAxisScroll);
+  var totalCount = Array.isArray(categories) ? categories.length : 0;
+  if (!scrollConfig.enabled || totalCount <= scrollConfig.visibleCount) {
+    return {};
+  }
+  var windowSize = Math.min(scrollConfig.visibleCount, totalCount);
+  var maxStartIndex = totalCount - windowSize;
+  var resolvedStartIndex = scrollConfig.startIndex !== null ? Math.min(scrollConfig.startIndex, maxStartIndex) : scrollConfig.startPosition === 'start' ? 0 : maxStartIndex;
+  var start = toPercent(resolvedStartIndex, totalCount);
+  var end = toPercent(resolvedStartIndex + windowSize, totalCount);
+  var dataZoom = [];
+  if (scrollConfig.showSlider) {
+    dataZoom.push({
+      type: 'slider',
+      xAxisIndex: 0,
+      start: start,
+      end: end,
+      height: 14,
+      bottom: 8,
+      brushSelect: false
+    });
+  }
+  if (scrollConfig.inside) {
+    dataZoom.push({
+      type: 'inside',
+      xAxisIndex: 0,
+      start: start,
+      end: end,
+      zoomLock: true
+    });
+  }
+  if (dataZoom.length === 0) {
+    return {};
+  }
+  return colors._objectSpread2(colors._objectSpread2({}, scrollConfig.showSlider ? {
+    grid: {
+      bottom: DEFAULT_X_AXIS_SCROLL_GRID_BOTTOM
+    }
+  } : {}), {}, {
+    dataZoom: dataZoom
+  });
+}
 
 /**
  * 构建 `BarLineChart` 最终 option。
@@ -1131,7 +1220,8 @@ function createBaseOption(normalizedInput) {
  * 1. 输入归一化
  * 2. preset 合并
  * 3. 变体分发
- * 4. customOption 覆盖
+ * 4. X 轴滚动配置合并
+ * 5. customOption 覆盖
  */
 function buildBarLineOption() {
   var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
@@ -1144,6 +1234,7 @@ function buildBarLineOption() {
     variant = _ref$variant === void 0 ? 'flat' : _ref$variant,
     barWidth = _ref.barWidth,
     barGap = _ref.barGap,
+    xAxisScroll = _ref.xAxisScroll,
     customOption = _ref.customOption;
   var normalizedInput = normalizeBarLineInput({
     data: data,
@@ -1159,7 +1250,8 @@ function buildBarLineOption() {
     barWidth: barWidth,
     barGap: barGap
   }));
-  return colors.mergeChartOption(colors.mergeChartOption(baseOption, presetOption, variantOption), customOption);
+  var xAxisScrollOption = createXAxisScrollOption(normalizedInput.categories, xAxisScroll);
+  return colors.mergeChartOption(colors.mergeChartOption(colors.mergeChartOption(baseOption, presetOption, variantOption), xAxisScrollOption), customOption);
 }
 
 //
@@ -1181,7 +1273,7 @@ function buildBarLineOption() {
  * 这里显式注册柱图、折线图、自定义系列以及笛卡尔坐标系常用组件，
  * 否则运行时虽然能生成 option，但对应主类型不会真正参与渲染。
  */
-echarts__namespace.use([charts.BarChart, charts.LineChart, charts.CustomChart, components.TooltipComponent, components.LegendComponent, components.GridComponent, components.TitleComponent, renderers.CanvasRenderer]);
+echarts__namespace.use([charts.BarChart, charts.LineChart, charts.CustomChart, components.TooltipComponent, components.LegendComponent, components.GridComponent, components.TitleComponent, components.DataZoomComponent, renderers.CanvasRenderer]);
 var script = {
   name: 'BarLineChart',
   components: {
@@ -1268,6 +1360,22 @@ var script = {
         return {};
       }
     },
+    /**
+     * X 轴类目滚动配置。
+     * 仅控制横轴，不扩展 Y 轴；适合月份、日期、地区等类目数量较多的看板场景。
+     * 常用字段：
+     * - enabled: 是否开启 X 轴滚动
+     * - visibleCount: 初始窗口内展示的类目数量，默认按 8 个处理
+     * - startPosition: 初始窗口位置，默认 end，即展示最新一段数据
+     * - startIndex: 指定窗口起始索引；传入合法数字时优先级高于 startPosition
+     * - showSlider / inside: 分别控制底部滚动条与图表内部滚轮/触控滚动
+     */
+    xAxisScroll: {
+      type: Object,
+      "default": function _default() {
+        return {};
+      }
+    },
     /**
      * 图表 loading 状态。
      * 由 BaseChart 统一接管组件层遮罩式 loading UI。
@@ -1316,13 +1424,14 @@ var script = {
         preset: this.preset,
         barWidth: this.barWidth,
         barGap: this.barGap,
+        xAxisScroll: this.xAxisScroll,
         customOption: this.customOption
       });
     }
   }
 };
 
-var css_248z = "\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n";
+var css_248z = "\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n";
 withInstall.styleInject(css_248z);
 
 /* script */
@@ -1356,7 +1465,7 @@ __vue_render__._withStripped = true;
 /* style */
 var __vue_inject_styles__ = undefined;
 /* scoped */
-var __vue_scope_id__ = "data-v-1ad2414e";
+var __vue_scope_id__ = "data-v-0c9a6292";
 /* module identifier */
 var __vue_module_identifier__ = undefined;
 /* functional template */

package/lib/index.js

@@ -4,18 +4,20 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 require('../theme-chalk/index.css');
 var withInstall = require('./with-install-4304a8ea.js');
-var index$1 = require('./index-b9e0c40b.js');
-var index$2 = require('./index-7abf647e.js');
+var index$1 = require('./index-cc49894a.js');
+var index$2 = require('./index-a0ecafa1.js');
+var index$3 = require('./index-6039f724.js');
 require('echarts/core');
 require('echarts/charts');
 require('echarts/components');
 require('echarts/renderers');
-require('./colors-55265c91.js');
+require('./colors-19a7242d.js');
 
 withInstall.withInstall(withInstall.BaseChart);
 withInstall.withInstall(index$1.BarLineChart);
 withInstall.withInstall(index$2.PieChart);
-var components = [withInstall.BaseChart, index$1.BarLineChart, index$2.PieChart];
+withInstall.withInstall(index$3.RadarChart);
+var components = [withInstall.BaseChart, index$1.BarLineChart, index$2.PieChart, index$3.RadarChart];
 
 // 发布根入口复用组件清单，确保与 src/index.js 行为一致。
 var install = function install(Vue) {
@@ -30,5 +32,6 @@ var index = {
 exports.BaseChart = withInstall.BaseChart;
 exports.BarLineChart = index$1.BarLineChart;
 exports.PieChart = index$2.PieChart;
+exports.RadarChart = index$3.RadarChart;
 exports.default = index;
 exports.install = install;

package/lib/pie-chart/3d-runtime.js

@@ -0,0 +1,27 @@
+'use strict';
+
+var echarts = require('echarts/core');
+var charts = require('echarts-gl/charts');
+var components = require('echarts-gl/components');
+
+function _interopNamespaceDefault(e) {
+	var n = Object.create(null);
+	if (e) {
+		Object.keys(e).forEach(function (k) {
+			if (k !== 'default') {
+				var d = Object.getOwnPropertyDescriptor(e, k);
+				Object.defineProperty(n, k, d.get ? d : {
+					enumerable: true,
+					get: function () { return e[k]; }
+				});
+			}
+		});
+	}
+	n.default = e;
+	return Object.freeze(n);
+}
+
+var echarts__namespace = /*#__PURE__*/_interopNamespaceDefault(echarts);
+
+// PieChart 3D 只需要 surface 序列与 grid3D 坐标系，显式注册到组件库同一个 echarts/core 实例。
+echarts__namespace.use([charts.SurfaceChart, components.Grid3DComponent]);

package/lib/pie-chart/index.js

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 require('../../theme-chalk/index.css');
-var index = require('../index-7abf647e.js');
+var index = require('../index-a0ecafa1.js');
 var withInstall = require('../with-install-4304a8ea.js');
-require('../colors-55265c91.js');
+require('../colors-19a7242d.js');
 require('echarts/core');
 require('echarts/charts');
 require('echarts/components');

package/lib/radar-chart/index.js

@@ -0,0 +1,19 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+require('../../theme-chalk/index.css');
+var index = require('../index-6039f724.js');
+var withInstall = require('../with-install-4304a8ea.js');
+require('echarts/core');
+require('echarts/charts');
+require('echarts/components');
+require('echarts/renderers');
+require('../colors-19a7242d.js');
+
+var RadarChartComponent = withInstall.withInstall(index.RadarChart);
+var install = RadarChartComponent.install;
+
+exports.RadarChart = RadarChartComponent;
+exports.default = RadarChartComponent;
+exports.install = install;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xq-labs/data-ui-v2",
-  "version": "0.2.1",
+  "version": "0.3.0",
   "main": "lib/index.js",
   "module": "es/index.js",
   "style": "theme-chalk/index.css",
@@ -10,6 +10,11 @@
       "import": "./es/index.js",
       "default": "./lib/index.js"
     },
+    "./pie-chart/3d-runtime": {
+      "require": "./lib/pie-chart/3d-runtime.js",
+      "import": "./pie-chart/3d-runtime.js",
+      "default": "./pie-chart/3d-runtime.js"
+    },
     "./lib/*": "./lib/*/index.js",
     "./es/*": "./es/*/index.js",
     "./theme-chalk/index.css": "./theme-chalk/index.css",
@@ -21,7 +26,11 @@
   },
   "sideEffects": [
     "*.css",
-    "theme-chalk/index.css"
+    "theme-chalk/index.css",
+    "pie-chart/3d-runtime.js",
+    "src/entries/pie-chart-3d-runtime.js",
+    "lib/pie-chart/3d-runtime.js",
+    "es/pie-chart/3d-runtime.js"
   ],
   "engines": {
     "node": ">=14 <15"
@@ -39,6 +48,7 @@
   "files": [
     "lib",
     "es",
+    "pie-chart",
     "theme-chalk",
     "docs/api",
     "docs/examples",

package/pie-chart/3d-runtime.js

@@ -0,0 +1 @@
+import '../es/pie-chart/3d-runtime.js'