javascript - 如何将背景图片破解到 Google 图表工具的动态 (JavaScript/SVG) 图表中？

我正在更新一个旧的数据可视化模块，它使用了 Google Image Chart API .现在，我们切换到 new(er) Visualization API ，它使用 JavaScript 在浏览器中生成动态图表，在指定的 <div> 内容器。

我们需要用背景图片呈现图表(出于品牌目的)。然而，鉴于 the configuration options in API reference，我唯一能够完成的事情, 是改变背景颜色。

如果我将背景图片嵌入到 <div> 中图表被绘制进去，图表(显然)只是覆盖它。

是否有我完全不知道的 JavaScript 或 HTML5 解决方案来解决我的问题？

(我是 JavaScript 的新手，感谢您忍受实际上可能是微不足道的——或明显不可能的——问题!)

最佳答案

您可能想用另一个元素包裹图表的目标元素，并将父元素的背景更改为您想要的图像，同时移除子元素的背景。

例如，HTML

<div id='brand_div'>
    <div id='chart_div'></div>
</div>

和CSS

#brand_div{ 
    background: url(<SOME-URL>) no-repeat;
}

当然还有 JavaScript 中的图表选项

var options = {
    ...
    backgroundColor: 'none'
};

关于javascript - 如何将背景图片破解到 Google 图表工具的动态 (JavaScript/SVG) 图表中？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/8828076/