echarts的二次封装

/**
* 每次部署的时候，都不要忘记修改这个路径
*/

require.config({
paths : {
'echarts' : '/resources/echarts-2.2.3/build/dist'
}
});
/**
* 这是一个判空的函数，可以单独提出来放到工具类中
*
* @param str
* @returns {Boolean}
*/
function IsEmptyData(str) {
var result = false;
if (str == null || typeof (str) == 'undefined') {
result = true;
} else {
var reg = new RegExp(" ", "g");
str += "";
str = str.replace(reg, "");
if (str.length == 0) {
result = true;
}
}

return result;
}

/**
* 设置项目的基础路径
*
* @param EchartsbasePath
*/
function SetEchartsbasePath(EchartsbasePath) {
require.config({
paths : {
'echarts' : EchartsbasePath + 'resources/echarts-2.2.3/build/dist'
}
});
}

/**
* 如果需要对饼图绑定事件，那么在加载页面之前（如果是嵌套页，则在主页面上）执行以下方法，对类库提前加载
*/
function pie_environment() {
require([ 'echarts', 'echarts/chart/pie', 'echarts/chart/funnel' ],
function(ec) {
});
}

/**
* 如果需要对柱（线）图绑定事件，那么在加载页面之前（如果是嵌套页，则在主页面上）执行以下方法，对类库提前加载
*/
function bar_environment() {
require([ 'echarts', 'echarts/chart/bar', 'echarts/chart/line' ], function(
ec) {
});
}

/**
* 如果需要地图绑定事件，那么在加载页面之前（如果是嵌套页，则在主页面上）执行以下方法，对类库提前加载
*/
function earth_environment() {
require([ 'echarts', 'echarts/chart/map' ], function(ec) {
});
}

