Canvas之画多个折线图

最新推荐文章于 2024-07-03 09:18:53 发布

luochuanAD

最新推荐文章于 2024-07-03 09:18:53 发布

阅读量2.4k

点赞数

分类专栏： HTML+CSS 文章标签： html5 html canvas ios

本文链接：https://blog.csdn.net/luochuanAD/article/details/73252117

版权

本文介绍如何利用HTML5的Canvas元素来绘制多个折线图，详细阐述了绘制过程，并提供了完整的代码示例。

摘要由CSDN通过智能技术生成

一说明:

使用html画多个折线图,效果图如下:

二,代码片段(完整的代码在文章的最后)

<canvas id="a_canvas" width="850" height="450" ></canvas>

<script>
			var a_canvas;
			var a_context;

			var b_canvas;
			var b_context;

			window.onload = function() {
				a_canvas = document.getElementById('a_canvas');
				if(a_canvas && a_canvas.getContext) {
					a_context = a_canvas.getContext('2d');
				}

				b_canvas = document.getElementById('b_canvas');
				if(b_canvas && b_canvas.getContext) {
					b_context = b_canvas.getContext('2d');