Question

我需要帮助设置在canvg上使用Google Charts Calendar创建的画布对象的背景颜色。

下载的图像/ png具有透明背景，因为画布具有这种方式。我想改变它，使它不再透明但是白色。我尝试使用setAttribute，如下所示：

  canvas.setAttribute(
    'style',
    'position: absolute; ' +
    'top: ' + (-chartArea.offsetHeight * 2) + 'px; ' +
    'left: ' + (-chartArea.offsetWidth * 2) + 'px;' +
    'backgroud-color: #fff;');

并且也使用这种方式：canvas.style.backgroundColor = 'blue';但是这些尝试都失败了，我找不到一个好的工作答案。

非常感谢所有帮助。

Answer 1

尝试：

context = canvas.getContext("2d");

// set to draw behind current content
context.globalCompositeOperation = "destination-over";

// set background color
context.fillStyle = '#fff'; // <- background color

// draw background / rect on entire canvas
context.fillRect(0, 0, canvas.width, canvas.height);

来源：http://blogs.adobe.com/digitalmedia/2011/01/setting-the-background-color-when-generating-images-from-canvas-todataurl/

Answer 2

要清楚 - 你想要圆圈蓝色吗？

http://jsfiddle.net/6y3ym4ov/2/＆gt;第4行

<circle id="circle" fill="#202020" stroke="#0A0A0A" stroke-width="4"...

将fill =“＃202020”替换为无/不同的颜色

fill="#000099" / fill="blue" / fill="rgb(0,0,255)"

设置从Google图表创建的透明画布/ png的背景颜色

2 个答案: