Question

我正在使用javascript，我想使用单选按钮将现有图表替换为不同的图表。我无法让图表彼此切换。你能帮助我吗。感谢

Answer 1

您需要清除画布并通过调用新图形的图形方法重绘它

function draw(color) {
  var c = document.getElementById("myCanvas");
  var ctx = c.getContext("2d");
  ctx.clearRect(0, 0, 500, 500);
  ctx.fillStyle = color.value;
  ctx.fillRect(20, 20, 150, 100);
};

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" onchange="draw(this);" name="g" value="red">Red
<br>
<input type="radio" onchange="draw(this);" name="g" value="blue">Blue


<p>Canvas:</p>
<canvas id="myCanvas" width="500" height="500" style="border:1px solid #d3d3d3;">
  Your browser does not support the HTML5 canvas tag.
</canvas>

如何替换javascript画布

1 个答案: