3. 创建Spring Boot项目
通过IntelliJ IDEA开发工具创建并配置Spring Boot项目，为数据可视化系统的实现奠定基础。
步骤一：创建项目
打开IntelliJ IDEA开发工具，使用Spring Initializr初始化Spring Boot项目，构建Spring Boot项目结构。
选择使用的JDK版本
步骤二：配置项目信息
在“Project Metadata”界面配置项目基本信息。
项目组织唯一标识符
项目唯一的标识符
JDK版本
步骤三：配置项目依赖关系
在“Dependencles”界面配置项目依赖关系。
选择使用Spring Boot的版本
添加Spring Web依赖
步骤四：配置项目名称和目录
配置项目名称
配置项目目录
步骤五：初始化项目
步骤六：初始化完成后的目录结构
Spring Boot项目默认会生成项目启动类
静态资源文件夹（static）
模板页面文件夹（templates）
项目全局配置文件（application.properties）
Spring Boot项目默认会生成项目测试类
步骤七：调整项目目录结构
为了便于区分项目中不同类的功能，这里对项目默认的目录结构进行调整，在包“cn.itcast.sparkweb”下创建用于存放实体类的包entity、存放数据访问接口的包dao和存放控制器类的包controller。
步骤八：配置项目依赖
本项目所需要的依赖包括Thymeleaf、Tomcat、Phoenix、MyBatis和Joda-Time。其中Thymeleaf是一个模板引擎用于Java Web应用程序开发；Tomcat是Web容器用于运行Java Web应用程序；Phoenix用于在项目中通过Java API操作Phoenix；MyBatis用于在项目中使用MyBatis框架；Joda-Time是Java日期时间处理库。
步骤八：配置项目全局配置文件
在项目的resources目录配置全局配置文件application.properties，添加如下配置内容:
#设置连接Phoenix的JDBC驱动器
spring.datasource.driver-class-name=org.apache.phoenix.jdbc.PhoenixDriver
#设置Phoenix连接地址及端口号 spring.datasource.url=jdbc:phoenix:192.168.121.132,192.168.121.133,192.168.121.134:2181 #设置Thymeleaf模板路径
spring.thymeleaf.prefix=classpath:/templates/
# 设置Thymeleaf模板后缀名
spring.thymeleaf.suffix=.html
4. 实现热门品类Top10数据可视化
4.1 创建实体类Top10Entity
为了便于热门品类Top10分析结果数据的传递，在项目的entity包中创建实体类Top10Entity，存储Phoenix中表top10的数据。
public class Top10Entity {
private String cartcount;
private String category_id;
private String purchasecount;
private String viewcount;
//实现属性的getter/setter方法
...
}
4.2 创建数据库访问接口Top10Dao
在项目的dao包中创建一个数据库访问接口Top10Dao，读取Phoenix中表top10的数据。
import cn.itcast.sparkweb.entity.Top10Entity;
import org.apache.ibatis.annotations.Mapper;
import org.apache.ibatis.annotations.Select;
import java.util.List;
@Mapper
public interface Top10Dao {
@Select("select \"cartcount\",\"category_id\",\"purchasecount\",\"viewcount\" from \"top10\"")
List getTop10();
}
4.3 创建控制器类Top10Controller
在项目的controller包中创建控制器类Top10Controller，用于实现接口Top10Dao中的方法getTop10()读取表top10的数据，通过Model对象向HTML传递数据。
@Controller public class Top10Controller {
@Autowired
private Top10Dao top10Dao;
@RequestMapping(value = "/top10",produces = "text/html;charset=utf-8")
public String top10(Model model) {
List top10 = top10Dao.getTop10(); model.addAttribute("top10",top10);
return "top10";
}
}
若在Top10Controller中的接口上添加Autowired注解时，程序报错，报错的内容为“Could not autowire. No beans of ‘ Top10Dao’ type found.”，这是IntelliJ IDEA内置的检查工具导致，并不影响程序的启动和编译，可以参照如图所示内容消除此问题。
4.4 创建HTML文件top10.html
在项目中的templates目录下创建HTML文件top10.html，在该文件中通过jQuery获取Model对象传递到HTML的热门品类Top10的数据，并将获取到的数据填充到ECharts柱状图模板中，实现热门品类Top10数据的可视化展示。
top10
……
4.5 运行项目实现热门品类Top10数据可视化
为了避免JDBC无法操作Phoenix的问题，在运行项目前需要在项目的resources目录下创建Hbase-site.xml文件，在文件中添加开启命名空间和支持二级索引配置。
phoenix.schema.isNamespaceMappingEnabled
true
开启命名空间
hbase.regionserver.wal.codec
org.apache.hadoop.hbase.regionserver.wal.IndexedWALEditCodec
支持二级索引
单击IntelliJ IDEA中的【启动】按钮运行项目。
在IntelliJ IDEA控制台可查看项目的启动信息。
在浏览器中输入“http://localhost:8080/top10”查看热门品类Top10数据可视化的展示效果。
首先，通过解压缩的方式在Windows操作系统中安装Hadoop；然后，将Hadoop添加到系统环境变量中，如图所示。
在Windows操作系统的C:\Windows\System32\drivers\etchost目录下编辑映射文件host，添加如下内容。
192.168.121.132 spark01
192.168.121.133 spark02
192.168.121.134 spark03