/**
* 饼图构建辅助方法
*
* @param divid
* 容器ID
* @param ajaxdata
* JSON数据
* @param piesetting
* 包含属性：name, value, titletext, subtitletext, seriesname, islegend,
* legendalign, istoolbox, titlealign, orienttype
* @param name
* 名称 列名
* @param value
* 值 列名
* @param titletext
* 主标题
* @param subtitletext
* 副标题
* @param seriesname
* 提示框名称
* @param islegend
* 是否显示示例，默认值true
* @param legendalign
* 图例显示位置，默认值left
* @param istoolbox
* 是否显示右上方的工具栏，默认值true
* @param istooltip
* 是否显示提示框，默认值true
* @param titlealign
* 标题位置，默认值center
* @param orienttype
* 图例的排序方式，默认为垂直显示(vertical),水平显示属性为horizontal
* @param chartradius
* 饼图半径,默认55%，传入数组实现环形图[内半径，外半径]
* @param itemStyle
* 设置提示文字样式
* @param color
* 设置颜色带，需传入一个组个数量的数组
* @param titleS

tyle
* 标题样式
*/
function InitECharts_pie(divid, ajaxdata, piesetting) {
if (IsEmptyData(divid) || IsEmptyData(document.getElementById(divid))) {
alert("绑定的容器ID不存在");
return false;
}

if (IsEmptyData(ajaxdata)) {
for ( var i = 0; i < document.getElementById(divid).childNodes.length; i++) {
document.getElementById(divid).removeChild(
document.getElementById(divid).childNodes[i]);
}
return false;
}

if (IsEmptyData(piesetting)) {
alert("设置为空或不正确");
return false;
}

if (IsEmptyData(piesetting.titletext)) {
piesetting.titletext = "";
}

if (IsEmptyData(piesetting.subtitletext)) {
piesetting.subtitletext = "";
}

if (IsEmptyData(piesetting.seriesname)) {
piesetting.seriesname = "";
}

if (IsEmptyData(piesetting.islegend)) {
piesetting.islegend = true;
}

if (IsEmptyData(piesetting.legendalign)) {
piesetting.legendalign = 'left';
}

if (IsEmptyData(piesetting.istoolbox)) {
piesetting.istoolbox = true;
}

if (IsEmptyData(piesetting.istooltip)) {
piesetting.istooltip = true;
}

if (IsEmptyData(piesetting.titlealign)) {
piesetting.titlealign = "center";
}

if (IsEmptyData(piesetting.orienttype)) {
piesetting.orienttype = "vertical";
}

if (IsEmptyData(piesetting.chartradius)) {
piesetting.chartradius = "55%";
}

if (IsEmptyData(piesetting.titleStyle)) {
piesetting.titleStyle = {};
}

var legend = "";

if (piesetting.islegend) {
var data = [];

for ( var i = 0; i < ajaxdata.length; i++) {
data.push(ajaxdata[i][https://www.360docs.net/doc/d211241697.html,]);
}

legend = {
orient : piesetting.orienttype,
x : piesetting.legendalign,
data : data
};
}

var piedata = [];

for ( var i = 0; i < ajaxdata.length; i++) {
piedata.push({
value : ajaxdata[i][piesetting.value],
name : ajaxdata[i][https://www.360docs.net/doc/d211241697.html,]
});
}

var option = {
title : {
text : piesetting.titletext,
subtext : piesetting.subtitletext,
x : piesetting.titlealign,
textStyle : piesetting.titleStyle
},
tooltip : {
show : piesetting.istooltip,
trigger : 'item',
formatter : (piesetting.seriesname ? "{a}
{b} : {c} ({d}%)"
: "{b} : {c} ({d}%)"),
position : function(posit) {
return [ posit[0] - 10, posit[1] + 30 ];// 位置指定
}
},
legend : legend,
toolbox : {
show : piesetting.istoolbox,
feature : {
mark : {
show : true
},
dataView : {
show : true,
readOnly : false
},
magicType : {
show : true,
type : [ 'pie', 'funnel' ],
option : {
funnel : {
x : '25%',
width : '50%',
funnelAlign : 'left',
max : 1548
}
}
},
restore : {
show : true
},
saveAsImage : {
show : true
}
}
},
calculable : false,
// clickable : true,
series : [ {
name : piesetting.s

eriesname,
type : 'pie',
radius : piesetting.chartradius,
center : [ '50%', '60%' ],
data : piedata
} ]
};

if (!IsEmptyData(piesetting.itemStyle)) {
option.series[0].itemStyle = piesetting.itemStyle;
}

if (!IsEmptyData(piesetting.color)) {
option.color = piesetting.color;
}

var myChart1 = null;
require([ 'echarts', 'echarts/chart/pie', 'echarts/chart/funnel' ],
function(ec) {
myChart1 = ec.init(document.getElementById(divid));
myChart1.clear();
myChart1.setOption(option);
});
return myChart1;
}

/**
* 饼图构建辅助方法
*
* @param divid
* 容器ID
* @param option
* 自定义设置，适合多样化设置的统计图构建
*/
function InitECharts_pie_option(divid, option) {
var myChart1 = null;
require([ 'echarts', 'echarts/chart/pie', 'echarts/chart/funnel' ],
function(ec) {
myChart1 = ec.init(document.getElementById(divid));
myChart1.clear();
myChart1.setOption(option);
});
return myChart1;
}

/**
* 饼环混合图构建辅助方法
*
* @param divid
* 容器ID
* @param ajaxdata
* JSON数据
* @param piesetting
* 包含属性：mainname,subname, value, titletext, subtitletext, seriesname,
* islegend, legendalign, istoolbox, titlealign, orienttype
* @param mainname
* 内环名称 主分类列名
* @param subname
* 外环名称 子分类列名
* @param value
* 值 列名
* @param titletext
* 主标题
* @param subtitletext
* 副标题
* @param seriesname
* 提示框名称
* @param islegend
* 是否显示示例，默认值true
* @param legendalign
* 图例显示位置，默认值left
* @param istoolbox
* 是否显示右上方的工具栏，默认值true
* @param istooltip
* 是否显示提示框，默认值true
* @param titlealign
* 标题位置，默认值center
* @param orienttype
* 图例的排序方式，默认为垂直显示(vertical),水平显示属性为horizontal
* @param chartradius
* 饼图半径,默认[70, 40]，传入数组实现环形图[内半径，外半径]
* @param itemStyle
* 设置提示文字样式
* @param color
* 设置颜色带，需传入一个组个数量的数组
*/
function InitECharts_pie_Mixed(divid, ajaxdata, piesetting) {
if (IsEmptyData(divid) || IsEmptyData(document.getElementById(divid))) {
alert("绑定的容器ID不存在");
return false;
}

if (IsEmptyData(ajaxdata)) {
for ( var i = 0; i < document.getElementById(divid).childNodes.length; i++) {
document.getElementById(divid).removeChild(
document.getElementById(divid).childNodes[i]);
}
return false;
}

if (IsEmptyData(piesetting)) {
alert("设置为空或不正确");
return false;
}

if (IsEmptyData(piesetting.titletext)) {
piesetting.titletext = "";
}

if (IsEmptyData(piesetting.subtitletext)) {
piesetting.subtitletext = "";
}

if (IsEmptyData(piesetting.seriesname)) {
piesetting.seriesname = "";
}

if (IsEmptyData(piesetting.islegend)) {
piesetting.islegend = true;
}

if (IsEmptyData(piesetting.legendalign)) {
piesetting.legendalign = 'left';
}

if (IsEmptyData(piesetting.istoolbox)) {
piesetting.istoolbox = true;
}

if (IsEmptyData(piesetting.istooltip)) {
piesetting.istooltip = true;
}

if (IsEmptyData(piesetting.titlealign)) {
piesetting.titlealign = "center";
}

if (IsEmptyData(piesetting.orienttype)) {
piesetting.orienttype = "vertical";
}

if (IsEmptyData(piesetting.chartradius)) {
piesetting.chartradius = [ 70, 40 ];
}

var legend = "";

if (piesetting.islegend) {
var data = [];

for ( var i = 0; i < ajaxdata.length; i++) {
data.push(ajaxdata[i][piesetting.subname]);
}

legend = {
orient : piesetting.orienttype,
x : piesetting.legendalign,
data : data
};
}

var piedata1 = [];
var piedata2 = [];
var piedatamax = 100;
// mainname subname
var maindatatmp = {};
var mainnametmp = [];
for ( var i = 0; i < ajaxdata.length; i++) {
if (maindatatmp[ajaxdata[i][piesetting.mainname]]) {
maindatatmp[ajaxdata[i][piesetting.mainname]] += (ajaxdata[i][piesetting.value] * 1);
} else {
maindatatmp[ajaxdata[i][piesetting.mainname]] = (ajaxdata[i][piesetting.value] * 1);
mainnametmp.push(ajaxdata[i][piesetting.mainname]);
}

piedata2.push({
value : ajaxdata[i][piesetting.value],
name : ajaxdata[i][piesetting.subname]
});
}

for ( var i = 0; i < mainnametmp.length; i++) {
piedata1.push({
value : maindatatmp[mainnametmp[i]],
name : mainnametmp[i]
});
}

var option = {
title : {
text : piesetting.titletext,
subtext : piesetting.subtitletext,
x : piesetting.titlealign
},
tooltip : {
show : piesetting.istooltip,
trigger : 'item',
formatter : (piesetting.seriesname ? "{a}
{b} : {c} ({d}%)"
: "{b} : {c} ({d}%)"),
position : function(posit) {
return [ posit[0] - 10, posit[1] + 30 ];// 位置指定
}
},
legend : legend,
toolbox : {
show : piesetting.istoolbox,
feature : {
mark : {
show : true
},
dataView : {
show : true,
readOnly : false
},
magicType : {
show : true,
type : [ 'pie', 'funnel' ],
option : {
funnel : {
x : '25%',
width : '50%',
funnelAlign : 'left',
max : 1548
}
}
},
restore : {
show : true
},
saveAsImage : {
show : true
}
}
},
calculable : false,
// clickable : true,
series : [
{
name : piesetting.seriesname,
type : 'pie',
radius : [ 0, piesetting.chartradius[0] ],
// center:

['50%', '60%'],
itemStyle : {
normal : {
label : {
position : 'inner'
},
labelLine : {
show : false
}
}
},
data : piedata1
},
{
name : piesetting.seriesname,
type : 'pie',
radius : [
(piesetting.chartradius[0] + 30),
(piesetting.chartradius[0] + 30 + piesetting.chartradius[1]) ],
// center: ['50%', '60%'],
x : '40%',
width : '35%',
funnelAlign : 'center',
max : piedatamax,
data : piedata2
} ]
};

if (!IsEmptyData(piesetting.itemStyle)) {
option.series[0].itemStyle = piesetting.itemStyle;
}

if (!IsEmptyData(piesetting.color)) {
option.color = piesetting.color;
}

var myChart1 = null;
require([ 'echarts', 'echarts/chart/pie', 'echarts/chart/funnel' ],
function(ec) {
myChart1 = ec.init(document.getElementById(divid));
myChart1.clear();
myChart1.setOption(option);
});
return myChart1;
}

/**
* 柱线混合图构建辅助方法
*
* @param divid
* 容器ID
* @param ajaxdata
* JSON数据
* @param barsetting
* 包含:name, valuearry, textarry, typearry, yAxisarry, titletext,
* subtitletext, islegend, legendalign, istoolbox, titlealign,
* orienttype
* @param name
* 名称 列名
* @param valuearry
* 值 列名数组
* @param textarry
* 图例 名称数组
* @param typearry
* 显示类型 数组 柱bar 线line
* @param stackarry
* 群组属性（相同群组名称的多柱显示为层叠效果）
* @param yAxisarry
* y轴显示名称和单位集合 例:[{ name : '数量', text : '个' }, { name : '概率', text :
* '%' } ];
* @param titletext
* 主标题
* @param subtitletext
* 副标题
* @param islegend
* 是否显示图例，默认值true
* @param legendalign
* 图例显示位置，默认值left
* @param istoolbox
* 是否显示右上方的工具栏，默认值true
* @param istooltip
* 是否显示提示框，默认值true
* @param titlealign
* 标题位置，默认值center
* @param orienttype
* 图例的排序方式，默认为垂直显示(vertical),水平显示属性为horizontal
* @param islongtext
* 长文本处理方式，倾斜45°，12px
* @param chartwidth
* 统计图主体的宽度，默认70%
* @param chartheight
* 统计图主体的高度，默认70%
* @param isdataZoom
* 是否显示时间轴
* @param zoomstart
* 时间轴区间开始百分比（区间在0-100）
* @param zoomend
* 时间轴区间结束百分比（区间在0-100）
* @param isrealtime
* 缩放变化是否实时显示，默认true
* @param zoomheight
*

时间轴区域的高度
* @param x
* 主体的x坐标
* @param y
* 主体的y坐标
*/
function InitECharts_bar(divid, ajaxdata, barsetting) {
if (IsEmptyData(divid) || IsEmptyData(document.getElementById(divid))) {
alert("绑定的容器ID不存在");
return false;
}

if (IsEmptyData(ajaxdata)) {
for ( var i = 0; i < document.getElementById(divid).childNodes.length; i++) {
document.getElementById(divid).removeChild(
document.getElementById(divid).childNodes[i]);
}
}

if (IsEmptyData(barsetting)) {
alert("设置为空或不正确");
return false;
}

if (IsEmptyData(barsetting.islegend)) {
barsetting.islegend = true;
}

if (IsEmptyData(barsetting.legendalign)) {
barsetting.legendalign = 'left';
}

if (IsEmptyData(barsetting.istoolbox)) {
barsetting.istoolbox = true;
}

if (IsEmptyData(barsetting.istooltip)) {
barsetting.istooltip = true;
}

if (IsEmptyData(barsetting.titlealign)) {
barsetting.titlealign = "center";
}

if (IsEmptyData(barsetting.orienttype)) {
barsetting.orienttype = "vertical";
}

if (IsEmptyData(barsetting.chartwidth)) {
barsetting.chartwidth = "70%";
}

if (IsEmptyData(barsetting.chartheight)) {
barsetting.chartheight = "70%";
}

if (IsEmptyData(barsetting.islongtext)) {
barsetting.islongtext = false;
}

if (IsEmptyData(barsetting.isdataZoom)) {
barsetting.isdataZoom = false;
}

if (IsEmptyData(barsetting.zoomstart)) {
barsetting.zoomstart = 30;
}

if (IsEmptyData(barsetting.zoomend)) {
barsetting.zoomend = 70;
}

if (IsEmptyData(barsetting.isrealtime)) {
barsetting.isrealtime = true;
}

if (IsEmptyData(barsetting.zoomheight)) {
barsetting.zoomheight = 30;
}

var legend = "";
if (barsetting.islegend) {
var data = [];
for ( var i = 0; i < barsetting.textarry.length; i++) {
data.push(barsetting.textarry[i]);
}

legend = {
orient : barsetting.orienttype,
x : barsetting.legendalign,
data : data
};
}

var labelstyle = {
rotate : 0
};

if (barsetting.islongtext) {
labelstyle = {
rotate : -45,
textStyle : {
align : 'left',
baseline : 'middle',
fontSize : 12
}
};
}

var yAxisoption = "";
if (barsetting.yAxisarry == null || barsetting.yAxisarry.length == 1) {
yAxisoption = [ {
height : '50%',
type : 'value',
name : barsetting.yAxisarry[0].name,
splitLine : {
show : true
},
axisLabel : {
formatter : '{value} ' + barsetting.yAxisarry[0].text
}
} ];
} else if (barsetting.yAxisarry.length == 2) {
yAxisoption = [ {
height : '50%',
type : 'value',
name : barsetting.yAxisarry[0].name,
splitLine : {
show : true
},
axisLabel : {
formatter : '{value} ' + barsetting.yAxisarry[0].text
}
}, {
height : '50%',
type : 'value',
name : barsetting.yAxisarry[1].name,
splitLine

: {
show : false
},
axisLabel : {
formatter : '{value} ' + barsetting.yAxisarry[1].text
}
} ];
}

var xdata = [];

for ( var i = 0; i < ajaxdata.length; i++) {
xdata.push(ajaxdata[i][https://www.360docs.net/doc/d211241697.html,]);
}

var bardata = [];
var formatterstr = "{b} ";
for ( var ti = 0; ti < barsetting.textarry.length; ti++) {
bardata.push({
name : barsetting.textarry[ti],
type : barsetting.typearry[ti],
yAxisIndex : (barsetting.typearry[ti] == 'line'
&& barsetting.yAxisarry.length == 2 ? 1 : 0),
data : []
});

if (!IsEmptyData(barsetting.stackarry)
&& !IsEmptyData(barsetting.stackarry[ti])) {
bardata[ti].stack = barsetting.stackarry[ti];
}

formatterstr += "
{a"
+ ti
+ "} : {c"
+ ti
+ "} "
+ barsetting.yAxisarry[(barsetting.typearry[ti] == 'line'
&& barsetting.yAxisarry.length == 2 ? 1 : 0)].text;
}

for ( var i = 0; i < ajaxdata.length; i++) {
for ( var j = 0; j < barsetting.textarry.length; j++) {
bardata[j].data.push(ajaxdata[i][barsetting.valuearry[j]]);
}
}

var option = {
title : {
text : barsetting.titletext,
subtext : barsetting.subtitletext,
x : barsetting.titlealign
},
tooltip : {
show : barsetting.istooltip,
trigger : 'axis',
formatter : formatterstr
},
dataZoom : {
show : barsetting.isdataZoom,
realtime : barsetting.isrealtime,
start : barsetting.zoomstart,
end : barsetting.zoomend,
height : barsetting.zoomheight
},
toolbox : {
show : barsetting.istoolbox,
feature : {
mark : {
show : true
},
dataView : {
show : true,
readOnly : true
},
magicType : {
show : true,
type : [ 'bar', 'line', 'stack', 'tiled' ]
},
restore : {
show : true
},
saveAsImage : {
show : true
}
}
},
calculable : false,
legend : legend,
xAxis : [ {
// width: '50%',
type : 'category',
data : xdata,
axisLabel : labelstyle
} ],
yAxis : yAxisoption,
grid : {
width : barsetting.chartwidth,
height : barsetting.chartheight
},
series : bardata
};

if (barsetting.x) {
option.grid.x = barsetting.x;
}

if (barsetting.y) {
option.grid.y = barsetting.y;
}

var myChart1 = null;
require([ 'echarts', 'echarts/chart/bar', 'echarts/chart/line' ], function(
ec) {
myChart1 = ec.init(document.getElementById(divid));
myChart1.clear();
myChart1.setOption(option);
});
// var ecConfig = require('echarts/config');
return myChart1;
}

/**
* 环形图构建辅助方法
*
* @param divid
* 容器ID
* @param ajaxdata
* JSON数据
* @param piesetting
* 包含属性：name, value, seriesname, titletext, subtitletext, islegend,
* istoolbox, istooltip, titlealign.x, titlealign.y, orienttype
* @param name
* 名称 列名
* @param value

* 值 列名
* @param seriesname
* 提示框名称 列名
* @param titletext
* 主标题
* @param subtitletext
* 副标题
* @param islegend
* 是否显示示例，默认值true
* @param istoolbox
* 是否显示右上方的工具栏，默认值true
* @param istooltip
* 是否显示提示框，默认值true
* @param titlealign.x
* 标题位置，默认值为center
* @param titlealign.y
* 标题位置，默认值为center
* @param orienttype
* 图例的排序方式，默认为垂直显示(vertical),水平显示属性为horizontal
*/
function InitECharts_ring(divid, ajaxdata, piesetting) {
if (IsEmptyData(divid) || IsEmptyData(document.getElementById(divid))) {
alert("绑定的容器ID不存在");
return false;
}

if (IsEmptyData(ajaxdata)) {
for ( var i = 0; i < document.getElementById(divid).childNodes.length; i++) {
document.getElementById(divid).removeChild(
document.getElementById(divid).childNodes[i]);
}
return false;
}

if (IsEmptyData(piesetting)) {
alert("设置为空或不正确");
return false;
}

var dataStyle = {
normal : {
label : {
show : false
},
labelLine : {
show : false
}
}
};

var placeHolderStyle = {
normal : {
color : 'rgba(0,0,0,0)',
label : {
show : false
},
labelLine : {
show : false
}
},
emphasis : {
color : 'rgba(0,0,0,0)'
}
};

if (IsEmptyData(piesetting.titletext)) {
piesetting.titletext = "";
}

if (IsEmptyData(piesetting.subtitletext)) {
piesetting.subtitletext = "";
}

if (IsEmptyData(piesetting.islegend)) {
piesetting.islegend = true;
}

if (IsEmptyData(piesetting.legendalign)) {
piesetting.legendalign = 'left';
}

if (IsEmptyData(piesetting.istoolbox)) {
piesetting.istoolbox = true;
}

if (IsEmptyData(piesetting.istooltip)) {
piesetting.istooltip = true;
}

if (IsEmptyData(piesetting.orienttype)) {
piesetting.orienttype = "vertical";
}

var legend = "";

if (piesetting.islegend) {
var data = [];

for ( var i = 0; i < ajaxdata.length; i++) {
data.push(ajaxdata[i][https://www.360docs.net/doc/d211241697.html,]);
}

legend = {
orient : piesetting.orienttype,
x : document.getElementById(divid).offsetWidth / 2,
y : 45,
itemGap : 10,
data : data
};
}

var piedata = [];
var radiusdiff = parseInt(50 / ajaxdata.length);
var sumvalue = 0;
for ( var i = 0; i < ajaxdata.length; i++) {
sumvalue += (ajaxdata[i][piesetting.value] * 1);
}

for ( var i = 0; i < ajaxdata.length; i++) {
var tmpdata = {
name : '',
type : 'pie',
clockWise : false,
radius : [],
itemStyle : dataStyle,
data : []
};
https://www.360docs.net/doc/d211241697.html, = "";
if (!IsEmptyData(piesetting.seriesname)) {
https://www.360docs.net/doc/d211241697.html, = ajaxdata[i][piesetting.seriesname];
}
tmpdata.radiu

s = [ (30 + i * radiusdiff) + "%",
(30 + (i + 1) * radiusdiff) + "%" ];

tmpdata.data = [ {
value : ajaxdata[i][piesetting.value],
name : ajaxdata[i][https://www.360docs.net/doc/d211241697.html,]
}, {
value : sumvalue - (ajaxdata[i][piesetting.value] * 1),
name : '',
itemStyle : placeHolderStyle
} ];

piedata.push(tmpdata);
}

var tooltipformatter = "{a}
{b} : {c} ({d}%)";
if (IsEmptyData(piesetting.seriesname)) {
tooltipformatter = "{b} : {c} ({d}%)";
}

if (IsEmptyData(piesetting.titlealign.x)) {
piesetting.titlealign.x = "center";
}

if (IsEmptyData(piesetting.titlealign.y)) {
piesetting.titlealign.y = "center";
}

var option = {
title : {
text : piesetting.titletext,
subtext : piesetting.subtitletext,
x : piesetting.titlealign.x,
y : piesetting.titlealign.y,
itemGap : 10,
textStyle : {
color : 'rgba(30,144,255,0.8)',
fontFamily : '微软雅黑',
fontSize : 20,
fontWeight : 'bolder'
}
},
tooltip : {
show : piesetting.istooltip,
formatter : tooltipformatter
},
legend : legend,
toolbox : {
show : piesetting.istoolbox,
feature : {
mark : {
show : true
},
dataView : {
show : true,
readOnly : false
},
restore : {
show : true
},
saveAsImage : {
show : true
}
}
},
series : piedata
};

var myChart1 = null;
require([ 'echarts', 'echarts/chart/pie', 'echarts/chart/funnel' ],
function(ec) {
myChart1 = ec.init(document.getElementById(divid));
myChart1.clear();
myChart1.setOption(option);
});
return myChart1;
}

/**
* 地图构建辅助方法
*
* @param divid
* 容器ID
* @param ajaxdata
* JSON数据
* @param piesetting
* 包含属性：name, value, seriesname, titletext, subtitletext,
* tooltipunit, istoolbox, istooltip, titlealign.x, titlealign.y
* @param name
* 名称 列名
* @param value
* 值 列名
* @param seriesname
* 提示框名称 列名
* @param titletext
* 主标题
* @param subtitletext
* 副标题
* @param tooltipunit
* 提示框单位，默认为空（例如'个'）
* @param istoolbox
* 是否显示右上方的工具栏，默认值true
* @param istooltip
* 是否显示提示框，默认值true
* @param titlealign.x
* 标题位置，默认值为center
* @param titlealign.y
* 标题位置，默认值为center
*/
function InitECharts_map(divid, ajaxdata, mapsetting) {
if (IsEmptyData(mapsetting.mappath)) {
alert("地图数据路径不能为空");
return false;
}

if (IsEmptyData(divid) || IsEmptyData(document.getElementById(divid))) {
alert("绑定的容器ID不存在");
return false;
}

// if (IsEmptyData(ajaxdata)) {
// for ( var i = 0; i < document.getElementById(

divid).childNodes.length;
// i++) {
// document.getElementById(divid).removeChild(
// document.getElementById(divid).childNodes[i]);
// }
// return false;
// }

if (IsEmptyData(mapsetting.titletext)) {
mapsetting.titletext = "";
}

if (IsEmptyData(mapsetting.subtitletext)) {
mapsetting.subtitletext = "";
}

if (IsEmptyData(mapsetting.seriesname)) {
mapsetting.seriesname = "";
}

if (IsEmptyData(mapsetting.tooltipunit)) {
mapsetting.tooltipunit = "";
}

if (IsEmptyData(mapsetting.istoolbox)) {
mapsetting.istoolbox = true;
}

if (IsEmptyData(mapsetting.istooltip)) {
mapsetting.istooltip = true;
}

if (IsEmptyData(mapsetting.titlealign)) {
mapsetting.titlealign = {
x : 'center',
y : "top"
};
}

if (IsEmptyData(mapsetting.titlealign.x)) {
mapsetting.titlealign.x = 'center';
}

if (IsEmptyData(mapsetting.titlealign)) {
mapsetting.titlealign.y = 'top';
}

var tooltipformatter = "{b}
{c}";
if (!IsEmptyData(mapsetting.tooltipunit)) {
tooltipformatter += mapsetting.tooltipunit;
}

var seriesdata = [];

var maxvalue = 1;
var minvalue = 0;
if (!IsEmptyData(ajaxdata)) {
maxvalue = ajaxdata[0][mapsetting.value] * 1;
minvalue = ajaxdata[0][mapsetting.value] * 1;

for ( var i = 0; i < ajaxdata.length; i++) {
seriesdata.push({
value : ajaxdata[i][mapsetting.value],
name : ajaxdata[i][https://www.360docs.net/doc/d211241697.html,]
});

if ((ajaxdata[i][mapsetting.value] * 1) > maxvalue) {
maxvalue = ajaxdata[i][mapsetting.value] * 1;
}

if ((ajaxdata[i][mapsetting.value] * 1) < minvalue) {
minvalue = ajaxdata[i][mapsetting.value] * 1;
}
}
}

var option = {
title : {
text : mapsetting.titletext,
subtext : mapsetting.subtitletext,
x : mapsetting.titlealign.x,
y : mapsetting.titlealign.y
},
tooltip : {
show : mapsetting.istooltip,
trigger : 'item',
formatter : tooltipformatter
},
toolbox : {
show : mapsetting.istoolbox,
orient : 'vertical',
x : "right",
y : "top",
feature : {
mark : {
show : true
},
dataView : {
show : true,
readOnly : false
},
restore : {
show : true
},
saveAsImage : {
show : true
}
}
},
dataRange : {
min : minvalue,
max : maxvalue,
text : [ 'High', 'Low' ],
realtime : false,
calculable : true,
color : [ 'orangered', 'yellow', 'lightskyblue' ]
},
series : [ {
name : mapsetting.seriesname,
type : 'map',
mapType : 'view', // 自定义扩展图表类型
data : seriesdata
} ]
};

if (!IsEmptyData(mapsetting.itemStyle)) {
option.series[0].itemStyle = mapsetting.itemStyle;
}

var myChart1 = null;
require([ 'echarts', 'echarts/chart/map' ], function(ec) {
myChart1 = ec.init(document.getElementById(divid));

require('echarts/util/mapData/params').params.view = {
getGeoJson : function(callback

) {
$.getJSON(mapsetting.mappath, function(data) {
callback(data);
});
}
};
myChart1.setOption(option);
});

return myChart1;
}