Google折线图（交互式）API - 我们如何在指定区域填充不同的背景颜色 [英] Google line chart(interactive) api - how we fill different background colors on specified areas

问题描述

我有要求在指定区域的谷歌折线图上水平填充背景颜色。我看过所有的API，但没有得到解决方案。谷歌图片图表（我认为它已被弃用）有一些财产，但我正在使用交互式图表。我只是附上一张我真正想要的图片。

I have a requirement to fill background color horizontally in google line chart on specified area. I have looked all the api but didn't get a solution. Google image chart(I thinks it is deprecated) has some property but I am using interactive chart. I am just attaching an image that I actually want.

请帮忙。

Please help.

推荐答案

您可以使用ComboChart而不是LineChart并添加一些额外的数据系列。在你的例子中，你会有3个额外的系列，每行有800,1000和1200的值。然后，您设置系列选项，以使这些区域系列不会出现在图例中，并且当您将鼠标悬停在图标上时不会生成工具提示：

You can do this by using a ComboChart instead of a LineChart, and adding in some extra data series. In your example, you would have 3 extra series with values of 800, 1000, and 1200 in every row. Then you set the "series" option to make these "area" series that don't show up in the legend and don't spawn tooltips when you hover over them:

series: {
    0: {
        type: 'line'
    },
    1: {
        type: 'line'
    },
    2: {
        lineWidth: 0,
        type: 'area',
        visibleInLegend: false,
        enableInteractivity: false
    },
    3: {
        lineWidth: 0,
        type: 'area',
        visibleInLegend: false,
        enableInteractivity: false
    },
    4: {
        lineWidth: 0,
        type: 'area',
        visibleInLegend: false,
        enableInteractivity: false
    }
}

请参阅此处的示例： http://jsfiddle.net/asgallant/apH2B/

这篇关于Google折线图（交互式）API - 我们如何在指定区域填充不同的背景颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！