Question

我试图为CanvasJS背景添加透明度。 CanvasJS使用backgroundColor来选择画布背景的颜色。

我试着写＃34;无＆＃34;而不是颜色代码，但它给了我一个黑色的背景。

此外，能够为背景选择不同的不透明度也是很好的。

Answer 1

要设置透明背景，您可以设置backgroundColor：“transparent”。如果你想为任何颜色提供透明度，你可以使用rgba颜色编码，例如：backgroundColor：“rgba（225,150,150,0.5）”。

Answer 2

您可以设置background-color: transparent;，但不会显示颜色。

可以使用rgba设置不透明度。对于白色50％，它将是background-color: rgba(255, 255, 255, .5);

我从来没有使用过CanvasJs并且不知道该脚本会如何影响事物，但在基本的CSS中，这些都可以解决问题。

Answer 3

<br/><!-- Just so that JSFiddle's Result label doesn't overlap the Chart -->
<div id="chartContainer" style="height: 300px; width: 100%;"></div>

完整演示http://jsfiddle.net/canvasjs/7b0xdcwv/

Answer 4

我最终找到了答案。您可以将backgroundColor与空字符串（backgroundColor：''）一起使用，它将省略背景颜色并使其保持透明。

我仍然想知道是否可以为颜色添加透明度，所以如果有人知道，请发表评论。

Answer 5

根据Canvasjs document你可以设置背景颜色，使用rgba（0,0,0,0）来透明（当然你可以改变内部值来修复你的目的）：

window.onload = function () {
    var chart = new CanvasJS.Chart("chartContainer",
    {
      title:{
        text: "Title with Background Color",
        padding: 5,
        backgroundColor: rgba(0, 0, 0, 0),
      },
      data: [
      {
        type: "column",
        dataPoints: [
        { x: 10, y: 71 },
        ]
      }
      ]
    });

    chart.render();
  }

希望这有帮助：）

CanvasJS透明背景

5 个答案: