Bizcharts 踩坑之旅

1. X 轴文字过长，发生重叠

//chartList是数据  当横坐标大于15个值得时候，关闭自动旋转，自定义设置旋转角度12度
<Axis name="text" label = {{
    rotate:  chartList.length > 15 ? 12 : 0,   
    autoRotate: chartList.length > 15 ? false : true,
    offset: 30,  //X轴文字距离X轴得距离  让文字离开表中 或者用下面的字段，文本对齐方向从头部对齐
    textStyle: chartList.length > 15 ? {
        textAlign: 'start '
    } : {} ,
}}/>

2.隐藏Gemo、Axis

// 方案一
<Geom opacity={0} />
<Axis visible={false} />
// 方案二
<Chart padding={0} />

3.坐标轴参考线设置

<Axis name="population"              
  grid={{
     // align: 'center',
     lineStyle: {
     stroke: 'red', // 网格线的颜色
     lineWidth: 1, // 网格线的宽度复制代码
    }
   }} 
 />

4.指定坐标轴刻度点的个数

<Chart 
 scale={{
   tickCount: number, // 坐标轴上刻度点的个数，不同的度量类型对应不同的默认值
   // tickInterval: number, // 用于指定坐标轴各个标度点的间距，是原始数据之间的间距差值，tickCount 和 tickInterval 不可以同时声明
 }}
>
  ...
</Chart>

5.解决 Bizcharts高度多出几个px的问题

<Chart 
  className="xxx" //设置图表最外层div的类名。 可通过用css设定外层容器的高度
  style={{xxx: yyy}} // 设置图表最外层div的样式
>
  ...
</Chart>