铭文一级:
Spring Boot整合Echarts动态获取HBase的数据
1) 动态的传递进去当天的时间
a) 在代码中写死
b) 让你查询昨天的、前天的咋办?
在页面中放一个时间插件(jQuery插件),默认只取当天的数据
2) 自动刷新展示图
每隔多久发送一个请求去刷新当前的数据供展示
统计慕课网当天实战课程从搜索引擎过来的点击量
数据已经在HBase中有的
自己通过Echarts整合Spring Boot方式自己来实现
铭文二级:
在Spring Boot项目pom.xml下引入<repositories>
<repositories> <repository> <id>cloudera</id> <url>https://repository.cloudera.com/artifactory/cloudera-repos</url> </repository> </repositories>
引入HBase的依赖:org.apache.hbase:hbase-client:1.2.0-cdh5.7.0
拷贝HBaseUtils进来过来改,添加方法:
/** * 根据表名和输入条件获取HBase的记录数 */ public Map<String, Long> query(String tableName, String condition) throws Exception { Map<String, Long> map = new HashMap<>(); HTable table = getTable(tableName); String cf = "info"; String qualifier = "click_count"; Scan scan = new Scan(); Filter filter = new PrefixFilter(Bytes.toBytes(condition)); scan.setFilter(filter); ResultScanner rs = table.getScanner(scan); for(Result result : rs) { String row = Bytes.toString(result.getRow()); long clickCount = Bytes.toLong(result.getValue(cf.getBytes(), qualifier.getBytes())); map.put(row, clickCount); } return map; }
重点:
先得到table,再根据查询条件condition过滤出rs,
然后遍历rs->直接获得row,根据cf、qualifier得到点击数clickCount
将row、clickCount添加put进map
过滤条件:
Scan scan = new Scan();
scan.setFilter(new PrefixFilter(Bytes.toBytes(condition)));
ResultScanner rs = getTable(tableName).getScanner(scan);
添加主函数进行测试:
public static void main(String[] args) throws Exception { Map<String, Long> map = HBaseUtils.getInstance().query("imooc_course_clickcount" , "20171022"); for(Map.Entry<String, Long> entry: map.entrySet()) { System.out.println(entry.getKey() + " : " + entry.getValue()); } }
重点:
Map.Entry<String, Long> entry: map.entrySet()
entry.getKey() + " : " + entry.getValue()
此处用到的是第三种:Map集合的四种遍历方式
返回的结果为:20171022_128 :1066 //只是获得课程id无法满足要求要求
为了匹配Echarts的name、value属性,所以需要组装一个domain:CourseClickCount
新建一个数据访问类:CourseClickCountDAO
新建query方法,返回值为List<CourseClickCount>
参考代码:
package com.imooc.dao; import com.imooc.domain.CourseClickCount; import com.imooc.utils.HBaseUtils; import org.springframework.stereotype.Component; import java.util.ArrayList; import java.util.List; import java.util.Map; /** * 实战课程访问数量数据访问层 */ @Component public class CourseClickCountDAO { /** * 根据天查询 */ public List<CourseClickCount> query(String day) throws Exception { List<CourseClickCount> list = new ArrayList<>(); // 去HBase表中根据day获取实战课程对应的访问量 Map<String, Long> map = HBaseUtils.getInstance().query("imooc_course_clickcount","20171022"); for(Map.Entry<String, Long> entry: map.entrySet()) { CourseClickCount model = new CourseClickCount(); model.setName(entry.getKey()); model.setValue(entry.getValue()); list.add(model); } return list; } public static void main(String[] args) throws Exception{ CourseClickCountDAO dao = new CourseClickCountDAO(); List<CourseClickCount> list = dao.query("20171022"); for(CourseClickCount model : list) { System.out.println(model.getName() + " : " + model.getValue()); } } }
但是,得到的还是课程Id,还没有具体的名称,所以还要加一层映射关系
建立Web层ImoocStatApp:
/** * web层 */ @RestController public class ImoocStatApp { private static Map<String, String> courses = new HashMap<>(); static { courses.put("112","Spark SQL慕课网日志分析"); courses.put("128","10小时入门大数据"); courses.put("145","深度学习之神经网络核心原理与算法"); courses.put("146","强大的Node.js在Web开发的应用"); courses.put("131","Vue+Django实战"); courses.put("130","Web前端性能优化"); } @Autowired CourseClickCountDAO courseClickCountDAO; // @RequestMapping(value = "/course_clickcount_dynamic", method = RequestMethod.GET) // public ModelAndView courseClickCount() throws Exception { // ModelAndView view = new ModelAndView("index"); // List<CourseClickCount> list = courseClickCountDAO.query("20171022"); // for(CourseClickCount model : list) { // model.setName(courses.get(model.getName().substring(9))); // } // JSONArray json = JSONArray.fromObject(list); // view.addObject("data_json", json); // return view; // } @RequestMapping(value = "/course_clickcount_dynamic", method = RequestMethod.POST) @ResponseBody public List<CourseClickCount> courseClickCount() throws Exception { List<CourseClickCount> list = courseClickCountDAO.query("20171022"); for(CourseClickCount model : list) { model.setName(courses.get(model.getName().substring(9))); } return list; } @RequestMapping(value = "/echarts", method = RequestMethod.GET) public ModelAndView echarts(){ return new ModelAndView("echarts"); } }
static{}内容应该配到数据库里面去,此处只是为了方便
另外需要添加注解
ImoocStatApp:@RestController
CourseClickCountDAO层:@Component
HelloBoot:@RestController
domain/CourseClickCount:@Component
自动装载:@Autowired
如果不是用ajax获取数据则:ModelAndView courseClickCount()
若是则升级成:List<CourseClickCount> courseClickCount()
注意:json格式需要添加依赖
net.sf.json-lib:json-lib:2.4:jdk1.5(classifier)