英文:
The data does not fit on the VictoryBar chart
问题
我使用Victory库创建了一个图表。我需要构建一个分组的VictoryBar，因此我使用VictoryGroup来实现。
但是我的数据量很大，数据不适合在图表上显示。我应该如何扩大图表，以使y轴数据不混在一起？
如果数据较少，数据会显示在图表上。
我尝试更改'offset'和'barWidth'参数，但没有帮助。
英文:
I make a graph using the Victory library. I need to build a grouped VictoryBar, so I use VictoryGroup to do that.
But I have a lot of data, and the data doesn't fit on the graph. How can I enlarge the graph so that the y-axis data doesn't get mixed up?
If there is less data, the data is placed on the graph
https://codesandbox.io/s/zen-edison-fb8dy4?file=/src/App.js
import "./styles.css";import plotData from "./data.json";import React from "react";import { VictoryBar, VictoryChart, VictoryGroup } from "victory";export default function App() {let arr1 = [];let arr2 = [];let arr1Sum = 0;let arr2Sum = 0;plotData.map((plotData, index) => {arr1Sum += plotData.ofac_share;arr2Sum += plotData.non_ofac_share;});plotData.map((plotData, index) => {arr1.push({y: (plotData.ofac_share / arr1Sum) * 100,x: plotData.validator});arr2.push({y: (plotData.non_ofac_share / arr2Sum) * 100,x: plotData.validator});});return (<VictoryChart><VictoryGroup offsetY={10} colorScale={["tomato", "orange"]}><VictoryBar horizontal barWidth={3} data={arr1} /><VictoryBar horizontal barWidth={3} data={arr2} /></VictoryGroup></VictoryChart>);}
I tried changing the 'offset' and 'barWidth' parameter, but it didn't help me
答案1
得分: 0
根据文档以及其他布局配置，VictoryChart 组件支持 height 属性：
<VictoryChart height={600}><VictoryGroupoffsetY={10}colorScale={['tomato', 'orange']}><VictoryBarhorizontalbarWidth={3}data={arr1}/><VictoryBarhorizontalbarWidth={3}data={arr2}/></VictoryGroup></VictoryChart>;
这是相关Victory文档部分的链接，但以下是该链接摘要的片段：
Victory组件在默认的灰度主题中定义了默认的宽度、高度和填充属性。
希望这能帮到你。
英文:
As per documentation, as well as other layout configurations, the VictoryChart component supports a height property:
<VictoryChart height={600}><VictoryGroupoffsetY={10}colorScale={['tomato', 'orange']}><VictoryBarhorizontalbarWidth={3}data={arr1}/><VictoryBarhorizontalbarWidth={3}data={arr2}/></VictoryGroup></VictoryChart>;
Here is the link to the relevant Victory documentation section, but here is a snippet from that link that summarises:
> Victory components have default width, height, and padding props defined in the default grayscale theme.
Hope this helps.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论