charts - 使用 Google 图表创建具有不同数据的单个条形图

Question

我可以使用谷歌图表创建这些类型的图表，我也可以将目标设置在顶部。

这些图表是条形的。我没有找到任何可以制作这样的条形图的东西，或者这是一种完全不同的图表类型。

编辑

我在Google Chart Tools - How to createStacked bar chart找到了解决方案。这些是堆积条形图。但我仍然没有找到如何将目标放在顶部

Answer 1

使用 ComboChart，并将series.<series index>.type选项设置'bars'为“待定”、“损失”和“赢得”系列。为“目标”系列设置series.<series index>.typeto'steppedArea'和series.<series index>.opacityto 。0将connectSteps选项设置为false。这是一种方法，假设您的数据按“赢”、“输”、“待定”、“目标”的顺序排列：

var chart = new google.visualization.ComboChart(document.querySelector('#chart_div'));
chart.draw(data, {
    height: 400,
    width: 600,
    isStacked: true,
    connectSteps: false,
    series: {
        0: {
            // Won
            type: 'bars'
        },
        1: {
            // Loss
            type: 'bars'
        },
        2: {
            // Pending
            type: 'bars'
        },
        3: {
            // Target
            type: 'steppedArea',
            areaOpacity: 0
        }
    }
});