$(function () { var data = { "echatX": [ "2019-07-02", "2019-07-03", "2019-07-04", "2019-07-05", "2019-07-06", "2019-07-07", "2019-07-08", "2019-07-09", "2019-07-10", "2019-07-11", "2019-07-12", "2019-07-13", "2019-07-14", "2019-07-15" ], "echatY": [ 501,210,123,333,445,157,151,369,101,101,350,435,153,100 ], "echatY2": [ 80,40,13,36,57,77,41,39,61,31,60,73,33,50 ], "echatY3": [ 5091,2210,1233,3133,4415,1517,1511,3619,1101,1011,3510,4315,1513,1100 ], "echatY4": [ 501,210,123,333,445,157,151,369,101,101,350,435,153,100 ], "peopleTotal":15,"peopleOnline":4,"peopleOutline":12,"ranges":[] }; dFun(data.echatX, data.echatY, data.echatY2,data.echatY3,data.echatY4); }); var myChart; // 基于准备好的dom,初始化echarts实例 var dChart = echarts.init(document.getElementById('main3')); // 指定图表的配置项和数据 function dFun(dateList, totalNumberList, totalSalesList) { dChart.setOption({ // title: { // left: 'left', // text: '概率', // show: false // }, tooltip: { trigger: 'axis', // formatter: '{a}:{c}', axisPointer: { type: 'shadow', crossStyle: { color: '#999' } } }, grid: { show: false, left: '3%', right: '4%', bottom: '10%' }, // legend: { // show: true, // selectedMode: 'single', // 设置显示单一图例的图形,点击可切换 // bottom: 10, // left: 50, // textStyle: { // color: '#666', // fontSize: 12 // }, // itemGap: 20, // inactiveColor: '#ccc' // }, xAxis: { // splitLine: {     show: false   }, type: 'category', data: dateList, axisPointer: { type: 'shadow' }, // 改变x轴颜色 axisLine: { lineStyle: { color: '#00a2e2', width: 1, // 这里是为了突出显示加上的 } }, axisTick: { show: true, interval: 0 }, }, // 设置两个y轴,左边显示数量,右边显示概率 yAxis: [{ splitLine: {     show: false   }, type: 'value', name: '销售量', // max: 10000, // min: 0, // show: true, // interval: 1000, // 改变y轴颜色 axisLine: { lineStyle: { color: '#00a2e2', width: 1, // 这里是为了突出显示加上的 } }, }, // 右边显示概率 { splitLine: {     show: false   }, type: 'value', name: '销售额', // min: 0, // max: 100, // interval: 10, // 改变y轴颜色 axisLine: { lineStyle: { color: '#00a2e2', width: 1, // 这里是为了突出显示加上的 } } }], // 每个设备分数量、概率2个指标,只要让他们的name一致,即可通过,legeng进行统一的切换 series: [{ name: 'Units Sold', type: 'bar', symbol: 'circle', // 折线点设置为实心点 symbolSize: 4, // 折线点的大小 data: totalNumberList, barWidth: '20%', },{ //折线 name: 'Sales', type: 'line', symbol: 'circle', // 折线点设置为实心点 symbolSize: 6, // 折线点的大小 yAxisIndex: 1, // 这里要设置哪个y轴,默认是最左边的是0,然后1,2顺序来。 data: totalSalesList, symbolSize: 10, itemStyle: { normal: { color: "#DDA0DD" } } }, ] }); } function queryWeekly(){ var startWeek = document.getElementById("startWeek").value; var endWeek = document.getElementById("endWeek").value; var param = { startWeek:startWeek, endWeek:endWeek }; console.log(param); // 折线图 $.ajax({ url: "../monthly/customersQueryByWeek", data: param, contentType:"application/x-www-form-urlencoded", type: 'POST', success: function(data) { dFun(data.dateList, data.totalNumberList, data.totalSalesList); }, }); } function exportWeekly(){ var startWeek = document.getElementById("startWeek").value; var endWeek = document.getElementById("endWeek").value; var params = { startWeek:startWeek, endWeek:endWeek }; console.log(params); exportFile('#rrapp', '../monthly/weeklySalesSummaryExport', params); }