删除条形图 ZingChart 上的空间答案

【问题标题】：Remove space on bar ZingChart删除条形图 ZingChart 上的空间
【发布时间】：2020-07-01 09:35:20
【问题描述】：

我在这里制作图表，我在删除框之间的距离时遇到了一点问题

 var myConfig = {
            type: 'bar',
            legend: {
                layout: "x4",
                overflow : "page",
                shadow : false,
                align : "left",
                alpha :0.05,
                "adjust-layout": true,
                marker : {
                    type : "circle",
                    size : "7px",
                    "border-color" :"none"
                }
            },
            scaleX: {
                // convert text on scale indices
                labels: ['Automotive', 'Retail', 'Wholesale']
            },
            plot: {
                barWidth:"50%",
                animation: {
                    effect: 'ANIMATION_EXPAND_BOTTOM',
                    method: 'ANIMATION_STRONG_EASE_OUT',
                    sequence: 'ANIMATION_BY_NODE',
                    speed: 275,
                }
            },
            series: [
                {
                    // plot 1 values, linear data
                    values: [23, 20, 27],
                    text: 'Sum of target Premi',
                    backgroundColor: '#fa6383',
                    borderRadius: 5,
                },
                {
                    // plot 2 values, linear data
                    values: [35, 42, 33],
                    text: 'Sum of premi Leads',
                    backgroundColor: '#fb9f40',
                    borderRadius: 5,
                },
                {
                    // plot 2 values, linear data
                    values: [15, 22, 13],
                    text: 'Sum of premi Activity',
                    backgroundColor: '#fdcd55',
                    borderRadius: 5,
                },
                {
                    // plot 2 values, linear data
                    values: [15, 22, 13],
                    text: 'Sum of premi Booking',
                    backgroundColor: '#4bc0c1',
                    borderRadius: 5,
                }
            ]
        };

对于我这样的设置。有建议，所以可以没有空间？

我有尝试文档但不起作用。 https://www.zingchart.com/docs/chart-types/bar

【问题讨论】：

标签： javascript zingchart

【解决方案1】：

我不确定我是否正确理解了您的问题，但您可能可以尝试在“绘图”配置中使用“barsOverlap”来获得所需的结果。

 var myConfig = {
            type: 'bar',
            legend: {
                layout: "x4",
                overflow : "page",
                shadow : false,
                align : "left",
                alpha :0.05,
                "adjust-layout": true,
                marker : {
                    type : "circle",
                    size : "7px",
                    "border-color" :"none"
                }
            },
            scaleX: {
                // convert text on scale indices
                labels: ['Automotive', 'Retail', 'Wholesale']
            },
            plot: {
                barWidth:"50%",
                barsOverlap: '50%',
                animation: {
                    effect: 'ANIMATION_EXPAND_BOTTOM',
                    method: 'ANIMATION_STRONG_EASE_OUT',
                    sequence: 'ANIMATION_BY_NODE',
                    speed: 275,
                }
            },
            series: [
                {
                    // plot 1 values, linear data
                    values: [23, 20, 27],
                    text: 'Sum of target Premi',
                    backgroundColor: '#fa6383',
                    borderRadius: 5,
                },
                {
                    // plot 2 values, linear data
                    values: [35, 42, 33],
                    text: 'Sum of premi Leads',
                    backgroundColor: '#fb9f40',
                    borderRadius: 5,
                },
                {
                    // plot 2 values, linear data
                    values: [15, 22, 13],
                    text: 'Sum of premi Activity',
                    backgroundColor: '#fdcd55',
                    borderRadius: 5,
                },
                {
                    // plot 2 values, linear data
                    values: [15, 22, 13],
                    text: 'Sum of premi Booking',
                    backgroundColor: '#4bc0c1',
                    borderRadius: 5,
                }
            ]
        };

【讨论】：