fixed:echartsResize

js/console.js

@@ -1,8 +1,6 @@
 "use strict";
-var useModel = ["okUtils", "table", "laytpl", "laydate", "element", "countUp", "echartsData", "okMock"];
+var useModel = ["okUtils", "table", "laytpl", "laydate", "element", "countUp", "okMock"];
-layui.config({
+layui.use(useModel, function () {
-    base: "../js/"
-}).use(useModel, function () {
     var countUp = layui.countUp;
     var table = layui.table;
     var okUtils = layui.okUtils;
@@ -74,9 +72,9 @@ layui.config({
      * 用户访问
      */
     function userSource() {
-        var mapTree = echarts.init($("#mapOne")[0], "mytheme");
+        var userSourceMap = echarts.init($("#userSourceMap")[0], "mytheme");
-        okUtils.echartsResize(userSourceOption);
+        userSourceMap.setOption(userSourceOption);
-        mapTree.setOption(userSourceOption);
+        okUtils.echartsResize(userSourceMap);
     }
 
     /**
@@ -106,29 +104,58 @@ layui.config({
                 return {
                     "code": res.code,
                     "count": res.data.count,
-                    "data": res.data.list //解析数据列表
+                    "data": res.data.list
                 }
             }
         });
     }
 
+    var userLocationOption = {
+        "title": {"text": "用户家庭所在地统计", "subtext": "", "x": "center"},
+        "tooltip": {"trigger": "item"},
+        "visualMap": {
+            "color": ["#eeeeee"], "show": false, "x": "left", "y": "center",
+            "splitList": [
+                {"start": 500, "end": 600},
+                {"start": 400, "end": 500},
+                {"start": 300, "end": 400},
+                {"start": 200, "end": 300},
+                {"start": 100, "end": 200},
+                {"start": 0, "end": 100}
+            ]
+        },
+        "series": [
+            {
+                "name": "用户家庭所在地统计", "roam": true, "type": "map", "mapType": "china", "data": [],
+                "itemStyle": {
+                    "normal": {"areaColor": "#eeeeee", "borderColor": "#aaaaaa", "borderWidth": 0.5},
+                    "emphasis": {"areaColor": "rgba(63,177,227,0.25)", "borderColor": "#3fb1e3", "borderWidth": 1}
+                },
+                "label": {
+                    "normal": {"textStyle": {"color": "#000"}},
+                    "emphasis": {
+                        "textStyle": {"color": "#000"}
+                    }
+                }
+            }
+        ]
+    };
+
+    /**
+     * 用户位置
+     */
+    function userLocation() {
+        var userLocationMap = echarts.init($("#userLocationMap")[0]);
+        var data = [{"name":"北京","value":100},{"name":"天津","value":83},{"name":"上海","value":113},{"name":"重庆","value":188},{"name":"河北","value":197},{"name":"河南","value":327},{"name":"云南","value":371},{"name":"辽宁","value":224},{"name":"黑龙江","value":295},{"name":"湖南","value":463},{"name":"安徽","value":7},{"name":"山东","value":176},{"name":"新疆","value":0},{"name":"江苏","value":396},{"name":"浙江","value":472},{"name":"江西","value":243},{"name":"湖北","value":226},{"name":"广西","value":404},{"name":"甘肃","value":210},{"name":"山西","value":451},{"name":"内蒙古","value":97},{"name":"陕西","value":369},{"name":"吉林","value":221},{"name":"福建","value":216},{"name":"贵州","value":221},{"name":"广东","value":85},{"name":"青海","value":21},{"name":"西藏","value":414},{"name":"四川","value":380},{"name":"宁夏","value":205},{"name":"海南","value":73},{"name":"台湾","value":348},{"name":"香港","value":54},{"name":"澳门","value":340}];
+        userLocationOption.series.data = data;
+        userLocationMap.setOption(userLocationOption);
+        okUtils.echartsResize(userLocationMap);
+    }
+
     statText();
     userSource();
     userList();
-
+    userLocation();
-    /**静态数据**/
-    var echartsData = layui.echartsData;
-    init();
-
-    function init() {
-        // var mapTree = echarts.init($("#mapOne")[0], "mytheme");
-        // okUtils.echartsResize([mapTree, mapChina]);
-        // mapTree.setOption(echartsData.mapTree);//数据图
-
-        var mapChina = echarts.init($('#mapChina')[0]);
-        echartsData.mapChina.series[0].data = echartsData.Address;//地图数据
-        mapChina.setOption(echartsData.mapChina);//地图
-    }
 });
 
 

lib/layui/lay/okmodules/okUtils.js

@@ -1,36 +1,33 @@
 "use strict";
-layui.define(["layer"], function(exprots) {
+layui.define(["layer"], function (exprots) {
-	var $ = layui.jquery;
+    var $ = layui.jquery;
-	var okUtils = {
+    var okUtils = {
         /**
          * 是否前后端分离
          */
-		isFrontendBackendSeparate: false,
+        isFrontendBackendSeparate: false,
         /**
          * 服务器地址
          */
         baseUrl: "http://localhost:8080",
-		/**
+        /**
-		 * 获取body的总宽度
+         * 获取body的总宽度
-		 */
+         */
-		getBodyWidth: function() {
+        getBodyWidth: function () {
-			return document.body.scrollWidth;
+            return document.body.scrollWidth;
-		},
+        },
-		/**
+        /**
-		 * 主要用于对echart视图自动适应宽度
+         * 主要用于对ECharts视图自动适应宽度
-		 */
+         */
-		echartsResize: function(elemnt) {
+        echartsResize: function (element) {
-			elemnt = elemnt || [];
+            window.addEventListener("resize", function () {
-			window.addEventListener("resize", function() {
+                var isResize = localStorage.getItem("isResize");
-				var isResize = localStorage.getItem("isResize");
+                if (isResize == "false") {
-				if (isResize != 'false') {
+                    element.resize();
-					for (var i = 0; i < elemnt.length; i++) {
+                }
-						elemnt[i].resize();
+            });
-					}
+        },
-				}
+        /**
-			});
-		},
-		/**
          * ajax()函数二次封装
          * @param url
          * @param type
@@ -99,6 +96,6 @@ layui.define(["layer"], function(exprots) {
                 });
             }
         }
-	};
+    };
-	exprots("okUtils", okUtils);
+    exprots("okUtils", okUtils);
 });

pages/console.html

@@ -79,7 +79,7 @@
     <div class="layui-col-md8">
         <div class="layui-card">
             <div class="yskj-card-body map-body">
-                <div style="height: 100%;" id="mapOne"></div>
+                <div style="height: 100%;" id="userSourceMap"></div>
             </div>
         </div>
     </div>
@@ -156,7 +156,7 @@
     <div class="layui-col-md6">
         <div class="layui-card">
             <div class="yskj-card-body clearfix">
-                <div class="map-china" id="mapChina"></div>
+                <div class="map-china" id="userLocationMap"></div>
             </div>
         </div>
     </div>