@publishfx/publish-chart 2.1.0 → 2.1.1

package/CHANGELOG.md

@@ -1,3 +1,36 @@
+**2.1.1** feat(chart): 柱状图支持crossharisY
+- 2026-02-28T18:37:26+08:00 [feat(chart): 柱状图支持crossharisY](http://lf.git.oa.mt/publish_platform/web/publish/commit/b77a0932f1710144915d209c0186640bafdff492)
+
+**2.1.1** feat(chart): 柱状图支持crossharisY
+- 2026-02-28T18:37:26+08:00 [feat(chart): 柱状图支持crossharisY](http://lf.git.oa.mt/publish_platform/web/publish/commit/b77a0932f1710144915d209c0186640bafdff492)
+- 2026-02-28T16:06:24+08:00 [fix(chart): ts错误修复](http://lf.git.oa.mt/publish_platform/web/publish/commit/7a070b0f77b3ff41450fce0884f8713ebd58f4b2)
+- 2026-02-28T15:53:07+08:00 [fix(chart): 柱状图和折线图的图例分别设置为square和line](http://lf.git.oa.mt/publish_platform/web/publish/commit/a11ccf463d4fad84ae0d4b84672bc1db79951bb1)
+- 2026-02-28T15:40:18+08:00 [feat(chart): 折线图和组合图支持节点详情](http://lf.git.oa.mt/publish_platform/web/publish/commit/73593a0644bc956772395a307f6e73f43b80a159)
+- 2026-02-28T15:19:08+08:00 [fix(chart): 节点详情Dom结构修改](http://lf.git.oa.mt/publish_platform/web/publish/commit/0e8de83391883c976bf9a4aaaff161679f845c09)
+- 2026-02-28T15:17:44+08:00 [feat: 堆积图数据标签&高亮](http://lf.git.oa.mt/publish_platform/web/publish/commit/867b4341e71a8703f31b4c1808b7d57e0a58c480)
+- 2026-02-28T15:09:33+08:00 [feat(chart): 新增柱状图节点详情支持](http://lf.git.oa.mt/publish_platform/web/publish/commit/fd94eacc4618f04704caf4c61c8e914900ceb688)
+- 2026-02-28T12:22:23+08:00 [feat(chart): 着重显示的逻辑联动tooltipRender的数据处理](http://lf.git.oa.mt/publish_platform/web/publish/commit/934e5a798d8424327aa13a3d739fb03cc00935f4)
+- 2026-02-28T12:12:29+08:00 [feat(chart): 新增高亮日期辅助函数](http://lf.git.oa.mt/publish_platform/web/publish/commit/539ccc99d93680497fa770ea5c08c80b119eb098)
+- 2026-02-28T00:08:09+08:00 [feat(chart): 组合图tooltip修正](http://lf.git.oa.mt/publish_platform/web/publish/commit/12ac7885e508cf26a1b8322a6c048c25accfba54)
+- 2026-02-27T22:50:37+08:00 [feat(chart): G2Combine组合图支持双轴展示](http://lf.git.oa.mt/publish_platform/web/publish/commit/8c4428edecd5922f75746c168fd76da68364c690)
+- 2026-02-27T21:46:47+08:00 [feat: 堆积图](http://lf.git.oa.mt/publish_platform/web/publish/commit/55e60330c83cc19e548bbb91c9ed0837d39a9282)
+- 2026-02-27T20:58:12+08:00 [feat(chart): 图例组件支持symbol符号](http://lf.git.oa.mt/publish_platform/web/publish/commit/06435b768d54913aacf12280ff9e7b2e782fb7cb)
+- 2026-02-27T20:44:47+08:00 [fix(chart): G2Combine组合图的图例逻辑修改成线上一致](http://lf.git.oa.mt/publish_platform/web/publish/commit/ff7d39e61c9945aa9c1db61d319a7ae3d0cba23b)
+- 2026-02-27T19:49:23+08:00 [fix(chart): 组合图补充节点逻辑](http://lf.git.oa.mt/publish_platform/web/publish/commit/05ab21057b5c7695e559ab664c8e2135fd8b7f49)
+- 2026-02-27T19:45:55+08:00 [feat(chart): G2CombineChart组合图初步提交](http://lf.git.oa.mt/publish_platform/web/publish/commit/36e1d93d3d9714c8899e23bb86a829c22ce24aab)
+- 2026-02-27T16:10:00+08:00 [fix(chart): 修复折线图高亮参数支持](http://lf.git.oa.mt/publish_platform/web/publish/commit/691e792838831d92d2b1229ee500dab30b5af913)
+- 2026-02-27T16:01:24+08:00 [fix(chart): 辅助线使用自定义render渲染](http://lf.git.oa.mt/publish_platform/web/publish/commit/a9285296553ccb0c1c7e52a2365a1bd6c386d26b)
+- 2026-02-27T15:57:34+08:00 [feat(chart): 更新G2LineChart组件](http://lf.git.oa.mt/publish_platform/web/publish/commit/c7c25e369fcebf1c04f1c9487d0de0dc7b533ef3)
+- 2026-02-26T23:33:58+08:00 [fix(chart): G2BarChart的图例文案保持一致](http://lf.git.oa.mt/publish_platform/web/publish/commit/01b0ae29d1deccb600163cefb983788c38e0948d)
+- 2026-02-26T22:58:27+08:00 [feat(chart): 增加G2BarChart柱状图](http://lf.git.oa.mt/publish_platform/web/publish/commit/b69d46602f28d3f68531f516a162ea6717a21ffc)
+- 2026-02-26T22:32:20+08:00 [feat(chart): G2版本Tooltip渲染函数更新](http://lf.git.oa.mt/publish_platform/web/publish/commit/2788488cdbe38561ec19b8f1fab814f0292029ed)
+- 2026-02-11T23:23:12+08:00 [feat(chart): 新增G2PieChart饼图和G2IndicatorCardChart指标卡图表组件](http://lf.git.oa.mt/publish_platform/web/publish/commit/42e516b980dbccc39def106611af29eea64e42de)
+- 2026-02-11T20:19:51+08:00 [feat(chart): legend](http://lf.git.oa.mt/publish_platform/web/publish/commit/dc1957c73dbd91107ba6ca2f8e4f2aefbedb4b36)
+- 2026-02-10T16:31:05+08:00 [feat(chart): tooltip优化](http://lf.git.oa.mt/publish_platform/web/publish/commit/6a486017fcaf23bd478d269b4e74962347e316ba)
+- 2026-02-10T15:55:53+08:00 [feat(chart): tooltips](http://lf.git.oa.mt/publish_platform/web/publish/commit/bceab306e7ff2dd855a789982b9df37292bca2fe)
+- 2026-02-06T20:03:25+08:00 [feat: 节点信息&对比时间](http://lf.git.oa.mt/publish_platform/web/publish/commit/893949661301676195b1dba1a9531678da50f926)
+- 2026-02-05T18:38:44+08:00 [feat: 着重日功能](http://lf.git.oa.mt/publish_platform/web/publish/commit/a50195b6cc5d0f6645151194fa8d6e856e5af69a)
+
 **2.1.0** fix(chart): ts错误修复
 - 2026-02-28T16:06:24+08:00 [fix(chart): ts错误修复](http://lf.git.oa.mt/publish_platform/web/publish/commit/7a070b0f77b3ff41450fce0884f8713ebd58f4b2)
 - 2026-02-28T15:53:07+08:00 [fix(chart): 柱状图和折线图的图例分别设置为square和line](http://lf.git.oa.mt/publish_platform/web/publish/commit/a11ccf463d4fad84ae0d4b84672bc1db79951bb1)

package/dist/components/g2/base/g2Helpers.d.ts

@@ -290,4 +290,4 @@ export interface GetColorByGroupTypeOptions {
  * 根据 groupType（或去掉 _compare 后的 baseKey）返回颜色，折线 stroke / 柱状 fill 共用
  */
 export declare function getColorByGroupType(groupType: string, options: GetColorByGroupTypeOptions): string;
-export declare function applyHighlightDate(view: any, x: string, data: any, highlightDate: string[]): void;
+export declare function applyHighlightDate(view: any, x: string, data: any, highlightDate: string[], isHighlight: boolean): void;

package/dist/components/g2/base/g2Helpers.js

@@ -140,28 +140,39 @@ function getColorByGroupType(groupType, options) {
     const idx = indicators.indexOf(baseKey);
     return themeColors[idx >= 0 ? idx : 0] ?? themeColors[0] ?? '#5AD8A6';
 }
-function applyHighlightDate(view, x, data, highlightDate) {
+function applyHighlightDate(view, x, data, highlightDate, isHighlight) {
     const allXValues = data.map((item)=>item[x]);
     const highlightX = Array.from(new Set(allXValues));
     const highlightData = highlightX.map((item)=>({
             [x]: item,
             ['highlight']: highlightDate.includes(item) ? 100 : 0
         }));
-    view.interval().data(highlightData).encode('x', x).encode('y', 'highlight').scale('y', {
+    const highlightInterval = view.interval().data(highlightData).encode('x', x).encode('y', 'highlight').scale('y', {
         type: 'linear',
         domainMin: 0,
         domainMax: 100,
-        nice: true,
-        clamp: true,
         independent: true
-    }).axis('y', {
+    }).tooltip(false).axis('y', {
+        title: false,
+        grid: false,
+        label: false
+    });
+    highlightInterval.style({
+        fill: '#cccccc',
+        fillOpacity: isHighlight ? 0.3 : 0
+    });
+    view.line().data(highlightData).encode('x', x).encode('y', 'highlight').scale('y', {
+        type: 'linear',
+        domainMin: 0,
+        domainMax: 100,
+        independent: true
+    }).tooltip(true).axis('y', {
         title: false,
         grid: false,
         label: false
     }).style({
-        columnWidthRatio: 0.65,
-        fill: '#CCCCCC',
-        fillOpacity: 0.3
+        stroke: 'transparent',
+        strokeOpacity: 0
     });
 }
 export { applyAuxiliaryLineY, applyAxisX, applyAxisY, applyHighlightDate, applyLegendColor, applyScaleYLinear, createChart, getColorByGroupType, getMainView };

package/dist/components/g2/base/g2bar.js

@@ -2,7 +2,7 @@ import { lines } from "@antv/g-pattern";
 import { applyAuxiliaryLineY, applyAxisX, applyAxisY, applyHighlightDate, applyScaleYLinear, createChart, getColorByGroupType, getMainView } from "./g2Helpers.js";
 const Y_AXIS_FIELD = 'groupValue';
 function renderG2BarChart(container, options) {
-    const { data, x, y, maxY, timeRange: _timeRange, themeColors, indicators = [], indicatorMap: _indicatorMap = {}, formatAxis, highlightDate = [], isDataTag = false, isLegend = true, isHorizontal = false, isHighlight: _isHighlight = true, isCompare = false, legend, formatLabel, height = 300, tooltipRender, auxiliaryLineData = [], onNodeListChange, onChartRender } = options;
+    const { data, x, y, maxY, timeRange: _timeRange, themeColors, indicators = [], indicatorMap: _indicatorMap = {}, formatAxis, highlightDate = [], isDataTag = false, isLegend = true, isHorizontal = false, isHighlight = true, isCompare = false, legend, formatLabel, height = 300, tooltipRender, auxiliaryLineData = [], onNodeListChange, onChartRender } = options;
     const colorOpts = {
         themeColors,
         primaryKey: y,
@@ -36,12 +36,22 @@ function renderG2BarChart(container, options) {
         nice: true,
         clamp: true
     });
-    applyHighlightDate(view, x, data, highlightDate);
-    const interval = view.interval().encode('x', x).encode('y', y).encode('color', 'groupType').encode('series', 'groupType').transform({
+    applyHighlightDate(view, x, data, highlightDate, isHighlight);
+    console.log('g2bar data:', data, y);
+    const interval = view.interval().encode('x', x).encode('y', y).encode('color', 'groupType').transform({
         type: 'dodgeX',
         padding: isHorizontal ? 0.2 : 0
-    }).style({
-        columnWidthRatio: 0.5,
+    });
+    interval.style({
+        columnWidthRatio: 0.6,
+        insetLeft: (_d, index, _data, _column)=>{
+            if (isCompare) return index % 2 === 0 ? 4 : 0;
+            return 4;
+        },
+        insetRight: (_d, index, _data, _column)=>{
+            if (isCompare) return index % 2 === 1 ? 4 : 0;
+            return 4;
+        },
         fill: (datum)=>{
             const groupType = String(datum.groupType ?? '');
             if (groupType.includes('_compare')) return {
@@ -56,20 +66,12 @@ function renderG2BarChart(container, options) {
                 transform: 'rotate(-30deg)'
             };
             return getColorByGroupType(groupType, colorOpts);
-        },
-        stroke: 'transparent'
+        }
     });
     applyAxisX(view, {
-        title: false,
         grid: false
     });
     applyAxisY(view, {
-        title: false,
-        grid: true,
-        gridLineDash: [
-            0,
-            0
-        ],
         labelFormatter: formatAxis
     });
     view.legend(false);
@@ -99,8 +101,11 @@ function renderG2BarChart(container, options) {
                 }) : null
         ].filter(Boolean)
     });
-    if (tooltipRender) interval.interaction('tooltip', {
+    if (tooltipRender) view.interaction('tooltip', {
         shared: true,
+        crosshairsY: true,
+        wait: 100,
+        marker: false,
         render: (_event, payload)=>{
             const { title, items } = payload;
             const lastIsChange = items.filter((item)=>item.isChange);

package/dist/components/g2/base/g2groupbar.js

@@ -32,7 +32,7 @@ function renderG2GroupBarChart(container, options) {
         nice: true,
         clamp: true
     });
-    if (isHighlight) applyHighlightDate(view, x, data, highlightDate);
+    applyHighlightDate(view, x, data, highlightDate, isHighlight);
     const interval = view.interval().encode('x', x).encode('y', y).encode('color', 'groupType').transform({
         type: 'stackY',
         reverse: true

package/dist/components/g2/base/g2line.js

@@ -1,4 +1,4 @@
-import { applyAuxiliaryLineY, applyAxisX, applyAxisY, applyScaleYLinear, createChart, getColorByGroupType, getMainView } from "./g2Helpers.js";
+import { applyAuxiliaryLineY, applyAxisX, applyAxisY, applyHighlightDate, applyScaleYLinear, createChart, getColorByGroupType, getMainView } from "./g2Helpers.js";
 const Y_AXIS_FIELD = 'groupValue';
 function renderG2LineChart(container, options) {
     const { data, x, y, minY, maxY, timeRange: _timeRange, themeColors, indicators = [], indicatorMap: _indicatorMap = {}, formatAxis, highlightDate = [], auxiliaryLineData = [], isDataTag = false, isLegend = true, isHighlight = true, formatLabel, height = 300, legendLength: _legendLength, legendSize: _legendSize, tooltipRender, onNodeListChange, onChartRender } = options;
@@ -29,6 +29,7 @@ function renderG2LineChart(container, options) {
         nice: true,
         clamp: true
     });
+    applyHighlightDate(view, x, data, highlightDate, isHighlight);
     console.log('g2linets:', x, Y_AXIS_FIELD, data);
     const line = view.line().data(data.filter((item)=>!item.groupType.includes('_compare'))).encode('x', x).encode('y', Y_AXIS_FIELD).encode('color', 'groupType').style({
         lineWidth: 2,
@@ -43,23 +44,9 @@ function renderG2LineChart(container, options) {
         stroke: (_datum, index)=>themeColors[index] ?? themeColors[0]
     });
     applyAxisX(view, {
-        title: false,
-        grid: true,
-        gridStroke: '#333',
-        gridLineWidth: 50,
-        gridLineDash: [
-            1000
-        ],
-        gridFilter: highlightDate.length > 0 && isHighlight ? (val)=>highlightDate.includes(val?.label) : ()=>false
+        grid: false
     });
     applyAxisY(view, {
-        title: false,
-        grid: true,
-        gridStrokeOpacity: 0.2,
-        gridLineDash: [
-            0,
-            0
-        ],
         labelFormatter: formatAxis
     });
     line.tooltip({
@@ -94,9 +81,8 @@ function renderG2LineChart(container, options) {
                 })
         ]
     });
-    if (tooltipRender) line.interaction('tooltip', {
+    if (tooltipRender) view.interaction('tooltip', {
         shared: true,
-        crosshairsY: true,
         marker: false,
         render: (_event, payload)=>{
             const { title, items } = payload;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@publishfx/publish-chart",
-  "version": "2.1.0",
+  "version": "2.1.1",
   "description": "A React chart component library for the Publish platform, including BarChart, LineChart, BarLineChart and other visualization components",
   "type": "module",
   "keywords": [