微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

在c3js中为多个类别图表配置数据输入

如何解决在c3js中为多个类别图表配置数据输入

我正在按照下面的图设计折线图/柱形图。

分类的第一级是按月-年分组的,下一级是名称

我不知道如何配置图表的输入数据并设置X轴刻度值的格式。

enter image description here

我已经尝试过几次了,但是还是没用。

using Java.Util.Locale locale = new Java.Util.Locale(cultureInfo.TwoLetterISOLanguageName);
Java.Util.Locale.SetDefault(Java.Util.Locale.Category.Format,locale);
var config = Resources.Configuration;
config.SetLocale(locale);
BaseContext.CreateConfigurationContext(config);

解决方法

不幸的是,c3自然不会执行分层轴。您所希望的最好的办法是通过尝试的滴答声格式模仿它们。不过,您的示例似乎最适合作为类别类型而不是时间序列。即使有虚拟数据点,我也看不到如何在单个刻度线下方和之间获取数据。

//let x = ['x','2020-07-01','2020-08-01','2020-09-01','2020-09-01'];
var data1 = ['p1',100,200,300,450,400,500]; // 100: p1-Peter,200: p1-Mary.......
var data2 = ['p2',390,760,800];
var ResponsibleEmployees = ["Peter","Mary"]

        var chart = c3.generate({

            size: {
                width: 700
            },data: {
                //x: 'x',columns: [
                    //x,data1,data2],type: "bar"
            },axis: {
                x: {
                    type: 'category',categories: ['2020-07-01','2020-09-01'],tick: {
                        culling: false,format: function (d) {
                            var i = d % 2;
                            var val = ((i === 0) ? this.api.categories()[Math.floor(d)] + " " : "...") + ResponsibleEmployees[i];
                            return val;
                        }

                    }
                }
            }
        });

https://jsfiddle.net/7rs186fw/

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。