/**
* 充电卡统计分析
* */
htmlObj.getCarNumberInfo = function(){
var myChartCount = echarts.init(document.getElementById(‘count‘));
var option = {
title: {
//text: ‘堆叠区域图‘,
subtext:‘数量（个）‘
},
tooltip : {
trigger: ‘axis‘
},
legend: {
data:[‘近一周充电卡新增数量‘]
},
grid: {
left: ‘3%‘,
right: ‘4%‘,
bottom: ‘3%‘,
containLabel: true
},
xAxis : [
{
type : ‘category‘,
boundaryGap : false,
splitLine:false,
axisTick:false,
axisLine:{//坐标轴轴线相关设置。
lineStyle:{
color:‘#ccc‘,
width:‘1‘
}
},
data : [‘周一‘,‘周二‘,‘周三‘,‘周四‘,‘周五‘,‘周六‘,‘周日‘]
}
],
yAxis : [
{
type : ‘value‘,
splitLine:false,
axisTick:false,
axisLine:{
lineStyle:{
color:‘#ccc‘,
width:‘2‘
}
}
}
],
series : [
{
name:‘近一周充电卡新增数量‘,//用于tooltip的显示
type:‘line‘,
smooth:‘true‘,//平滑过渡
label: {
normal: {
show: true,
position: ‘top‘
}
},
itemStyle:{//折线拐点标志的样式。
normal:{
borderColor:‘#B38FFB‘,//圆圈表框颜色
borderWidth:‘2‘
//color:"#000"
},
emphasis:{//获取焦点时数据圆圈颜色
color: ‘#9669F8‘,
borderColor:‘#FDFEFF‘,
borderWidth:‘3‘
}
},
lineStyle:{//线条样式
normal:{
width:‘0‘
}
},
areaStyle: {//区域填充样式。
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{//填充的颜色
offset: 0, color: ‘#9967FF‘ // 0% 处的颜色
}, {
offset: 1, color: ‘#B4C7FF‘ // 100% 处的颜色
}], false)
}
},
data:[53, 36, 59, 71, 56, 84, 42]
}
]
};
myChartCount.setOption(option);
};
/**
* 充电金额
* */
htmlObj.getCarMoneyInfo = function(){
var myChartCount = echarts.init(document.getElementById(‘menoy‘));
var option = {
title: {
//text: ‘堆叠区域图‘,
subtext:‘数量（个）‘
},
tooltip : {
trigger: ‘axis‘
},
legend: {
data:[‘近一周充电卡充值金额‘]
},
grid: {
left: ‘3%‘,
right: ‘4%‘,
bottom: ‘3%‘,
containLabel: true
},
xAxis : [
{
type : ‘category‘,
boundaryGap : false,
splitLine:false,
axisTick:false,
axisLine:{//坐标轴轴线相关设置。
lineStyle:{
color:‘#ccc‘,
width:‘1‘
}
},
data : [‘周一‘,‘周二‘,‘周三‘,‘周四‘,‘周五‘,‘周六‘,‘周日‘]
}
],
yAxis : [
{
type : ‘value‘,
splitLine:false,
axisTick:false,
axisLine:{
lineStyle:{
color:‘#ccc‘,
width:‘2‘
}
}
}
],
series : [
{
name:‘近一周充电卡充值金额‘,//用于tooltip的显示
type:‘line‘,
//animationDuration:‘2000‘,//动画时间
smooth:‘true‘,//平滑过渡
label: {
normal: {
show: true,
position: ‘top‘
}
},
itemStyle:{//折线拐点标志的样式。
normal:{
borderColor:‘#FE7600‘,//圆圈表框颜色
borderWidth:‘2‘
//color:"#000"
},
emphasis:{//获取焦点时数据圆圈颜色
color: ‘#FE7600‘,
borderColor:‘#FDFEFF‘,
borderWidth:‘3‘
}
},
lineStyle:{//线条样式
normal:{
width:‘0‘
}
},
areaStyle: {//区域填充样式。
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{//填充的颜色
offset: 0, color: ‘#FF7803‘ // 0% 处的颜色
}, {
offset: 1, color: ‘#F6B98C‘ // 100% 处的颜色
}], false)
}
},
data:[530, 360, 590, 710, 560, 804, 420]
}
]
};
myChartCount.setOption(option);
};
/**
* 充电卡消费
* */
htmlObj.getCarConsumptionInfo = function(){
var myChartCount = echarts.init(document.getElementById(‘consumption‘));
option = {
tooltip: {
trigger: ‘axis‘
},
legend: {
//data:[‘次数‘,‘金额‘]
},
grid: {
left: ‘3%‘,
right: ‘4%‘,
bottom: ‘3%‘,
containLabel: true
},
xAxis: [
{
type: ‘category‘,
splitLine:false,
axisTick:false,
axisLine:{//坐标轴轴线相关设置。
lineStyle:{
color:‘#ccc‘,
width:‘1‘
}
},
data: [‘1‘,‘2‘,‘3‘,‘4‘,‘5‘,‘6‘,‘7‘,‘8‘,‘9‘,‘10‘,‘11‘,‘12‘,‘13‘,‘14‘,‘15‘,‘16‘,‘17‘,‘18‘,‘19‘,‘20‘,‘21‘,‘22‘,‘23‘,‘24‘,‘25‘,‘26‘,‘27‘,‘28‘,‘29‘,‘30‘]
}
],
yAxis: [
{
type: ‘value‘,
name: ‘次数（次）‘,
splitLine:false,
axisTick:false,
axisLabel: {
formatter: ‘{value}‘
},
axisLine:{//坐标轴轴线相关设置。
lineStyle:{
color:‘#ccc‘,
width:‘1‘
}
}
},
{
type: ‘value‘,
name: ‘金额（元）‘,
splitLine:false,
axisTick:false,
axisLabel: {
formatter: ‘{value}‘
},
axisLine:{//坐标轴轴线相关设置。
lineStyle:{
color:‘#ccc‘,
width:‘1‘
}
}
}
],
series: [
{
name:‘充电次数‘,
type:‘bar‘,
itemStyle:{
normal:{
color:‘#667CF3‘
},
emphasis:{
color:‘#ACBBFF‘
}
},
//animationDuration:‘2000‘,//动画时间
data:[499, 7, 23, 25, 76, 1305, 162, 302, 2990, 688, 3, 25, 796, 135, 1602, 32, 2880, 690, 367, 200, 65, 3, 265, 766, 1365, 1662, 362, 260, 886, 73]
},
{
name:‘充电收费‘,
type:‘line‘,
animationDuration:‘2000‘,//动画时间
smooth:‘true‘,//平滑过渡
yAxisIndex: 1,
lineStyle:{//线条样式
normal:{
width:‘2‘,
color:‘#48E179‘
}
},
itemStyle:{//折线拐点标志的样式。
normal:{
borderColor:‘#48E179‘,//圆圈表框颜色
borderWidth:‘2‘
},
emphasis:{//获取焦点时数据圆圈颜色
color: ‘#48E179‘,
borderColor:‘#FDFEFF‘,
borderWidth:‘3‘
}
},
data:[4000, 70, 230, 250, 760, 1350, 1620, 320, 200, 60, 30, 25, 760, 1350, 1602, 302, 920, 6, 389, 290, 6, 376, 235, 756, 135, 1672, 392, 240, 644, 366]
}
]
};
myChartCount.setOption(option);
};
时间： 2024-12-20 17:34:56