echarts webgl
- 作者: 为什么忘不了那个她
- 来源: 51数据库
- 2020-09-28
你把echarts.min.js
echarts-gl.min.js
这两个js文件从echarts官网下载下来，在同一个文件夹内新建一个HTML文件，把下面的代码复制进去。OK！
<!DOCTYPE html>
<html>
<head>
<title>echarts</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<style type="text/css">
html, body {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
#main {
height: 100%;
}
</style>
<script src="./echarts.min.js"></script>
<script src="./echarts-gl.min.js"></script>
</head>
<body>
<div id="main"></div>
<script type="text/javascript">
var chart = echarts.init(document.getElementById('main'));
chart.setOption({
grid3D: {},
xAxis3D: {},
yAxis3D: {},
zAxis3D: {},
series: [{
type: 'scatter3D',
symbolSize: 50,
data: [[-1, -1, -1], [0, 0, 0], [1, 1, 1]],
itemStyle: {
opacity: 1
}
}]
})
</script>
</body>
</html>
先去网上下载些基本的东西，像echarts啊zrender啊这些，之前的经验都有讲过，大家可以去看下。这里还要外加点就是去网上找下省的绝对经纬度或者是市的绝对经纬度，我用的是市，数据来自网络。
2
echarts官网上有热力图的demo，写的不是很多，大家可以去看下。
3
主要是为了了解一下，传入热力图的数据是哪种，经过调试我发现，传入的是绝对的经纬度，经纬度密集的话就能显示出暖色调了，需要调试才晓得，我也是low的不行。
4
下面就可以直接导入自己的数据了。后台怎么写就不说了。我们讲前端的显示。如果传入的参数经纬度都一样的话就显示不出来了，我后台的数据比较粗糙，只统计了某个区多少个人，共用一个绝对经纬度，所以加了math.radom随机生成。
5
当然，生成的数量是根据地区总人数来的，这样就能实际的显示你要的结果啦
6
你看，这样就在地图上显示出了热力图啦
echarts-gl.min.js
这两个js文件从echarts官网下载下来，在同一个文件夹内新建一个HTML文件，把下面的代码复制进去。OK！
<!DOCTYPE html>
<html>
<head>
<title>echarts</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<style type="text/css">
html, body {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
#main {
height: 100%;
}
</style>
<script src="./echarts.min.js"></script>
<script src="./echarts-gl.min.js"></script>
</head>
<body>
<div id="main"></div>
<script type="text/javascript">
var chart = echarts.init(document.getElementById('main'));
chart.setOption({
grid3D: {},
xAxis3D: {},
yAxis3D: {},
zAxis3D: {},
series: [{
type: 'scatter3D',
symbolSize: 50,
data: [[-1, -1, -1], [0, 0, 0], [1, 1, 1]],
itemStyle: {
opacity: 1
}
}]
})
</script>
</body>
</html>
先去网上下载些基本的东西，像echarts啊zrender啊这些，之前的经验都有讲过，大家可以去看下。这里还要外加点就是去网上找下省的绝对经纬度或者是市的绝对经纬度，我用的是市，数据来自网络。
2
echarts官网上有热力图的demo，写的不是很多，大家可以去看下。
3
主要是为了了解一下，传入热力图的数据是哪种，经过调试我发现，传入的是绝对的经纬度，经纬度密集的话就能显示出暖色调了，需要调试才晓得，我也是low的不行。
4
下面就可以直接导入自己的数据了。后台怎么写就不说了。我们讲前端的显示。如果传入的参数经纬度都一样的话就显示不出来了，我后台的数据比较粗糙，只统计了某个区多少个人，共用一个绝对经纬度，所以加了math.radom随机生成。
5
当然，生成的数量是根据地区总人数来的，这样就能实际的显示你要的结果啦
6
你看，这样就在地图上显示出了热力图啦
推荐阅读
