let loadingFunnel = () => {
//title标示文字,标示线
loadingFunnel.title = (text, top, left, color, fontStyle, fontFamily, fontSize) => {
return {
text: text,
top: top,
left: left,
textStyle: {
color: color,
fontStyle: fontStyle,
fontFamily: fontFamily,
fontSize: fontSize,
}
}
};
loadingFunnel.arrData = [20, 40, 60, 80, 100];
var myChart = echarts.init(document.querySelector(".bar .chart"));
option = {
title: [
loadingFunnel.title('指标二', '25%', '21%', '#d1ecff', 'normal', 'sans-serif', '14'),
loadingFunnel.title('40', '32%', '21%', '#EFC302', 'normal', 'Digital', '20'),
loadingFunnel.title('指标一', '18%', '52%', '#d1ecff', 'normal', 'sans-serif', '14'),
loadingFunnel.title('20', '24%', '55%', '#A5E104', 'normal', 'Digital', '20'),
loadingFunnel.title('指标四', '43%', '16%', '#d1ecff', 'normal', 'sans-serif', '14'),
loadingFunnel.title('80', '50%', '16%', '#0FE6BE', 'normal', 'Digital', '20'),
loadingFunnel.title('指标三', '33%', '65%', '#d1ecff', 'normal', 'sans-serif', '14'),
loadingFunnel.title('60', '39%', '68%', '#FF5A00', 'normal', 'Digital', '20'),
loadingFunnel.title('指标五', '56%', '75%', '#d1ecff', 'normal', 'sans-serif', '14'),
loadingFunnel.title('100', '62%', '78%', '#0078FF', 'normal', 'Digital', '20')
],
color: ['#bb0004', '#FFD48A'],
tooltip: {
show: true,
formatter: function(params, ticket, callback) {
switch (params.name) {
case "指标一":
return "指标一 : " + loadingFunnel.arrData[0]
break;
case "指标二":
return "指标二 : " + loadingFunnel.arrData[1]
break;
case "指标三":
return "指标三 : " + loadingFunnel.arrData[2]
break;
case "指标四":
return "指标四 : " + loadingFunnel.arrData[3]
break;
default:
return "指标五 : " + loadingFunnel.arrData[4]
}
}
},
grid: {
// containLabel: true,
left: '10%',
top: "19%",
bottom: "15%",
},
xAxis: {
show: false,
data: [
'一季度',
'二季度',
'三季度',
'四季度'
],
axisTick: {
show: false
},
axisLabel: {
color: '#5EA2ED',
interval: 0
},
axisLine: {
lineStyle: {
color: '#1B5BBA',
}
}
},
yAxis: {
show: false,
splitLine: { show: false },
axisLine: {
lineStyle: {
color: '#1B5BBA',
}
},
axisLabel: {
color: '#5EA2ED',
interval: 0
},
},
series: [{
type: 'pictorialBar',
data: [{
name: '指标一',
z: 100,
value: 20,
symbolSize: ['100%', '63%'],
symbolPosition: 'center',
symbolOffset: [152, '-600%'],
symbol: 'image://../images/summary-bg.png',
}, {
name: '指标二',
z: 90,
value: 40,
symbolSize: ['200%', '33%'],
symbolPosition: 'center',
symbolOffset: [-9.5, '-400%'],
symbol: 'image://../images/summary-bg.png',
}, {
name: '指标三',
z: 80,
value: 60,
symbolSize: ['225%', '33%'],
symbolPosition: 'center',
symbolOffset: [-6, '-145%'],
symbol: 'image://../images/summary-bg.png',
}, {
name: '指标四',
z: 70,
value: 80,
symbolSize: ['275%', '33%'],
symbolPosition: 'center',
symbolOffset: [-179, '-10%'],
symbol: 'image://../images/summary-bg.png',
}, {
name: '指标五',
z: 60,
value: 100,
symbolSize: ['335%', '33%'],
symbolPosition: 'center',
symbolOffset: [-175, '75%'],
symbol: 'image://../images/summary-bg.png',
}]
}]
};
myChart.setOption(option);
};
// 折线图定制 (数据离散率挖掘)
(function() {
var sortData = [{
data: [
[30, 35, 36, 40, 120, 230, 210, 120, 213, 180, 200, 180, 79, 191, 324, 200, 180, 79, 82, 64, 43, 60, 19, 82, 64, 43, 60, 19, 34],
[123, 175, 112, 197, 121, 67, 98, 21, 43, 64, 76, 38, 24, 52, 26, 27, 30, 35, 36, 40, 120, 230, 210, 120, 213, 180, 200, 180, 79, 191, 324, ],
[400, 64, 191, 324, 290, 330, 310, 213, 180, 200, 180, 79, 9, 191, 324, 290, 330, 310, 213, 180, 200, 180, 79, 82, 64, 79, 82, 64, 4]
]
}];
var xData = function() {
var data = [];
for (var i = 1; i < 31; i++) {
data.push(i);
}
return data;
}();
// 1. 实例化对象
var myChart = echarts.init(document.querySelector(".divergence .chart"));
// 2.指定配置
var option = {
color: [{
colorStops: [{
offset: 0,
color: '#F9860C' // 0% 处的颜色
}, {
offset: 1,
color: '#fff' // 100% 处的颜色
}],
},
{
colorStops: [{
offset: 0,
color: '#07E1F1' // 0% 处的颜色
}, {
offset: 1,
color: '#0456CB' // 100% 处的颜色
}],
},
{
colorStops: [{
offset: 0,
color: '#11F90C' // 0% 处的颜色
}, {
offset: 1,
color: '#3FC713' // 100% 处的颜色
}],
}
],
// color: ["#FF9C00", "#0096FF", "#11F90C"], // 通过这个color修改两条线的颜色
tooltip: {
trigger: "axis",
// backgroundColor: '#12DFE0',
textStyle: {
align: 'left' //图例左对齐
},
},
legend: {
// 如果series 对象有name 值,则 legend可以不用写data
itemGap: 20,
itemHeight: 2,
itemWidth: 15,
icon: 'rect',
textStyle: {
color: "#fff"
},
top: "bottom",
},
grid: {
top: "0%",
left: "1%",
right: "1%",
bottom: "10%",
show: true, // 显示边框
borderWidth: '0', //去除边框
containLabel: true // 包含刻度文字在内
},
xAxis: {
type: "category",
boundaryGap: false,
data: xData,
axisTick: {
show: false // 去除刻度线
},
axisLabel: {
color: "#AADDFF" // 文本颜色
},
axisLine: {
lineStyle: {
color: 'rgba(255,255,255,.3)'
}
},
splitNumber: 8,
splitLine: {
show: false
},
splitArea: {
show: true,
areaStyle: {
color: ["rgba(250,250,250,0.05)", "rgba(250,250,250,0.0)"]
}
}
},
yAxis: {
type: "value",
axisTick: {
show: false // 去除刻度线
},
axisLabel: {
show: false // 去除文本
},
axisLine: {
show: false // 去除轴线
},
splitLine: {
lineStyle: {
color: "#012f4a" // 分割线颜色
}
}
},
series: [{
symbol: "none",
name: "方差",
type: "line",
data: sortData[0].data[0]
},
{
symbol: "none",
name: "标准差",
type: "line",
data: sortData[0].data[1]
}, {
symbol: "none",
name: "平均值",
type: "line",
data: sortData[0].data[2]
}
]
};
myChart.setOption(option);
window.addEventListener("resize", function() {
myChart.resize();
});
})();
// 渗漏隐藏排查
(function() {
// 基于准备好的dom,初始化echarts实例
var myChart = echarts.init(document.querySelector(".bar.hiddenCheck .chart"));
var xData = ['三到四层', '四到五层', '七到八层', '八到九层', '九到十层', '三到四层', '四到五层', '七到八层', '八到九层', '九到十层', '三到四层', '四到五层', '七到八层', '八到九层'];
var option = {
backgroundColor: 'transparent',
color: ['rgba(0,150,255,.5)', 'rgba(255,156,0,.5)'],
tooltip: {
//提示框组件
trigger: 'axis',
formatter: function(params) {
var relVal = params[0].name;
for (var i = 0, l = params.length; i < l; i++) {
relVal += '
';
relVal += '';
relVal += params[i].seriesName + ' : ' + params[i].value;
}
return relVal;
},
axisPointer: {
type: 'shadow',
},
textStyle: {
fontStyle: 'normal',
fontFamily: '微软雅黑',
fontSize: 12,
},
},
grid: {
left: '0',
right: '0',
bottom: '40',
top: '0',
containLabel: true,
},
legend: {
// 如果series 对象有name 值,则 legend可以不用写data
itemGap: 20,
itemHeight: 2,
itemWidth: 15,
icon: 'rect',
textStyle: {
color: "#fff"
},
top: "bottom",
},
//添加横线滚动条
dataZoom: {
start: 0, //默认为0
end: 100 - 1500 / 18, //默认为100
type: 'slider',
show: true,
xAxisIndex: [0],
handleSize: 0, //滑动条的 左右2个滑动条的大小
height: 4, //组件高度
left: 20, //左边的距离
right: 20, //右边的距离
bottom: 30, //右边的距离
handleColor: '#CBBCDB', //h滑动图标的颜色
handleStyle: {
borderColor: "#CBBCDB",
borderWidth: "1",
shadowBlur: 2,
background: "#CBBCDB",
shadowColor: "#CBBCDB",
},
textStyle: {
color: "#fff"
},
backgroundColor: 'rgba(37, 46, 100, 0.45)', //两边未选中的滑动条区域的颜色
showDataShadow: false, //是否显示数据阴影 默认auto
// showDetail: false, //即拖拽时候是否显示详细数值信息 默认true
filterMode: 'filter',
},
xAxis: [{
type: 'category',
// boundaryGap: true,//坐标轴两边留白
data: xData,
axisLabel: {
interval: 0,
// rotate: 340,
// formatter: function(val) {
// return val.split("").join("\n");
// }, //横轴信息文字竖直显示
textStyle: {
color: '#AADDFF',
fontStyle: 'normal',
fontFamily: '微软雅黑',
fontSize: 12,
},
},
axisTick: {
//坐标轴刻度相关设置。
show: false,
},
axisLine: {
//坐标轴轴线相关设置
},
splitLine: {
//坐标轴在 grid 区域中的分隔线。
show: false,
},
}, ],
yAxis: [{
type: 'value',
axisLabel: false,
axisLine: {
show: false,
},
axisTick: {
show: false,
},
splitLine: {
show: true,
lineStyle: {
color: ['#204C6F'],
opacity: 0.3,
},
},
boundaryGap: ['0', '10%'],
}],
series: [{
name: '正常',
type: 'bar',
data: [400, 180, 40, 30, 31, 400, 180, 40, 30, 31, 400, 180, 40, 30, 31, 400, 180, 40, 30, 31, 400, 180, 40, 30, 31],
barMaxWidth: '11',
itemStyle: {
borderColor: "#0096FF",
},
barGap: '50%',
},
{
name: '实际',
type: 'bar',
data: [500, 200, 50, 60, 36, 500, 200, 50, 60, 36, 500, 200, 50, 60, 36, 500, 200, 50, 60, 36, 500, 200, 50, 60, 36],
barMaxWidth: '11',
itemStyle: {
borderColor: "#FF9C00",
},
},
],
};
if (xData.length < 4) {
delete option.dataZoom
}
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
window.addEventListener("resize", function() {
myChart.resize();
});
})();
// 折线图定制 (跨设备数据关联)
(function() {
var sortData = [{
sortName: "喷淋末端与水泵启停关联",
data: [
// 两个数组是因为有两条线
[24, 52, 60, 70, 80, 30, 95, 36, 40, 120, 230, 210, 120, 213, 180, 200, 180, 79, 191, 324, 290, 330, 310, 213, 180, 200, 180, 79, 82, 64, 43, 60, 19, 34],
[40, 45, 50, 55, 60, 65, 70, 75, 80, 85, 90, 85, 80, 75, 70, 65, 60, 55, 50, 45, 40, 70, 80, 75, 70, 65, 60, 55, 50, 45, 40, ]
]
},
{
sortName: "试验消火栓与屋顶水箱液位关联",
data: [
// 两个数组是因为有两条线
[123, 175, 112, 197, 121, 67, 98, 21, 43, 64, 76, 38, 24, 52, 26, 27, 30, 35, 36, 40, 120, 230, 210, 120, 213, 180, 200, 180, 79, 191, 324, ],
[143, 131, 165, 123, 178, 21, 82, 64, 43, 60, 19, 34, 40, 64, 191, 324, 290, 330, 310, 213, 180, 200, 180, 79, 9, 191, 324, 290, 330, 310, 213, 180, ]
]
}
];
var xData = function() {
var data = [];
for (var i = 1; i < 31; i++) {
data.push(i);
}
return data;
}();
// 1. 实例化对象
var myChart = echarts.init(document.querySelector(".oldAnalysis .chart"));
// 2.指定配置
var option = {
color: ["#FF9C00", "#0096FF"], // 通过这个color修改两条线的颜色
tooltip: {
trigger: "axis",
textStyle: {
align: 'left' //图例左对齐
},
},
legend: {
// 如果series 对象有name 值,则 legend可以不用写data
itemGap: 20,
itemHeight: 2,
itemWidth: 15,
icon: 'rect',
textStyle: {
color: "#fff"
},
top: "bottom",
},
grid: {
top: "0%",
left: "1%",
right: "1%",
bottom: "15%",
show: true, // 显示边框
borderWidth: '0', //去除边框
containLabel: true // 包含刻度文字在内
},
xAxis: {
type: "category",
boundaryGap: false,
data: xData,
axisTick: {
show: false // 去除刻度线
},
axisLabel: {
color: "#AADDFF" // 文本颜色
},
axisLine: {
show: false // 去除轴线
}
},
yAxis: {
type: "value",
axisTick: {
show: false // 去除刻度线
},
axisLabel: {
show: false // 去除文本
},
axisLine: {
show: false // 去除轴线
},
splitLine: {
lineStyle: {
color: "#012f4a" // 分割线颜色
}
}
},
series: [{
symbol: "none",
name: "水泵启动",
type: "line",
smooth: true, // true 可以让我们的折线显示带有弧度
areaStyle: {
normal: {
color: new echarts.graphic.LinearGradient(
0,
0,
0,
1, [{
offset: 0,
color: "rgba(255,156,0, 0.4)"
},
{
offset: 0.8,
color: "rgba(255,156,0, 0.3)"
}
],
false
),
shadowColor: "rgba(0, 0, 0, 0.1)"
}
},
data: sortData[0].data[0]
},
{
symbol: "none",
name: "水泵停止",
type: "line",
smooth: true,
areaStyle: {
normal: {
color: new echarts.graphic.LinearGradient(
0,
0,
0,
1, [{
offset: 0,
color: "rgba(0,150,255,0.5)"
},
{
offset: 0.8,
color: "rgba(0,150,255, 0.1)"
}
],
false
),
shadowColor: "rgba(0, 0, 0, 0.1)"
}
},
data: sortData[0].data[1]
}
]
};
myChart.setOption(option);
window.addEventListener("resize", function() {
myChart.resize();
});
// 点击切换效果
$(".oldAnalysis .tab-line").on("click", "a", function() {
$(this).addClass('active').siblings().removeClass('active')
var obj = sortData[$(this).index()];
option.series[0].data = obj.data[0];
option.series[1].data = obj.data[1];
// 重新渲染
myChart.setOption(option);
});
})();
// 折线图定制 (数据波动关联)
(function() {
var sortData = [{
data: [
[30, 70, 100, 120, 130, 190, 200, 230, 120, 100, 90, 80, 59, 30],
]
}];
var xData = ['一到二层', '二到三层', '三到四层', '四到五层', '五到六层', '六到七层', '七到八层', '八到九层', '九到十层', '十到十一层', '十一到十二层', '十二到十三层']
// 1. 实例化对象
var myChart = echarts.init(document.querySelector(".hotAnalysis .chart"));
// 2.指定配置
var option = {
color: ["#FE92B3"], // 通过这个color修改三条线的颜色
tooltip: {
trigger: "axis",
textStyle: {
align: 'left' //图例左对齐
},
// backgroundColor: '#12DFE0',
// formatter: '{a0}: {c0}
{b}'
},
legend: false
// {
// // 如果series 对象有name 值,则 legend可以不用写data
// itemGap: 20,
// itemHeight: 2,
// itemWidth: 15,
// icon: 'rect',
// textStyle: {
// color: "#fff"
// },
// top: "bottom",
// }
,
grid: {
top: "0%",
left: "1%",
right: "1%",
bottom: "15%",
show: true, // 显示边框
borderWidth: '0', //去除边框
containLabel: false, // 不包含刻度文字在内
},
xAxis: {
type: "category",
boundaryGap: false,
data: xData,
axisTick: {
show: false // 去除刻度线
},
axisLabel: {
color: "#AADDFF" // 文本颜色
},
axisLine: {
show: false // 去除轴线
}
},
yAxis: {
type: "value",
axisTick: {
show: false // 去除刻度线
},
axisLabel: {
show: false // 去除文本
},
axisLine: {
show: false // 去除轴线
},
splitLine: {
lineStyle: {
color: "#012f4a" // 分割线颜色
}
}
},
series: [{
symbol: "none",
name: "异常水压值",
type: "line",
smooth: true,
areaStyle: {
normal: {
color: new echarts.graphic.LinearGradient(
0,
0,
0,
1, [{
offset: 0,
color: "rgba(255,147,180,.6)"
},
{
offset: 0.8,
color: "rgba(255,147,180, 0.4)"
}
],
false
),
}
},
data: sortData[0].data[0]
}]
};
myChart.setOption(option);
window.addEventListener("resize", function() {
myChart.resize();
});
})();
// 饼形图定制
// 折线图定制
// (function() {
// // 基于准备好的dom,初始化echarts实例
// var myChart = echarts.init(document.querySelector(".pie .chart"));
// option = {
// tooltip: {
// trigger: "item",
// formatter: "{a}
{b}: {c} ({d}%)",
// position: function(p) {
// //其中p为当前鼠标的位置
// return [p[0] + 10, p[1] - 10];
// }
// },
// legend: {
// top: "90%",
// itemWidth: 10,
// itemHeight: 10,
// data: ["0岁以下", "20-29岁", "30-39岁", "40-49岁", "50岁以上"],
// textStyle: {
// color: "rgba(255,255,255,.5)",
// fontSize: "12"
// }
// },
// series: [{
// name: "年龄分布",
// type: "pie",
// center: ["50%", "42%"],
// radius: ["40%", "60%"],
// color: [
// "#065aab",
// "#066eab",
// "#0682ab",
// "#0696ab",
// "#06a0ab",
// "#06b4ab",
// "#06c8ab",
// "#06dcab",
// "#06f0ab"
// ],
// label: { show: false },
// labelLine: { show: false },
// data: [
// { value: 1, name: "0岁以下" },
// { value: 4, name: "20-29岁" },
// { value: 2, name: "30-39岁" },
// { value: 2, name: "40-49岁" },
// { value: 1, name: "50岁以上" }
// ]
// }]
// };
// // 使用刚指定的配置项和数据显示图表。
// myChart.setOption(option);
// window.addEventListener("resize", function() {
// myChart.resize();
// });
// // 点击切换显示数据
// $(".line h2").on("click", "a", function() {
// // 点击a之后,根据当前的a的索引号,找到对应的yearData的数据
// var obj = yearData[$(this).index()];
// option.series[0].data = obj.data[0];
// option.series[1].data = obj.data[1];
// // 重新渲染数据
// myChart.setOption(option);
// });
// })();
// 折线图 优秀作品
// (function() {
// // 基于准备好的dom,初始化echarts实例
// var myChart = echarts.init(document.querySelector(".line1 .chart"));
// option = {
// tooltip: {
// trigger: "axis",
// axisPointer: {
// lineStyle: {
// color: "#dddc6b"
// }
// }
// },
// legend: {
// top: "0%",
// textStyle: {
// color: "rgba(255,255,255,.5)",
// fontSize: "12"
// }
// },
// grid: {
// left: "10",
// top: "30",
// right: "10",
// bottom: "10",
// containLabel: true
// },
// xAxis: [{
// type: "category",
// boundaryGap: false,
// axisLabel: {
// textStyle: {
// color: "rgba(255,255,255,.6)",
// fontSize: 12
// }
// },
// axisLine: {
// lineStyle: {
// color: "rgba(255,255,255,.2)"
// }
// },
// data: [
// "01",
// "02",
// "03",
// "04",
// "05",
// "06",
// "07",
// "08",
// "09",
// "11",
// "12",
// "13",
// "14",
// "15",
// "16",
// "17",
// "18",
// "19",
// "20",
// "21",
// "22",
// "23",
// "24",
// "25",
// "26",
// "27",
// "28",
// "29",
// "30"
// ]
// },
// {
// axisPointer: { show: false },
// axisLine: { show: false },
// position: "bottom",
// offset: 20
// }
// ],
// yAxis: [{
// type: "value",
// axisTick: { show: false },
// axisLine: {
// lineStyle: {
// color: "rgba(255,255,255,.1)"
// }
// },
// axisLabel: {
// textStyle: {
// color: "rgba(255,255,255,.6)",
// fontSize: 12
// }
// },
// splitLine: {
// lineStyle: {
// color: "rgba(255,255,255,.1)"
// }
// }
// }],
// series: [{
// name: "播放量",
// type: "line",
// smooth: true,
// symbol: "circle",
// symbolSize: 5,
// showSymbol: false,
// lineStyle: {
// normal: {
// color: "#0184d5",
// width: 2
// }
// },
// areaStyle: {
// normal: {
// color: new echarts.graphic.LinearGradient(
// 0,
// 0,
// 0,
// 1, [{
// offset: 0,
// color: "rgba(1, 132, 213, 0.4)"
// },
// {
// offset: 0.8,
// color: "rgba(1, 132, 213, 0.1)"
// }
// ],
// false
// ),
// shadowColor: "rgba(0, 0, 0, 0.1)"
// }
// },
// itemStyle: {
// normal: {
// color: "#0184d5",
// borderColor: "rgba(221, 220, 107, .1)",
// borderWidth: 12
// }
// },
// data: [
// 30,
// 40,
// 30,
// 40,
// 30,
// 40,
// 30,
// 60,
// 20,
// 40,
// 20,
// 40,
// 30,
// 40,
// 30,
// 40,
// 30,
// 40,
// 30,
// 60,
// 20,
// 40,
// 20,
// 40,
// 30,
// 60,
// 20,
// 40,
// 20,
// 40
// ]
// },
// {
// name: "转发量",
// type: "line",
// smooth: true,
// symbol: "circle",
// symbolSize: 5,
// showSymbol: false,
// lineStyle: {
// normal: {
// color: "#00d887",
// width: 2
// }
// },
// areaStyle: {
// normal: {
// color: new echarts.graphic.LinearGradient(
// 0,
// 0,
// 0,
// 1, [{
// offset: 0,
// color: "rgba(0, 216, 135, 0.4)"
// },
// {
// offset: 0.8,
// color: "rgba(0, 216, 135, 0.1)"
// }
// ],
// false
// ),
// shadowColor: "rgba(0, 0, 0, 0.1)"
// }
// },
// itemStyle: {
// normal: {
// color: "#00d887",
// borderColor: "rgba(221, 220, 107, .1)",
// borderWidth: 12
// }
// },
// data: [
// 50,
// 30,
// 50,
// 60,
// 10,
// 50,
// 30,
// 50,
// 60,
// 40,
// 60,
// 40,
// 80,
// 30,
// 50,
// 60,
// 10,
// 50,
// 30,
// 70,
// 20,
// 50,
// 10,
// 40,
// 50,
// 30,
// 70,
// 20,
// 50,
// 10,
// 40
// ]
// }
// ]
// };
// // 使用刚指定的配置项和数据显示图表。
// myChart.setOption(option);
// window.addEventListener("resize", function() {
// myChart.resize();
// });
// })();
// 点位分布统计模块
// (function() {
// // 1. 实例化对象
// var myChart = echarts.init(document.querySelector(".pie1 .chart"));
// // 2. 指定配置项和数据
// var option = {
// legend: {
// top: "90%",
// itemWidth: 10,
// itemHeight: 10,
// textStyle: {
// color: "rgba(255,255,255,.5)",
// fontSize: "12"
// }
// },
// tooltip: {
// trigger: "item",
// formatter: "{a}
{b} : {c} ({d}%)"
// },
// // 注意颜色写的位置
// color: [
// "#006cff",
// "#60cda0",
// "#ed8884",
// "#ff9f7f",
// "#0096ff",
// "#9fe6b8",
// "#32c5e9",
// "#1d9dff"
// ],
// series: [{
// name: "点位统计",
// type: "pie",
// // 如果radius是百分比则必须加引号
// radius: ["10%", "70%"],
// center: ["50%", "42%"],
// roseType: "radius",
// data: [
// { value: 20, name: "云南" },
// { value: 26, name: "北京" },
// { value: 24, name: "山东" },
// { value: 25, name: "河北" },
// { value: 20, name: "江苏" },
// { value: 25, name: "浙江" },
// { value: 30, name: "深圳" },
// { value: 42, name: "广东" }
// ],
// // 修饰饼形图文字相关的样式 label对象
// label: {
// fontSize: 10
// },
// // 修饰引导线样式
// labelLine: {
// // 连接到图形的线长度
// length: 10,
// // 连接到文字的线长度
// length2: 10
// }
// }]
// };
// // 3. 配置项和数据给我们的实例化对象
// myChart.setOption(option);
// // 4. 当我们浏览器缩放的时候,图表也等比例缩放
// window.addEventListener("resize", function() {
// // 让我们的图表调用 resize这个方法
// myChart.resize();
// });
// })();