從網上看了一些方法，通過寫一個函式，遍歷所有的資料，將為0的資料隱藏掉，我想在這個基礎上，讓資料不為0的專案顯示在扇區內，而不是通過折線顯示在扇區外，我寫了position: 'inside',但是不起作用，完整代碼如下，請高手指點一下。
<div id="sxpd1" style="width:250px;height: 250px;"></div>
<script type="text/javascript">
// 基于準備好的dom，初始化echarts實體
var myChart = echarts.init(document.getElementById('sxpd1'));
var option = {
tooltip : {
trigger: 'item',
formatter: "{a} <br/>{b} : {c} ({d}%)"
},
title: {
text: '某站點用戶訪問來源',
subtext: '純屬虛構',
x:'center'
},
legend: {
orient: 'vertical',
show:false,
left: 'left',
//這個為提示條，注意名稱要和data里的name一一對應
data: ['視頻廣告','聯盟廣告', '郵件營銷', '直接訪問',"搜索引擎","黑客"]
},
series : [
{
name: '訪問來源',
type: 'pie',
radius: '55%',
data:[
//使用該種方法記得要加上itemStyle屬性，不然會找不到show屬性報錯的
{value:335, name:'直接訪問',itemStyle:{
normal:{
label:{
show: true,
position: 'inside',
formatter: '{b}:{c} \n ({d}%)',
},
labelLine: {
show: true
}
}
}},
{value:310, name:'郵件營銷',itemStyle:{
normal:{
label:{
show: true,
position: 'inside',
formatter: '{b}:{c} \n ({d}%)',
},
labelLine: {
show: true
}
}
}},
{value:234, name:'聯盟廣告',itemStyle:{
normal:{
label:{
show: true,
position: 'inside',
formatter: '{b}:{c} \n ({d}%)',
},
labelLine: {
show: true
}
}
}},
{value:135, name:'視頻廣告',itemStyle:{
normal:{
label:{
show: true,
position: 'inside',
formatter: '{b}:{c} \n ({d}%)',
},
labelLine: {
show: true
}
}
}},
{value:1548, name:'搜索引擎',itemStyle:{
normal:{
label:{
show: true,
position: 'inside',
formatter: '{b}:{c} \n ({d}%)',
},
labelLine: {
show: true
}
}
}},
{value:0, name:'黑客',itemStyle:{
normal:{
label:{
show: true,
position: 'inside',
formatter: '{b}:{c} \n ({d}%)',
},
labelLine: {
show: true
}
}
}}
]
}
]
}
var opt = option.series[0];
lineHide(opt);
//資料為零時隱藏線段
function lineHide(opt) {
jQuery.each(opt.data, function (i, item) {
if (item.value == 0) {
item.itemStyle.normal.labelLine.show = false;
item.itemStyle.normal.label.show = false;
}
});
}
// 使用剛指定的配置項和資料顯示圖表。
myChart.setOption(option);
</script>
uj5u.com熱心網友回復：
為什么資料也會被隱藏掉 不是只隱藏文字個指示線嗎uj5u.com熱心網友回復：
判斷小于10 的只隱藏文字和指示線不隱藏資料 怎么弄啊 大佬轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/225232.html
標籤：JavaScript
上一篇：怎么做一個領取優惠券的微信小程式