ECharts——餅圖

myChart.setOption({
    series : [
        {
            name: '訪問來源',
            type: 'pie',
            radius: '55%',
            data:[
                {value:235, name:'視頻廣告'},
                {value:274, name:'聯盟廣告'},
                {value:310, name:'郵件營銷'},
                {value:335, name:'直接訪問'},
                {value:400, name:'搜索引擎'}
            ],
            //安格爾模式
            roseType: 'angle',
            itemStyle: {
                normal: {
                    // 陰影的大小
                    shadowBlur: 200,
                    // 陰影水平方向上的偏移
                    shadowOffsetX: 0,
                    // 陰影垂直方向上的偏移
                    shadowOffsetY: 0,
                    // 陰影顏色
                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                },
                //鼠標hover時顯示陰影效果
                emphasis: {
                    shadowBlur: 200,
                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                }
            }
        }
    ],
    backgroundColor:'#2c343c',
				textStyle:{
					color:'rgba(255,255,255,.3)'
				},
				lableLine:{
					series:{
						lineStyle:{
							color:'rgba(255,255,255,.3)'
						}
					}
				},
				itemStyle: {
				    series: {
				        // 設置扇形的顏色
				        color: '#c23531',
				        shadowBlur: 200,
				        shadowColor: 'rgba(0, 0, 0, 0.5)'
				    }
				},
				visualMap: {
				    // 不顯示 visualMap 組件,只用於明暗度的映射
				    show: false,
				    // 映射的最小值爲 80
				    min: 80,
				    // 映射的最大值爲 600
				    max: 600,
				    inRange: {
				        // 明暗度的範圍是 0 到 1
				        colorLightness: [0, 1]
				    }
})

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章