我正在使用 react-vis 图来生成直方图数据。如果我们有 x 和 y 轴的单独条目,则该图可以正常工作。但是当我们有相同的 x 轴值和多个 y 轴值时,它会失败并且看起来会变形,反之亦然。
有没有办法处理这种数据?
我正在使用以下代码生成图表
<XYPlot
xType='ordinal'
colorType={this.props.color}
width={charWidth}
height={charHeight}
yDomain={charDomain}
style={{
fontSize:'14px',
fontWeight:'400',
textAlign:'left'
}}>
{/* <HorizontalGridLines /> */}
<XAxis hideLine = {false} style={{fontSize:'12px',fontWeight:'400'}} />
<YAxis hideLine = {false}/>
{/* <XAxis hideLine = {false} style={{fontSize:'12px',fontWeight:'400'}}/>
<YAxis />
<ChartLabel
text={this.props.xLabelTitle}
className="alt-y-label"
includeMargin={true}
xPercent={0.06}
yPercent={0.06}
style={{
transform: 'rotate(-90)',
textAnchor: 'end'
}}
/> */}
<VerticalBarSeries data={data} barWidth={this.props.barWidth} />
<LabelSeries
data={ data.map(obj =>{
return {...obj,label:obj.y.toString()}
})}
labelAnchorX="middle"
labelAnchorY="text-after-edge"
style={{fontSize:'13px',fontWeight:'700'}}
/>
</XYPlot>