今天的内容：
尝试用Echarts实现地图的绘制。
代码示例：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>地图</title> <script src="./js/Echarts/echarts.min.js"></script> <script src="./js/jquery.min.js"></script> </head> <body> <div style=" 1000px; height: 400px; "></div> <script> var mCharts = echarts.init(document.querySelector('div')); $.get('./JSON/map/china.json', function (ret) { // ret中国的各个省份的矢量地图的数据 console.log(ret); echarts.registerMap('chinaMap', ret); var option = { geo: { type: 'map', map: 'chinaMap', //和registerMap中的第一个参数保持一致 roam: true,//允许缩放和拖动效果 label:{ show:true,//显示文本 }, zoom:3,//初始化缩放比例 center:[87.61773,43.792818],//设置地图中心点的坐标 }, } mCharts.setOption(option); }) </script> </body> </html>
运行实例：
遇到的问题：
直接执行html文件没能显示出来地图，原因是没有能够成功加载json文件。
解决方法：
使用Tomcat部署html，将js、Json文件放置相应的路径。
明天的打算：
学习Maven相关的内容。