'use strict';
app.controller('charts1Ctrl', ["$scope", "$rootScope", "$state", "$timeout", "$interval", "$http", "$cookieStore", "Restangular", "api_hkreport", function($scope, $rootScope, $state, $timeout, $interval, $http, $cookieStore, Restangular, api_hkreport) {
// // 球
// var dom_ball = document.getElementById("container_ball");
// var myChart_ball = echarts.init(dom_ball);
// var app = {};
// var option_ball = null;
// option_ball = {
// globe: {
// baseTexture: "assets/images/daping/xingxing.png",
// shading: 'realistic',
// realisticMaterial: {
// roughness: 10
// },
// postEffect: {
// enable: true
// },
// light: {
// main: {
// intensity: 0.1,
// shadow: false
// },
// ambientCubemap: {
// }
// }
// }
// };;
// if (option_ball && typeof option_ball === "object") {
// myChart_ball.setOption(option_ball, true);
// }
// 事件处理近五年统计分析图
var dom_call = document.getElementById("incident_handle");
var myChart_incident_handle = echarts.init(dom_call);
myChart_incident_handle.showLoading({
text: '数据加载中...',
color: '#c23531',
textColor: '#fff',
maskColor: 'rgba(255,255,255,0)',
zlevel: 0
});
var app = {};
var option_incident_handle = null;
option_incident_handle = {
backgroundColor: "transparent",
tooltip: {},
grid: {
top: '8%',
left: '1%',
right: '1%',
bottom: '8%',
containLabel: true,
},
xAxis: [{
type: 'category',
boundaryGap: true,
axisLine: { //坐标轴轴线相关设置。数学上的x轴
show: true,
lineStyle: {
color: 'rgba(255,255,255,0.4)'
},
},
axisLabel: { //坐标轴刻度标签的相关设置
textStyle: {
color: 'rgba(255,255,255,1)',
margin: 15,
},
},
axisTick: {
show: false,
},
data: ['2015', '2016', '2017', '2018', '2019'],
}],
yAxis: [{
type: 'value',
min: 0,
splitNumber: 5,
splitLine: {
show: true,
lineStyle: {
color: 'rgba(255,255,255,0.6)'
}
},
axisLine: {
show: false,
},
axisLabel: {
margin: 20,
textStyle: {
color: 'rgba(255,255,255,1)',
},
},
axisTick: {
show: false,
},
}],
series: [{
name: '注册总量',
type: 'line',
showAllSymbol: true,
symbol: 'emptyCircle',
symbolSize: 6,
lineStyle: {
normal: {
color: "#228ed7", // 线条颜色
},
borderColor: '#f0f'
},
itemStyle: {
normal: {
color: "#228ed7",
}
},
tooltip: {
show: false
},
areaStyle: { //区域填充样式
normal: {
//线性渐变,前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’,则该四个值是绝对像素位置。
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0,
// color: 'rgba(0,154,120,1)'
color: 'rgba(34,142,215,0.5)'
},
{
offset: 1,
color: 'rgba(0,0,0, 0)'
}
], false),
// shadowColor: 'rgba(53,142,215, 0.9)', //阴影颜色
shadowColor: 'rgba(34,142,215, 0.5)', //阴影颜色
shadowBlur: 20 //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
}
},
data: [393, 438, 485, 631, 689]
},
{
name: '最新注册量',
type: 'bar',
barWidth: 20,
tooltip: {
show: false
},
itemStyle: {
normal: {
color: function(params) {
var colorList = ['#228ed7', '#118178', '#9735ab', '#f98f3b', '#ecc625', '#1cfffb', '#1dfff1'];
return colorList[params.dataIndex];
}
}
},
data: [393, 438, 485, 631, 689]
}
]
};;
// 工作组处理事件统计及占比
var dom_incident_group = document.getElementById("charts1_incident_group");
var myChart_incident_group = echarts.init(dom_incident_group);
myChart_incident_group.showLoading({
text: '数据加载中...',
color: '#c23531',
textColor: '#fff',
maskColor: 'rgba(255,255,255,0)',
zlevel: 0
});
var app = {};
var option_incident_group = null;
option_incident_group = {
title: {
subtext: '0',
text: "事件总数(件)",
itemGap: 3,
"x": '44%',
"y": '33%',
textAlign: "center",
"textStyle": {
"fontWeight": 'normal',
"fontSize": 16,
"color": '#18f0ff',
},
"subtextStyle": {
"fontWeight": 'normal',
"fontSize": 22,
"color": 'white',
"lineHeight": 44
},
},
grid: {
top: '8%',
left: '1%',
right: '1%',
bottom: '8%',
containLabel: true,
},
legend: {
orient: 'vertical',
x: 'left',
y: 'bottom',
left:"23%",
data:['工作组1','工作组2','工作组3','工作组4','工作组5','工作组6'],
textStyle: {
color: 'white',
borderColor: '#fff',
fontSize:13
},
formatter: function(param) {
console.log(param);
// for (var i = 0; i < $scope.incident_handler_group_data.length; i++) {
// if ($scope.incident_handler_group_data[i].name == param) {
// return ' ' + $scope.incident_handler_group_data[i].toname + ' ' + $scope.incident_handler_group_data[i].tovalue + ' ' + $scope.incident_handler_group_data[i].proportion + '%';
// }
// }
for (var i = 0; i < $scope.incident_handler_group_data.length; i++) {
if ($scope.incident_handler_group_data[i].name == param) {
return ' ' + $scope.incident_handler_group_data[i].toname;
}
}
},
itemWidth:15,
width:450,
height:100,
itemGap:20,
},
series: [
{
name:'访问来源',
type:'pie',
radius: ['40%', '50%'],
center: ['45%', '40%'],
avoidLabelOverlap: true,
label: {
align: 'left',
normal: {
show: true,
position: 'outside',
rich:"rich",
formatter:function(param){
// console.log(param)
return param.value+' '+param.percent+"%"
},
color:"rgba(255,255,255,0.6)"
},
// emphasis: {
// show: false,
// textStyle: {
// fontSize: '30',
// fontWeight: 'bold'
// }
// }
},
labelLine: {
normal: {
show: true
}
},
data:[
{value:335, name:'工作组1'},
{value:310, name:'工作组2'},
{value:234, name:'工作组3'},
{value:135, name:'工作组4'},
{value:1548, name:'工作组5'},
{value:154, name:'工作组6'}
]
}
],
color:["#228ed7","#d0402f","#f98f3b","#ecc625","#118178","#c053d5"]
};;
// 人员处理事件TOP10
// var people_myColor = ['#18f0ff', '#18f0ff', '#18f0ff', '#18f0ff', '#18f0ff', '#18f0ff', '#00ccff', '#ddf514', '#f5db14', '#ff333d'];
var people_myColor = ['rgba(34,142,215,1)', 'rgba(34,142,215,1)', 'rgba(34,142,215,1)', 'rgba(34,142,215,1)', 'rgba(34,142,215,1)', 'rgba(34,142,215,1)', 'rgba(34,142,215,1)','rgba(208,64,47,1)', 'rgba(249,143,59,1)', 'rgba(236,198,37,1)'];
var people_myColor2 = ['rgba(34,142,215,0)', 'rgba(34,142,215,0)', 'rgba(34,142,215,0)', 'rgba(34,142,215,0)', 'rgba(34,142,215,0)', 'rgba(34,142,215,0)', 'rgba(34,142,215,0)','rgba(208,64,47,0)', 'rgba(249,143,59,0)', 'rgba(236,198,37,0)'];
var dom_incident_people = document.getElementById("charts1_incident_people");
var myChart_incident_people = echarts.init(dom_incident_people);
myChart_incident_people.showLoading({
text: '数据加载中...',
color: '#c23531',
textColor: '#fff',
maskColor: 'rgba(255,255,255,0)',
zlevel: 0
});
var app = {};
var option_incident_people = null;
option_incident_people = {
grid: {
left: '11%',
top: '12%',
right: '0%',
bottom: '8%',
containLabel: true
},
xAxis: [{
show: false,
}],
yAxis: [{
axisTick: 'none',
axisLine: 'none',
show :true,
offset: '27',
axisLabel: {
textStyle: {
color: 'white',
fontSize: '14',
}
},
data: ['李丹', '林水', '东西', '德古拉', '古田', '杨云', '米勒', '莫妮卡', '土豆', '杨云']
},
],
series: [{
name: '条',
type: 'bar',
yAxisIndex: 0,
data: [4, 13, 25, 29, 38, 44, 50, 52, 60, 72],
label: {
normal: {
show: true,
position: 'left',
textStyle: {
color: '#18f0ff',
fontSize: '16',
}
}
},
barWidth: 12,
barMaxWidth:10,
itemStyle: {
normal: {
// color: function(params) {
// var num = people_myColor.length;
// return people_myColor[params.dataIndex % num]
// },
color:function(params){
var num = people_myColor.length;
return new echarts.graphic.LinearGradient(1, 0, 0, 0, [{
offset: 0,
color: people_myColor[params.dataIndex % num]
},
{
offset: 1,
color: people_myColor2[params.dataIndex % num]
}
])
}
// color: new echarts.graphic.LinearGradient(1, 0, 0, 0, [{
// offset: 0,
// color: "#6f3d9e"
// },
// {
// offset: 1,
// color: "#3637a3"
// }
// ])
}
},
z: 2
},
]
};;
// 事件分类统计占比
var dom_incident_classification = document.getElementById("charts1_incident_classification");
var myChart_incident_classification = echarts.init(dom_incident_classification);
myChart_incident_classification.showLoading({
text: '数据加载中...',
color: '#c23531',
textColor: '#fff',
maskColor: 'rgba(255,255,255,0)',
zlevel: 0
});
var app = {};
var option_incident_classification = null;
option_incident_classification = {
tooltip: {
trigger: 'item',
formatter: "{a}
{b} : {c}%"
},
legend: {
orient: 'vertical',
align:'auto',
data: ['访问','咨询','订单','点击','展现','展现1','展现2'],
x: 'left',
y: 'bottom',
left:"22%",
textStyle: {
color: 'white',
borderColor: '#fff',
fontSize:13
},
itemWidth:15,
width:450,
height:120,
itemGap:20,
// formatter: function(param) {
// for (var i = 0; i < $scope.incident_category_proportion_data.length; i++) {
// if ($scope.incident_category_proportion_data[i].category == param) {
// return ' ' + $scope.incident_category_proportion_data[i].tocategory + ' ' + $scope.incident_category_proportion_data[i].num + ' ' + $scope.incident_category_proportion_data[i].proportion + '%';
// }
// }
// },
formatter: function(param) {
for (var i = 0; i < $scope.incident_category_proportion_data.length; i++) {
if ($scope.incident_category_proportion_data[i].category == param) {
return ' ' + $scope.incident_category_proportion_data[i].tocategory;
}
}
},
},
calculable: true,
series: [
{
name:'漏斗图',
type:'funnel',
left: '25%',
top: 60,
bottom: 60,
width: '50%',
height:180,
min: 0,
minSize: '0%',
maxSize: '100%',
sort: 'descending',
gap: 2,
label: {
align: 'left',
normal: {
show: true,
position: 'outside',
rich:"rich",
formatter:function(param){
// console.log(param)
return param.value+' '+param.percent+"%"
},
color:"rgba(255,255,255,0.6)"
},
},
itemStyle:{
borderColor:"transparent"
},
labelLine: {
length: 10,
lineStyle: {
width: 1,
type: 'solid'
}
},
emphasis: {
label: {
fontSize: 20
}
},
data: [
{value: 60, name: '访问'},
{value: 40, name: '咨询'},
{value: 20, name: '订单'},
{value: 80, name: '点击'},
{value: 100, name: '展现'},
{value: 120, name: '展现1'},
{value: 140, name: '展现2'}
]
}
],
color:["rgb(17,129,120)","rgb(192,83,213)","rgb(34,142,215)","rgb(249,143,59)","rgb(236,198,37)","rgb(208,64,47)","rgb(151,53,171)"]
};
// 调用数据
var nowYear=moment(new Date().getTime()).format('YYYY');
var fiveYearAgo=String(Number(nowYear-4));
var nowDay=moment(new Date().getTime()).format("YYYY-MM-DD");
var seventDayAgo=moment(new Date().getTime() - 86400000*30).format("YYYY-MM-DD");
// 获取事件处理近五年统计数据
// --开始
$scope.incident_handle_list=[];
function getIncident_handleData(time) {
api_hkreport.incidentreport(time, 'incident_trend').then(function(res) {
option_incident_handle.xAxis[0].data=[];
option_incident_handle.series[0].data=[];
option_incident_handle.series[1].data=[];
$scope.incident_handle_list=[];
for(var i=0;i0){
for(var i=0;i=100&&$scope.incident_handler_group_data[i].value<1000){
$scope.incident_handler_group_data[i]["tovalue"]=String($scope.incident_handler_group_data[i].value)+" "
}else if($scope.incident_handler_group_data[i].value&&$scope.incident_handler_group_data[i].value>=10&&$scope.incident_handler_group_data[i].value<100){
$scope.incident_handler_group_data[i]["tovalue"]=String($scope.incident_handler_group_data[i].value)+" "
}else if($scope.incident_handler_group_data[i].value&&$scope.incident_handler_group_data[i].value>=0&&$scope.incident_handler_group_data[i].value<10){
$scope.incident_handler_group_data[i]["tovalue"]=String($scope.incident_handler_group_data[i].value)+" "
}else{
$scope.incident_handler_group_data[i]["tovalue"]=String($scope.incident_handler_group_data[i].value)+" "
}
}
if(res.pieChart.length>0){
for(var i=0;i9){
for(var i=0;i<10;i++){
option_incident_people.yAxis[0].data.unshift(pieData[i].account);
option_incident_people.series[0].data.unshift(pieData[i].value)
}
}else{
for(var i=0;i0){
for(var i=0;i