怎样在 html 网页中显示MySQL数据表，然后在网页中能将时间、温度等数据调用成曲线或者直接形成表格？_随笔

你好，如果要把mysql数据库里的数据写入网页，你需要有一个后台服务器，然后用php读取mysql的数据，再显示到网页上去，表格很简单，html 的 table 就可以搞定，曲线图就要用到javascript 插件了。

图表的背景一般是精心设计的它有一定的梯度、网格线、号码标签和月份名称等等，如果直接通过JavaScript进行绘制可能需数十行或上百行的代码。但是如果我们直接通过Canvas直接创建一个背景图。我们只需要在其他的软件如PS上绘制好一个背景图，然后加载到Canvas上就可以了。

<!DOCTYPE html>

<html>

<head>

</head>

<body>

<p>你的浏览器不支持canvas元素</p>

</canvas>

</div>

// 1、要绘制图表首先我们要获取到canvas对象以及具有图表背景的图片对象。

var

canvas = document.getElementById('canvas'),

context = null

context = canvas.getContext('2d')

var img = new Image()

img.src ='chart-background.png'//这里是一张具有图表背景的图片

// 2、绘制一个具有图表背景的图片后再根据要绘制的曲线图各个点在canvas是中的坐标绘制直线。

img.onload = function() {

//绘制图片

context.drawImage(img, 0, 0)

//绘制直线

context.beginPath()

context.moveTo(70, 105)

context.lineTo(105, 132)

context.lineTo(142, 250)

context.lineTo(176, 175)

context.lineTo(212, 145)

context.lineTo(245, 197)

context.lineTo(280, 90)

context.stroke()

}

</script>

</body>

</html>

3、本示例的最终绘制效果如下：这样一个曲线图表就绘制出来的，其他的图表也可以用类似的方法进行绘制。

这些都是有关于HTML5新特性的一些应用。给你推荐一个教程网站秒秒学，该网站上有关于HTML5新特性的讲解。

欢迎分享，转载请注明来源：内存溢出

怎样在 html 网页中显示MySQL数据表，然后在网页中能将时间、温度等数据调用成曲线或者直接形成表格？