{layout name="manager/layout" /} <div class="layui-row layui-col-space12"> <div class="layui-col-xs12 layui-col-md12"> <div style="background-color:#ffffff;min-height:600px;"> <div class="layuimini-container location-index-page"> <div class="layuimini-main"> <fieldset class="table-search-fieldset"> <legend>搜索信息</legend> <div style="margin: 10px 10px 10px 10px"> <form class="layui-form layui-form-pane" method="post" action="#"> <div class="layui-form-item"> <div class="layui-inline"> 时间段: <div class="layui-inline"> <input type="text" class="layui-input" value="{$startTime}" id="start_time"> </div> - <div class="layui-inline"> <input class="layui-input" type="text" value="{$endTime}" id="end_time"> </div> </div> <div class="layui-inline"> <label class="layui-form-label">平台商</label> <div class="layui-input-block"> <select name="agencyCode"> <option value=""></option> {foreach $agency as $avalue} <option value="{$avalue['business_code']}" {if $agencyCode == $avalue['business_code']}selected{/if} >{$avalue['nickname']}</option> {/foreach} </select> </div> </div> <div class="layui-inline layui-hide" > <label class="layui-form-label">类型</label> <div class="layui-input-block"> <select name="agency"> <option value="release" selected>发布数量</option> <option value="sign">签到数量</option> <option value="receive">领取数量</option> </select> </div> </div> <div class="layui-inline"> <button type="submit" class="layui-btn"><i class="layui-icon"></i> 搜 索</button> </div> </div> </form> </div> </fieldset> <div class="layui-row layui-col-space15"> <div class="layui-col-xs12 layui-col-md12"> <div id="echarts-dataset" style="background-color:#ffffff;min-height:300px;padding: 10px"></div> </div> <div class="layui-col-xs12 layui-col-md12"> <div id="echarts-map" style="background-color:#ffffff;min-height:300px;padding: 10px"></div> </div> </div> </div> </div> </div> </div> </div> <script> layui.use(['echarts', 'jquery', 'form', 'laydate'], function () { var laydate = layui.laydate, $ = layui.jquery, echarts = layui.echarts ; //日期时间选择器 laydate.render({ elem: '#start_time' ,type: 'date' }); laydate.render({ elem: '#end_time' ,type: 'date' }); /** * 中国地图 */ var echartsMap = echarts.init(document.getElementById('echarts-map'), 'walden'); //console.log( JSON.parse('{$x|raw}')); var x = JSON.parse('{$x|raw}');//X轴 var release = JSON.parse('{$releaseDataArray|raw}');//发布 var signDataArray = JSON.parse('{$signDataArray|raw}');//发布 var receiveDataArray = JSON.parse('{$receiveDataArray|raw}');//发布 // console.log( JSON.parse('{$releaseDataArray|raw}')); // console.log( JSON.parse('{$signDataArray|raw}')); var optionMap = { legend: {}, tooltip: { trigger: 'axis', showContent: false }, dataset: { source: [ x,//X轴 // ['product', '2012', '2013', '2014', '2015', '2016', '2017'], release,//发布数量 signDataArray,//签到数量 receiveDataArray,//领取数量 //折线图 // ['Matcha Latte', 41.1, 30.4, 65.1, 53.3, 83.8, 98.7], // ['Milk Tea', 86.5, 92.1, 85.7, 83.1, 73.4, 55.1], // ['Cheese Cocoa', 24.1, 67.2, 79.5, 86.4, 65.2, 82.5], // ['Walnut Brownie', 55.2, 67.1, 69.2, 72.4, 53.9, 39.1] ] }, xAxis: {type: 'category'}, yAxis: {gridIndex: 0}, grid: {top: '55%'}, series: [ {type: 'line', smooth: true, seriesLayoutBy: 'row'}, {type: 'line', smooth: true, seriesLayoutBy: 'row'}, {type: 'line', smooth: true, seriesLayoutBy: 'row'}, { type: 'pie', id: 'pie', radius: '30%', center: ['50%', '25%'], label: { formatter: '{b}: {@2012} ({d}%)' }, encode: { itemName: 'x', value: '2012', tooltip: '2012' } } ] }; echartsMap.setOption(optionMap); // echarts 窗口缩放自适应 window.onresize = function () { echartsMap.resize(); } }) </script>