项目目录
pom.xml
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>com.bigdata</groupId>
<artifactId>sid-web</artifactId>
<version>0.0.1-SNAPSHOT</version>
<packaging>jar</packaging>
<name>sid-web</name>
<description>Demo project for Spring Boot</description>
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.0.3.RELEASE</version>
<relativePath/> <!-- lookup parent from repository -->
</parent>
<properties>
<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
<project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
<java.version>1.8</java.version>
</properties>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
</dependency>
<!--
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
-->
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>jstl</artifactId>
<version>1.2</version>
</dependency>
<dependency>
<groupId>org.apache.tomcat.embed</groupId>
<artifactId>tomcat-embed-jasper</artifactId>
<!--<scope>provided</scope>-->
</dependency>
<dependency>
<groupId>org.apache.hbase</groupId>
<artifactId>hbase-client</artifactId>
<version>1.4.4</version>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-jdbc</artifactId>
</dependency>
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
</dependency>
<dependency>
<groupId>net.sf.json-lib</groupId>
<artifactId>json-lib</artifactId>
<version>2.4</version>
<classifier>jdk15</classifier>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
</plugin>
</plugins>
</build>
</project>
mapstat.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<html>
<head>
<meta charset="UTF-8">
<title>基于Storm的实时区域游客量热力图统计</title>
<style type="text/css">
*{
margin:0;
padding:0;
border:0;
}
select{
style:none;
background-color: transparent;
}
.sel-btn {
width:60px;
line-height:30px;
height:22px;
border:1px solid #ccc;
vertical-align:middle;
}
h1,h3{
text-align:center;
line-height: 50px;
}
h3 {
line-height: 30px;
}
#container {
position: absolute;
top: 80px;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
margin: 0 auto;
}
</style>
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=b1365b4141cebc6ab90e7d1ddd3f257f"></script>
</head>
<body>
<!-- <h1>整合高德地图完成实时热力图展示</h1> -->
<h1>基于Storm的实时区域游客量热力图统计</h1>
<h3 >刷新频率:
<select class="sel-btn">
<option>30秒</option>
<option>60秒</option>
<option>90秒</option>
</select>
</h3>
<div id="container" ></div>
<script type="text/javascript">
var map = new AMap.Map('container',{
zoom: 7,
resizeEnable: true,
center: [106.55,29.57]
});
map.setFeatures(['road','point'])//多个种类要素显示
map.plugin(["AMap.ToolBar"],function () {
map.addControl(new AMap.ToolBar()); // 工具条控件
});
// 坐标点
var points = ${data_json}
var heatmap;
map.plugin(["AMap.Heatmap"], function() {
//初始化heatmap对象
heatmap = new AMap.Heatmap(map, {
radius: 25, //给定半径
opacity: [0, 0.8]
/*,gradient:{
0.5: 'blue',
0.65: 'rgb(117,211,248)',
0.7: 'rgb(0, 255, 0)',
0.9: '#ffea00',
1.0: 'red'
}*/
});
//设置数据集:该数据为重庆景区数据
heatmap.setDataSet({
data: points,
max: 10
});
});
</script>
</body>
</html>
StatApp.java
package com.bigdata.controller;
import com.bigdata.domain.ResultBean;
import com.bigdata.service.ResultBeanService;
import net.sf.json.JSONArray;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.servlet.ModelAndView;
import java.util.List;
@RestController
public class StatApp {
@Autowired
ResultBeanService resultBeanService;
@RequestMapping(value = "/map_stat", method = RequestMethod.GET)
public ModelAndView map_stat() {
ModelAndView view = new ModelAndView("mapstat");
List<ResultBean> results = resultBeanService.query();
JSONArray jsonArray = JSONArray.fromObject(results);
System.out.println(jsonArray);
// 如何把我们从后台查询到的数据以json的方式返回给前台页面
view.addObject("data_json", jsonArray);
return view;
}
}
ResultBeanService.java
package com.bigdata.service;
import com.bigdata.domain.ResultBean;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.jdbc.core.JdbcTemplate;
import org.springframework.jdbc.core.RowMapper;
import org.springframework.stereotype.Service;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.List;
@Service
public class ResultBeanService {
@Autowired
JdbcTemplate jdbcTemplate;
public List<ResultBean> query(){
String sql = "select longitude,latitude ,count(1) as c from stat where time > unix_timestamp(date_sub(current_timestamp(), interval 60 minute))*1000 group by longitude,latitude";
return (List<ResultBean>) jdbcTemplate.query(sql, new RowMapper<ResultBean>() {
@Override
public ResultBean mapRow(ResultSet resultSet, int i) throws SQLException {
ResultBean bean = new ResultBean();
bean.setLng(resultSet.getDouble("longitude"));
bean.setLat(resultSet.getDouble("latitude"));
bean.setCount(resultSet.getLong("c"));
return bean;
}
});
}
}
ResultBean.java
package com.bigdata.domain;
public class ResultBean {
private double lng;
private double lat;
private long count;
public double getLng() {
return lng;
}
public void setLng(double lng) {
this.lng = lng;
}
public double getLat() {
return lat;
}
public void setLat(double lat) {
this.lat = lat;
}
public long getCount() {
return count;
}
public void setCount(long count) {
this.count = count;
}
}
application.yml
spring:
profiles:
active: dev
application-dev.yml
server:
port: 9998
servlet:
context-path: /map
spring:
mvc:
view:
prefix: /WEB-INF/jsp/
suffix: .jsp
datasource:
driver-class-name: com.mysql.jdbc.Driver
url: jdbc:mysql://localhost:3306/sid?useSSL=false
username: root
password: 密码
jpa:
hibernate:
ddl-auto: update
show-sql: true
thymeleaf:
cache: false
enabled: false
运行
访问 localhost:9998/map/map_stat