在堆积条形图中定义了 x 轴的 Bizcharts

编程问答 2022-11-24

问题描述

我正在尝试使用 BizCharts 制作此屏幕截图。在这种情况下，x-Labels 将始终是固定的，数据将相应地显示。如果任何一天没有数据，图表中就不会出现当天的条形。

enter image description here

这是我的数据的样子：

     data=[
            {
                "date": "Tuesday","name": "Battery Materials","totalWeight": 150
            },{
                "date": "Tuesday","name": "Consumer Batteries","totalWeight": 1423
            },{
                "date": "Wednesday","name": "High Voltage","totalWeight": 75.5
            },{
                "date": "Friday","name": "Consumer Battery","totalWeight": 1338
            }
         ]

我试过了，但它不显示星期一、星期四和星期六。

    <Chart height={400} padding="auto" data={data} autoFit>
        <Interval
            adjust={[
                {
                    type: 'stack',},]}
            color="name"
            position="date*totalWeight"
        />
        <Tooltip shared />
    </Chart>

如何将 x 轴定义为数组 ['Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'] 并相应地显示数据？

https://bizcharts.net/product/BizCharts4/demo/312

我也尝试使用 totalWeight=0 添加默认 JSON 对象，但工具提示显示错误计数。

const data = [
         {
            "date": "Monday","totalWeight": 0
         },{
            "date": "Monday",{
            "date": "Tuesday",{
            "date": "Wednesday",{
            "date": "Thursday",{
            "date": "Friday",{
            "date": "Saturday",{
            "date": "Sunday","totalWeight": 1338
            }];

enter image description here

是否有其他框架可以在 React 中显示周或月条形图？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

bizchartsjavascriptreact-chartjsreactjsreactjsreactjsreactjs