|
@ -1,216 +1,216 @@
|
|
|
var indexName = {'index_128': '预约总量', 'index_129': '居民预约量', 'index_130': '代预约量'};
|
|
|
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 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 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';
|
|
|
}
|
|
|
}
|
|
|
|
|
|
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 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);
|
|
|
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 - 字段的名称
|
|
|
* 参数: list - 列表, key - 字段的名称
|
|
|
*/
|
|
|
function getKeyValueArr(list, key){
|
|
|
var arr = [];
|
|
|
for(var k in list){
|
|
|
arr.push(list[k][key]);
|
|
|
}
|
|
|
|
|
|
return arr;
|
|
|
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;
|
|
|
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
|
|
|
}
|
|
|
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
|
|
|
}
|
|
|
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)
|
|
|
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%']
|
|
|
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'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
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);
|
|
|
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)
|
|
|
}
|
|
|
|
|
|
/*
|
|
@ -219,104 +219,112 @@ function drawPie(elId, arry, color, legend, center, radius, title){
|
|
|
* 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%']
|
|
|
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'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
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;
|
|
|
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
|
|
|
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 //横轴信息全部显示
|
|
|
},
|
|
|
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
|
|
|
}
|
|
|
splitLine: {
|
|
|
show: false
|
|
|
}
|
|
|
}
|
|
|
],
|
|
|
yAxis: [
|
|
|
{
|
|
|
type: 'value',
|
|
|
splitLine: { show: false }
|
|
|
}
|
|
|
],
|
|
|
series: [
|
|
|
{
|
|
|
clickable: true,
|
|
|
name: name,
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top'
|
|
|
},
|
|
|
barWidth: 20,
|
|
|
type: 'bar',
|
|
|
data: yData
|
|
|
}]
|
|
|
};
|
|
|
|
|
|
// 使用刚指定的配置项和数据显示图表。
|
|
|
myChart.setOption(option);
|
|
|
return myChart;
|
|
|
color: color
|
|
|
}
|
|
|
},
|
|
|
barWidth: 20,
|
|
|
type: 'bar',
|
|
|
data: yData
|
|
|
}
|
|
|
]
|
|
|
}
|
|
|
|
|
|
// 使用刚指定的配置项和数据显示图表。
|
|
|
myChart.setOption(option)
|
|
|
return myChart
|
|
|
}
|
|
|
/**
|
|
|
* 绘制折线图数据处理
|
|
@ -324,324 +332,353 @@ function drawBarChart(el, xData, yData, color, name){
|
|
|
* @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;
|
|
|
}
|
|
|
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])
|
|
|
}
|
|
|
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)
|
|
|
|
|
|
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
|
|
|
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])
|
|
|
}
|
|
|
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})
|
|
|
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);
|
|
|
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
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
options.series = series;
|
|
|
$("#"+arg.elId).removeAttr('_echarts_instance_')
|
|
|
barCharts.setOption(options);
|
|
|
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);
|
|
|
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
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
options = newline(options, 4, 'yAxis')
|
|
|
options.series = series;
|
|
|
$("#"+arg.elId).removeAttr('_echarts_instance_')
|
|
|
barCharts.setOption(options);
|
|
|
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
|
|
|
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;
|
|
|
}
|
|
|
}
|
|
|
return option
|
|
|
}
|
|
|
|
|
|
function getSecondClassifyList(val) {
|
|
|
switch (val) {
|
|
|
case '':
|
|
|
return [
|
|
|
{ label: '全部', value: '' },
|
|
|
{ label: '健康竞走', value: '健康竞走' },
|
|
|
{ label: '健康问答', value: '健康问答' },
|
|
|
{ label: '健康咨询', value: '健康咨询' }
|
|
|
]
|
|
|
case '健康运动类':
|
|
|
return [
|
|
|
{ label: '全部', value: '' },
|
|
|
{ label: '健康竞走', value: '健康竞走' }
|
|
|
]
|
|
|
case '健康教育类':
|
|
|
return [
|
|
|
{ label: '全部', value: '' },
|
|
|
{ label: '健康问答', value: '健康问答' }
|
|
|
]
|
|
|
case '促进业务类':
|
|
|
return [
|
|
|
{ label: '全部', value: '' },
|
|
|
{ label: '健康咨询', value: '健康咨询' }
|
|
|
]
|
|
|
}
|
|
|
}
|