ECharts圖表外掛禁止拖動合併
ECharts是一個圖表類JS外掛,地址:http://echarts.baidu.com/index.html
學習和使用起來都比較方便,最近使用的時候發現,ECharts雖然自帶的有拖拽合併的功能,但在某些時候,並不想讓生成的圖表具有這個功能,於是可以使用下列的方法來禁用:calculable : false,
在程式碼中展示為:
// echart
// 路徑配置
require.config({
paths: {
echarts: '../../script/build/dist'
}
});
// 使用
require(
[
'echarts',
'echarts/chart/pie',
],
function (ec) {
// 基於準備好的dom,初始化echarts圖表
var myChart = ec.init(document.getElementById('main'));
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)'
}
};
option = {
tooltip : {
trigger: 'item',
formatter: "{a} <br/>{b} : {c} ({d}%)"
},
legend: {
orient : 'horizontal',
itemGap:20,
y : 40,
textStyle:{"color": "auto",fontSize:14,},
data:['亂停亂放','暴露垃圾','黑車拉客','綠地不潔','小廣告','出店經營']
},
toolbox: {
show : false,
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,
series : [
{
name:'報事彙總',
type:'pie',
clockWise:false,
radius : '55%',
center: ['50%', '50%'],
itemStyle : dataStyle,
data:[
{value:1, name:'亂停亂放'},
{value:1, name:'暴露垃圾'},
{value:1, name:'黑車拉客'},
{value:1, name:'綠地不潔'},
{value:11, name:'小廣告'},
{value:1, name:'出店經營'}
]
}
]
};
// 為echarts物件載入資料
myChart.setOption(option);
}
);