echarts 饼图配置

饼图

var myChart = echarts.init(document.getElementById("companyArea-chart"));var option = {tooltip: {trigger: "item",formatter: (params) => {// 定义样式  鼠标移入后的const tooltip_title = `font-size: 13px;color: \#333;font-weight:bold`;const tooltip_text = `font-size: 13px;color: \#666;margin-left:12px;`;// 是自己定义的处理函数const str = `${params.marker} <span style="${tooltip_title}">${params.name}</span><br/><span style="${tooltip_text}">企业数(个)：${params.data.Value}</span><br/> <span style="${tooltip_text}">补贴资金(万元)：${params.data.allSupportsFunds}</span>`;return str;},},legend: {width: 300,height: 200,left: "left",icon: "circle",itemWidth: 8,itemHeight: 8,itemGap: 10,//top: '16',//orient: 'vertical',//left: 'left',textStyle: {//fontSize: 14,//color: '#a0a8b9'},},series: [{name: "企业分布",center: ["50%", "60%"],type: "pie",radius: "50%",emphasis: {itemStyle: {shadowBlur: 10,shadowOffsetX: 0,shadowColor: "rgba(0, 0, 0, 0.5)",},},//可以定义label 进行提示的格式化label: {show: true,position: "outside",formatter:params=>{return  `{a|${params.name}}`},rich: {a: {//对应上面 formatter a 指定样式   return  `{a|${params.name}}`color: 'black',lineHeight: 22,align: 'center'},}},},],dataset: {dimensions: ["allSupportsFunds", "City"],source: data,},//color: ['#5470C6', '#91CC75', '#FAC858', '#EE6666', '#73C0DE'],};// 使用刚指定的配置项和数据显示charts。myChart.setOption(option);$(window).resize(function () {myChart.resize();});

echarts 饼图配置相关推荐

echarts饼图配置，及案例
echarts饼图配置,及案例案例(1): let option = {tooltip: { //提示框trigger: 'axis',formatter: '{a} <br/>{b} ...
Echarts饼图配置、样式详解二、图形中间文字、图形旁边文字上下显示等
效果图: 图形中间文字详细配置: https://www.echartsjs.com/option.html#graphic.elements-text 图形两边文字详细配置:https://www. ...
Echarts饼图配置、样式详解一、图线划分，板块间隙，文字边距样式等
效果图: 代码: <!DOCTYPE html> <html lang="en"> <head><meta charset="U ...
echarts 饼图基本配置
var option = {//饼图不需要配置x和y轴series: [{type: "pie",//指定图表类型为饼图data: pieData,// radius:" ...
ECharts饼图单位
最近在做ECharts饼图的时候,需要每项数据有自己的单位. 比如焦炉煤气的单位是(吨), 石油天然气的单位是(万立方米). 大概就是下图意思: 饼图option配置: tooltip : {trig ...
echarts饼图默认高亮/取消高亮
方法一在 echarts 饼图中,可以通过 emphasis 属性设置数据项被高亮时的样式.而如果您想要设置默认高亮的一个数据项,可以在该数据项的配置对象中使用 selected: true 属性来 ...
Echarts 饼图基本用法
目录 Echarts 饼图基本用法引入Echarts 创建饼图拓展引入Echarts 所介绍的两种方法,适用于使用Echarts的每种图. 在一般的html里引入Echarts,需要下载echa ...
echarts 饼图移动端_echarts饼图--数据交互
/*饼图鼠标经过时模块放大功能 */ // 路径配置 require.config({ paths: { echarts: 'js/' } }); // 使用 require( [ 'echarts ...
echart饼图标签重叠_怎么让ECharts饼图的label标签不重叠?
1.怎么让ECharts饼图的label标签不重叠? 使用ECharts饼图,如果有的项目占比很小,饼图所占空间也比较小的时候,会出现label标签重叠.标签被截断的情况(图1). 可以通过设置rad ...

echarts 饼图配置

饼图

echarts 饼图配置相关推荐

最新文章

热门文章