From 48bef1c8e51a2d8ac9c10197e1b5f2a1457d8692 Mon Sep 17 00:00:00 2001 From: 935090232@qq.com <ak473600000> Date: Wed, 02 Dec 2020 23:31:22 +0800 Subject: [PATCH] 人次统计 --- zq-erp/src/main/resources/templates/views/admin/hive-erp/analysis/customerFlow.html | 96 ++++++++++++++++++++++++----------------------- 1 files changed, 49 insertions(+), 47 deletions(-) diff --git a/zq-erp/src/main/resources/templates/views/admin/hive-erp/analysis/customerFlow.html b/zq-erp/src/main/resources/templates/views/admin/hive-erp/analysis/customerFlow.html index 623c959..ccf9076 100644 --- a/zq-erp/src/main/resources/templates/views/admin/hive-erp/analysis/customerFlow.html +++ b/zq-erp/src/main/resources/templates/views/admin/hive-erp/analysis/customerFlow.html @@ -12,7 +12,12 @@ <script type="text/javascript" th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script> <script type="text/javascript" th:src="@{/js/systools/MBase.js}"></script> + <style> + .echarts { + height: 400px + } + </style> </head> <body class=" container-fluid"> @@ -55,30 +60,17 @@ <div class="row chartsBox " style="margin-top: 40px"> <div class=" col-md-12"> + <div class="echarts" id="echarts-line-chart1"></div> + </div> + </div> + + + <div class="row chartsBox " style="margin-top: 40px"> + <div class=" col-md-12"> <div class="echarts" id="echarts-line-chart2"></div> </div> </div> - <!-- <div class="row chartsBox " style="margin-top: 40px"> - <div class=" col-md-12" id="table"> - <table class="table table-striped" > - <thead> - <tr> - <th>时间</th> - <th v-for="name in legend" >{{name}}</th> - </tr> - </thead> - <tbody> - <tr v-for="(item,index) in xAxis"> - <td>{{item}}</td> - - <td v-for="data in series[index].data" >{{data}}</td> - </tr> - </tbody> - </table> - </div> - </div> ---> </div> <script type="text/javascript" th:src="@{/js/systools/MJsBase.js}"></script> @@ -88,7 +80,7 @@ <script type="text/javascript" th:src="@{/plugin/StringUtil.js}"></script> <script type="text/javascript" th:src="@{/plugin/moment.min.js}"></script> <script type="text/javascript" th:src="@{/js/systools/ChartsUtils.js}"></script> -<script type="text/javascript" th:src="@{/js/plugin/vue.js}"></script> + <script> @@ -98,11 +90,14 @@ // 基于准备好的dom,初始化echarts实例 + var myChart1 = echarts.init(document.getElementById('echarts-line-chart1'), 'macarons'); var myChart2 = echarts.init(document.getElementById('echarts-line-chart2'), 'macarons'); - myChart2.on('click', function (params) { + /* + 点击事件 + myChart1.on('click', function (params) { console.log(params); }); - +*/ // 指定图表的配置项和数据 function getption(title) { return { @@ -138,12 +133,6 @@ yAxis: { type: 'value' }, - series: [{ - name: '人头数', - type: 'line', - smooth: true, - data: [1,2] - }], dataZoom: [ { id: 'dataZoomX', @@ -153,8 +142,8 @@ } ], animation: true, - animationDuration: 1000, - animationDurationUpdate: 1000, + animationDuration: 500, + animationDurationUpdate: 500, animationEasing: 'linear', animationEasingUpdate: 'linear', } @@ -166,7 +155,7 @@ //加载数据 function loadData() { //加载门店客流对比 - myChart2.showLoading(); + myChart1.showLoading(); $.AjaxProxy({ p: MForm.toJson("#serchform"), c: false, @@ -181,28 +170,41 @@ option.xAxis.data = map.xAxis; console.log(option); // 使用刚指定的配置项和数据显示图表。 + myChart1.setOption(option); + myChart1.hideLoading(); + + }); + } + + var chartsUtils1 = new ChartsUtils(loadData); + chartsUtils1.setDataPackTimeValue(); + chartsUtils1.loadChartData(); + + //加载数据2 + function loadData2() { + //加载门店客流对比 + myChart2.showLoading(); + $.AjaxProxy({ + p: MForm.toJson("#serchform"), + c: false, + }).invoke(basePath+"/admin/analysis/customerEnterCountCompare", + function (loj) { + var map = loj.getValue("mapInfo"); + var option = getption("门店人次对比"); + option.series = map.series; + option.legend.data = map.legendData; + option.xAxis.data = map.xAxis; + // 使用刚指定的配置项和数据显示图表。 myChart2.setOption(option); myChart2.hideLoading(); }); } - var ChartsUtils = new ChartsUtils(loadData); - ChartsUtils.setDataPackTimeValue(); - ChartsUtils.loadChartData(); + var chartsUtils2 = new ChartsUtils(loadData2); + chartsUtils2.setDataPackTimeValue(); + chartsUtils2.loadChartData(); - - function buildTable(map){ - console.log(buildTable,map); - var app = new Vue({ - el: '#table', - data: { - series : map.series, - legend : map.legendData, - xAxis : map.xAxis - } - } ); - } -- Gitblit v1.9.1