93 lines
2.3 KiB
HTML
93 lines
2.3 KiB
HTML
|
{layout name="manager/layout" /}
|
|||
|
|
<style type="text/css">
|
|||
|
|
#container {
|
|||
|
|
height: 100vh;
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
<script src="/static/js/jquery-3.3.1.js"></script>
|
|||
|
|
<script charset="utf-8" src="https://map.qq.com/api/js?v=2.exp&libraries=visualization&key=OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77"></script>
|
|||
|
|
<script>
|
|||
|
|
var page = 1;
|
|||
|
|
var data = {
|
|||
|
|
max: 100,
|
|||
|
|
min: 0,
|
|||
|
|
data: []
|
|||
|
|
};
|
|||
|
|
window.onload = function() {
|
|||
|
|
// 创建地图
|
|||
|
|
var map = new qq.maps.Map(document.getElementById("container"), {
|
|||
|
|
center: new qq.maps.LatLng(30.572952, 104.066172),
|
|||
|
|
zoom: 8
|
|||
|
|
});
|
|||
|
|
// 创建热力图对象
|
|||
|
|
var heat = new qq.maps.visualization.Heat({
|
|||
|
|
map: map, // 必填参数，指定显示热力图的地图对象
|
|||
|
|
radius: 20, // 辐射半径，默认为20
|
|||
|
|
});
|
|||
|
|
function getHeatData(cnt, max, min) {
|
|||
|
|
let data = [];
|
|||
|
|
// let center = {
|
|||
|
|
// lat: 30.572952,
|
|||
|
|
// lng: 104.066172
|
|||
|
|
// };
|
|||
|
|
// cnt = cnt || 100;
|
|||
|
|
// max = max || 100;
|
|||
|
|
// min = min || 0;
|
|||
|
|
// for (let index = 0; index < 100; index++) {
|
|||
|
|
// let r = Math.random()*10;
|
|||
|
|
// let angle = Math.random() * Math.PI * 2;
|
|||
|
|
// // 点颜色变化
|
|||
|
|
// let heatValue = Math.random() * (max - min) + min;
|
|||
|
|
// // data.push({
|
|||
|
|
// // lat: 30.65805,
|
|||
|
|
// // lng: 104.136153,
|
|||
|
|
// // value: 100
|
|||
|
|
// // });
|
|||
|
|
// data.push({
|
|||
|
|
// lat: center.lat + r * Math.sin(angle),
|
|||
|
|
// lng: center.lng + r * Math.cos(angle),
|
|||
|
|
// value: 100
|
|||
|
|
// });
|
|||
|
|
// }
|
|||
|
|
return {
|
|||
|
|
max: max,
|
|||
|
|
min: min,
|
|||
|
|
data: data
|
|||
|
|
};
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function getRegister(){
|
|||
|
|
$.ajax('/manager/statistical/receive', {
|
|||
|
|
data: {
|
|||
|
|
"page": page,
|
|||
|
|
}
|
|||
|
|
,dataType : 'json'
|
|||
|
|
,type: 'POST'
|
|||
|
|
}).done(function (res) {
|
|||
|
|
if(res.code ==0 ){
|
|||
|
|
if(res.data.list.length==0){
|
|||
|
|
layer.msg("加载完毕")
|
|||
|
|
}else{
|
|||
|
|
page ++;
|
|||
|
|
data.data = data.data.concat(res.data.list);
|
|||
|
|
// console.log(res.data.list)
|
|||
|
|
console.log(data)
|
|||
|
|
heat.setData(data);
|
|||
|
|
setTimeout(getRegister(),100)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
getRegister();
|
|||
|
|
// 获取热力数据
|
|||
|
|
// var data = getHeatData();
|
|||
|
|
|
|||
|
|
// 向热力图传入数据
|
|||
|
|
// heat.setData(data);
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
<div id="container" style="position: relative; background-color: rgb(229, 227, 223); overflow: hidden; transform: translateZ(0px);"></div>
|
|||
|
|
|