alibaba / BizCharts

Powerful data visualization library based on G2 and React.
http://bizcharts.net/products/bizCharts
6.16k stars 671 forks source link

带有label的条形图(BizCharts@4)数据紊乱,刷新会随机出现以下2种情况,label对应的会乱 #1547

Open Danihay opened 1 year ago

Danihay commented 1 year ago

image image

详细代码如下,数据有25条,数据需要count从高到低展示 import React from "react"; import { G2, Chart, Interval, Axis, Tooltip, Coordinate, Label, Legend, View, Guide, Shape, Facet, Util, } from "bizcharts"; import DataSet from "@antv/data-set"; const MOCK_DATA = []; function BaseStrip({ data = MOCK_DATA, height = 120, keyName="country", keyVal = "population" }) { console.log('BaseStripBaseStrip',data); const label = { style: { textAlign: 'right', // 文本对齐方向,可取值为: start center end fill: '#474A52', // 文本的颜色 fontSize: 12, // 文本大小 fontWeight: 400, // 文本粗细 textBaseline: 'middle' // 文本基准线,可取 top middle bottom,默认为middle }, } return ( <Chart data={data} height={height} padding={[8, 60, 20, 150]} autoFit

<Interval position={${keyName}*${keyVal}} label={keyVal} /> ); } export default BaseStrip;