123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647 |
- var indexName = {'index_128': '预约总量', 'index_129': '居民预约量', 'index_130': '代预约量'};
- function getSignDate(){ //获取初始化签约年
- var nowdate = new Date();
- var year = nowdate.getFullYear();
- var month = nowdate.getMonth() + 1;
- if(year>=2023){
- year = year
- }else if(month<=6){
- year = year - 1
- }
- return year
- }
- function getStartDate(chooseYear){
- // 按年度来计算的时候,开始时间是该年度7月1号还是到下一个年的6月30号结束
- // 2022年及以前开始时间07-01
- // 2023及以后开始时间01-01
-
- if(chooseYear == 2016){
- return chooseYear + "-08-01";
- }else if(chooseYear <= 2022) {
- return chooseYear+'-07-01';
- }else if(chooseYear >= 2023){
- return chooseYear+'-01-01';
- }
- }
- //获取结束时间
- function getEndDate(chooseYear){
-
- var nowdate = new Date();
- var year = nowdate.getFullYear();
- var month = nowdate.getMonth() + 1;
- var day = nowdate.getDate();
- var endDate = ''
- if(chooseYear < '2022') {
- endDate = new Date((parseInt(chooseYear)+1) + '-06-30');
- }else{
- endDate = new Date((parseInt(chooseYear)) + '-12-31');
- }
- var now = new Date();
-
- if(now <= endDate){
- return now.format("yyyy-MM-dd");
- }else{
- if(chooseYear < '2022') {
- return (parseInt(chooseYear)+1) + '-06-30';
- }else{
- return (parseInt(chooseYear)) + '-12-31';
- }
- }
-
- }
- //获取结束时间29
- function getEndDate29(chooseYear){
- chooseYear = parseInt(chooseYear);
- var endDate = new Date((chooseYear+1) + '-06-29'),
- now = new Date();
- if(now <= endDate){
- return now.format("yyyy-MM-dd");
- }else{
- return (chooseYear+1) + '-06-29';
- }
- }
- /**
- * 获取多少天前的日期
- */
- function getDateBefore(days) {
- var now = new Date();
- var date = new Date(now.getTime() - days * 24 * 3600 * 1000);
- var year = date.getFullYear();
- var month = date.getMonth() + 1;
- var day = date.getDate();
- var hour = date.getHours();
- var minute = date.getMinutes();
- var second = date.getSeconds();
- return year + '-' + (month < 10 ? '0' + month : month) + '-' + (day < 10 ? '0' + day : day);
- }
- /*
- * 获取用来排序的字段值,返回数组
- * 参数: list - 列表, key - 字段的名称
- */
- function getKeyValueArr(list, key){
- var arr = [];
- for(var k in list){
- arr.push(list[k][key]);
- }
-
- return arr;
- }
- /*
- * 排名
- */
- function soreRank(arr){
- var temp = [];
- var lis = [];
- for(var i=0;i<arr.length;i++){
- lis.push(arr[i]);
- }
- lis = _.uniq(lis);
- for(var i=0;i<arr.length;i++){
- temp[i] = lis.indexOf(arr[i])+1;
- }
-
- return temp;
- }
- /*
- * 绘制饼图数据处理 // elId, arry, title, hasNum,colors,radius,noLedend,param
- */
- function handlePieData(arg){
- var legend = {
- orient: 'vertical',
- right: arg.legendRight||'15%',
- y:'center',
- };
- var colorList=[]
- legendNames = [];
- var arr1 = _.map(arg.arry, function(o,i){
- var count = 0
- if(arg.param){
- count = parseFloat(o[arg.param])
- }else{
- count = parseFloat(o.amount)
- }
- var obj = {
- name: o[arg.nameparam]||o.name,
- count: count
- };
- legendNames.push(obj);
- if(o.code){
- colorList.push(arg.colors[o.code])
- }else{
- colorList.push(arg.colors[i])
- }
- return {
- value: count,
- name: o[arg.nameparam]||o.name
- }
- });
- legend.formatter = function(name){
- if(arg.hasNum){
- var target;
- for (var i = 0, l = legendNames.length; i < l; i++) {
- if (legendNames[i].name == name) {
- target = parseInt(legendNames[i].count);
- }
- }
- return name+": "+target
- }else{
- return name
- }
- }
- if(arg.noLedend){ //true时无注释
- drawPie(arg.elId, arr1, colorList, null, arg.position||['50%', '51%'], arg.radius||['70%', '90%'], arg.title)
- }else{
- drawPie(arg.elId, arr1, colorList, legend, arg.position||['30%', '51%'], arg.radius||['70%', '90%'], arg.title)
- }
- }
- /*
- * 绘制饼图
- */
- function drawPie(elId, arry, color, legend, center, radius, title){
- var pieChart = echarts.init(document.getElementById(elId));
- var options = {
- tooltip: {
- trigger: 'item',
- formatter: "{b} : {c} ({d}%)",
- // position: ['50%', '50%']
- },
- color: color,
- series: [
- {
- type:'pie',
- radius: ['80%', '99%'],
- startAngle: 270,
- legendHoverLink: false,
- hoverAnimation: false,
- avoidLabelOverlap: false,
- label: {
- normal: {
- show: false,
- textStyle: {
- color: "#000",
- }
- }
- },
- labelLine: {
- normal: {
- show: false
- }
- },
- data:arry,
- }]
- };
- if(legend){
- options.legend = legend;
- }
- if(center){
- options.series[0].center = center;
- }
- if(radius){
- options.series[0].radius = radius;
- }
- if(title){
- options.title = title
- }
- pieChart.clear();
- pieChart.setOption(options);
- }
- /*
- * 绘制饼图
- * arry [{name: '', value: ''}]
- * color ['#ffc800', '#17b3ec']
- * silent 图形是否不响应和触发鼠标事件,默认为 false,即响应和触发鼠标事件
- */
- function drawPieChart(elId, arry, color, silent){
- var myChart = echarts.init(document.getElementById(elId));
- var option = {
- tooltip: {
- trigger: 'item',
- formatter: "{b} : {c} ({d}%)",
- position: ['50%', '50%']
- },
- color: color,
- series: [
- {
- type:'pie',
- radius: ['80%', '99%'],
- startAngle: 270,
- legendHoverLink: false,
- hoverAnimation: false,
- avoidLabelOverlap: false,
- silent: silent,
- label: {
- normal: {
- show: false,
- textStyle: {
- color: "#000"
- }
- }
- },
- labelLine: {
- normal: {
- show: false
- }
- },
- data:arry
- }]
- };
- $("#"+elId).removeAttr("_echarts_instance_");
- myChart.setOption(option);
- return myChart;
- }
- /**
- * 绘制柱状图
- */
- function drawBarChart(el, xData, yData, color, name){
- var myChart = echarts.init(document.getElementById(el));
-
- // 指定图表的配置项和数据
- var option = {
- tooltip: {
- trigger: 'item'
- },
- toolbox: {
- dataZoom: true,
- show: true,
- orient: 'vertical',
- x: 'right',
- y: 'center'
- },
- grid: {
- left: '20px',
- right: '20px',
- bottom: '20px',
- top: '20px',
- containLabel: true
- },
- xAxis: [{
- type: 'category',
- data: xData,
- axisLabel: {
- interval:0,//横轴信息全部显示
- },
- splitLine: {
- show: false
- }
- }],
- yAxis: [{
- type: 'value',
- splitLine: {show:false}
- }],
- series: [{
- clickable: true,
- name: name,
- itemStyle : {
- normal: {
- label : {
- show: true, position: 'top'
- },
- color: color
- }
- },
- barWidth: 20,
- type: 'bar',
- data: yData
- }]
- };
-
- // 使用刚指定的配置项和数据显示图表。
- myChart.setOption(option);
- return myChart;
- }
- /**
- * 绘制折线图数据处理
- * @param {Object} elId div的id值
- * @param {Object} data 数据值
- * @param {Object} selectedDateType true的时候x轴值年-月-日 1-日,2-周, 3-月
- */
- function getChartData(elId, data, selectedDateType,hasLegend,title,unit){
- var dataZoom_end,
- xDatas = [],
- yDatas = [],
- names = [],
- colors = ['#12b7f5', '#cd67fd','#FF9526'];
- for(var p in data){
- if(hasLegend){
- names.push(indexName[p]);
- }
- var xData = _.map(data[p], function(o){
- return o.range;
- });
- var yData = _.map(data[p], function(o){
- return o.amount;
- });
- xDatas.push(xData);
- yDatas.push(yData);
- var lastIndex = yData.length % 10;
- if(yData.length >10 ){
- dataZoom_end = 100-(9/yData.length)*100;
- }else{
- dataZoom_end = 0;
- }
- }
- setTimeout(function(){
- EventBus.$emit("draw-line-chart", {
- panelName : title,
- quotaNames : names,
- xData : xDatas[0],
- yDatas : yDatas,
- colors : colors,
- selectedDateType: selectedDateType,
- nowlineid : elId,
- unit:unit
- });
- },10)
-
- }
- /**
- * 绘制柱状图数据处理
- * @param {Object} elId div的id值
- * @param {Object} data 数据值
- */
- function getBarData(arg){
- var dataZoom_end,
- xDatas = [],
- yDatas = [],
- names = [],
- colors = ['#12b7f5', '#cd67fd','#FF9526'];
- if(arg.colors){
- colors = arg.colors
- }
- for(var p in arg.data){
- if(arg.hasLegend){
- names.push(arg.indexNames[p]);
- }
- var xData = _.map(arg.data[p].data||arg.data[p], function(o){
- return o[arg.rangeParams]||o.range;
- });
- var yData = _.map(arg.data[p].data||arg.data[p], function(o){
- return o[arg.amountParams]||o.amount;
- });
- xDatas.push(xData);
- yDatas.push(yData);
- var lastIndex = yData.length % 10;
- if(yData.length >10 ){
- dataZoom_end = 100-(9/yData.length)*100;
- }else{
- dataZoom_end = 0;
- }
- }
- if(arg.typeV){
- drawBarV({elId:arg.elId, name:names, dataZoom_end:dataZoom_end,
- xData:xDatas[0], yDatas:yDatas, colors:colors,barCategoryGap:arg.barCategoryGap,argInit:arg})
- }else{
- drawBarH({elId:arg.elId, name:names, dataZoom_end:dataZoom_end,
- xData:xDatas[0], yDatas:yDatas, colors:colors,barCategoryGap:arg.barCategoryGap,argInit:arg})
- }
- }
- function drawBarH(arg){
- var barCharts = echarts.init(document.getElementById(arg.elId));
- var options = {
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 坐标轴指示器,坐标轴触发有效
- type: 'shadow' // 默认为直线,可选为:'line' | 'shadow'
- },
- textStyle:{
- align:'left'
- },
- formatter:function(datas){
- var res = datas[0].name + '<br/>'
- for (var i = 0, length = datas.length; i < length; i++) {
- var unit = ""
- if(arg.argInit.units){
- unit = arg.argInit.units[datas[i].seriesName]
- }
- res += datas[i].seriesName + ':'
- + datas[i].value + unit +'<br/>'
- }
- return res
- }
- },
- calculable: false,
- grid: {
- borderWidth: 0,
- top:'20px',
- left: '20px',
- right: '20px',
- bottom: '20px',
- containLabel: true
- },
- xAxis: [{
- type: 'category',
- axisLine: {
- lineStyle: {
- type: 'solid',
- color: '#333333', //左边线的颜色
- width: '1' //坐标线的宽度
- }
- },
- axisTick: {
- show: false
- },
- splitArea: {
- show: false
- },
- splitLine: {
- show: false
- },
- data: arg.xData
- }],
- yAxis: [{
- type: 'value',
- axisTick: {
- show: false
- },
- splitArea: {
- show: false
- },
- splitLine: {
- show: false
- },
- axisLine: {
- lineStyle: {
- type: 'solid',
- color: '#333333', //左边线的颜色
- width: '1' //坐标线的宽度
- }
- },
- }],
- }
- var series = [];
- for(var i=0; i<arg.yDatas.length; i++){
- var obj = {
- name: arg.name[i],
- data: arg.yDatas[i],
- type: 'bar',
- barGap: 0,
- barWidth: 30, //柱图宽度
- itemStyle:{
- normal:{
- barBorderRadius: [50, 50, 0, 0],
- color: arg.colors[i],
- label: {
- show: true,
- position: 'top',
- textStyle: {
- color: "#333333",
- fontSize: 12
- }
- }
- }
- },
- };
- series.push(obj);
- }
- options.series = series;
- $("#"+arg.elId).removeAttr('_echarts_instance_')
- barCharts.setOption(options);
- }
- function drawBarV(arg){
- var barCharts = echarts.init(document.getElementById(arg.elId));
- var options = {
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 坐标轴指示器,坐标轴触发有效
- type: 'shadow' // 默认为直线,可选为:'line' | 'shadow'
- },
- textStyle:{
- align:'left'
- },
- formatter:function(datas){
- var res = datas[0].name + '<br/>'
- for (var i = 0, length = datas.length; i < length; i++) {
- var unit = ""
- if(arg.argInit.units){
- unit = arg.argInit.units[datas[i].seriesName]
- }
- res += datas[i].seriesName + ':'
- + datas[i].value + unit +'<br/>'
- }
- return res
- }
- },
- calculable: false,
- grid: {
- borderWidth: 0,
- top:'5%',
- left: '3%',
- right: '10%',
- bottom: '5%',
- containLabel: true
- },
- yAxis: [{
- type: 'category',
- axisLine: {
- lineStyle: {
- type: 'solid',
- color: '#333333', //左边线的颜色
- width: '1' //坐标线的宽度
- }
- },
- axisTick: {
- show: false
- },
- splitArea: {
- show: false
- },
- splitLine: {
- show: false
- },
- data: arg.xData
- }],
- xAxis: [{
- type: 'value',
- axisTick: {
- show: false
- },
- splitArea: {
- show: false
- },
- splitLine: {
- show: false
- },
- axisLine: {
- lineStyle: {
- type: 'solid',
- color: '#333333', //左边线的颜色
- width: '1' //坐标线的宽度
- }
- },
- }],
- }
- var series = [];
- for(var i=0; i<arg.yDatas.length; i++){
- var obj = {
- name: arg.name[i],
- data: arg.yDatas[i],
- type: 'bar',
- barGap: 0,
- barWidth: 12, //柱图宽度
- itemStyle:{
- normal:{
- barBorderRadius: [0, 50, 50, 0],
- color: arg.colors[i],
- label: {
- show: true,
- position: 'right',
- textStyle: {
- color: "#333333",
- fontSize: 12
- }
- }
- }
- },
- };
- series.push(obj);
- }
- options = newline(options, 4, 'yAxis')
- options.series = series;
- $("#"+arg.elId).removeAttr('_echarts_instance_')
- barCharts.setOption(options);
- }
- function newline(option, number, axis){
- /* 此处注意你的json是数组还是对象 */
- option[axis][0]['axisLabel']={
- interval: 0,
- formatter: function(params){
- var newParamsName = "";
- var paramsNameNumber = params.length;
- var provideNumber = number;
- var rowNumber = Math.ceil(paramsNameNumber / provideNumber);
- if (paramsNameNumber > provideNumber) {
- for (var p = 0; p < rowNumber; p++) {
- var tempStr = "";
- var start = p * provideNumber;
- var end = start + provideNumber;
- if (p == rowNumber - 1) {
- tempStr = params.substring(start, paramsNameNumber);
- } else {
- tempStr = params.substring(start, end) + "\n";
- }
- newParamsName += tempStr;
- }
- } else {
- newParamsName = params;
- }
- return newParamsName
- }
- }
- return option;
- }
|