ECharts 的 legend data怎么把value显示出来在后面?

作者&投稿:晨股 (若有异议请与网页底部的电邮联系)
Echarts关于饼图data中数据如何动态填充?~

var chart = eval('[ { "counts":3, "region":"东城区" }, { "counts":2, "region":"朝阳区" }, { "counts":5, "region":"海淀区" } ]');var length = chart.length;var arrays = new Array();for(var i = 0l i < length; i++){ arrays[i] = { value:chart['counts'][i], name:chart['region'][i] }}data:arrays纯手打,你试试

app.title = '饼图';option = {tooltip: {trigger: 'item',formatter: "{a} {b}: {c} ({d}%)"},legend: {orient: 'vertical',x: 'left',data:['直达','营销广告','搜索引擎','邮件营销','联盟广告','视频广告','百度','谷歌','必应','其他']},series: [{name:'访问来源',type:'pie',selectedMode: 'single',radius: [0, '80%'], label: {normal: {position: 'inner',formatter: "{b}: {c} ({d}%)"}},labelLine: {normal: {show: false}},data:[{value:335, name:'直达', selected:true},{value:679, name:'营销广告'},{value:1548, name:'搜索引擎'}]},]};

用 legend.formatter 自定义一下吧,用回调函数去拼接一下数值


网页链接



请问作者这个问题解决了吗?谢谢,我也遇到了同样的问题


兴庆区13674869219: echarts饼图的legend形状可以修改么 -
底常舒坦: 这个可以修改,用自定义的图片就可以修改默认的legend形状代码如下 legend: { orient: 'horizontal', // 'vertical' x: 'right', // 'center' | 'left' | {number}, y: 'top', // 'center' | 'bottom' | {number} backgroundColor: '#eee', borderColor: 'rgba(178,34,34,0.8)', ...

兴庆区13674869219: Echarts中一个图表可以定义两个legend图例吗 -
底常舒坦: legend: {data: '心率'} 可以有两个legend,但是只有最后一个legend起作用

兴庆区13674869219: 如何echarts的legend中,鼠标移过去后会出现数据展示的明细提示 -
底常舒坦: echarts的legend的selected属性默认都是true的,所以在echarts图表中所有的数据都会显示出来.echarts的legend属性将某个name设置为false时,那它默认的就不会显示了,需要手动点击legend才会显示那这个属性的设置需要通过下面的方式:varval1='语文';varval2='数学';varval3='英文';option.legend.selected[val1]=false;option.legend.selected[val2]=false;option.legend.selected[val3]=false;myChart.setOption(option);

兴庆区13674869219: ECharts中一个完整的图表包括哪些基本组件? -
底常舒坦: 6大公共组件1、Title标题2、tooltip提示3、toolbox工具框4、legend图例5、dataZoom区域缩放6、visualMap视觉映射组件

兴庆区13674869219: html - echarts的图例的图形的颜色怎么改变 -
底常舒坦: 在表格中插入自选图形后,打入文字后,再选中自选图形,按右键,点击衬入文字下方即可.

兴庆区13674869219: echarts 在html可以用 但是在jsp页面中不能使用 请问该怎么解决? -
底常舒坦: 不是引入问题 是JS区域里面的设置问题 JSP中使用ECHARTS跟WebStrom中使用是不一样的 在JSP执行的过程中是先走EL表达式这些, JSP里面的那些CSS样式不都是JAVA画出来的嘛 所以在JSP执行到最后走JS部分的时候就会无法执行,图形显示不出来,你搜索JSP使用ECHARTS例子 还有就是 你在JSP中使用ECHARTS 里面图形的横纵坐标值你没有办法从数据库里面弄到JSP的JS里面,因为你还得遍历出来放到那个JS var声明出来的数组中 ,就会导致只有一个背景,确实没有数据也就没有值,非常尴尬 .这是我个人的问题 不清楚你那边能行么 ,不过 JSP中使用ECHARTS是肯定可以的

兴庆区13674869219: html - echarts的图例的图形的颜色怎么改变 -
底常舒坦: <!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Title</title><script src="echarts-all.js"></script><style>.aaa{width: 500px;height: 500px;}</style></head><body><div class="aaa" id="annular"></div><script>var...

兴庆区13674869219: echarts 图例之间的间距怎么设置 -
底常舒坦: 1、打开echarts官方实例页面,点击第一个折线图. 2、进入页面后,可以看到数据比较少,所以横坐标文字全部都显示出来了. 3、修改左侧的option内容,在xAxis的data数组中再添加两行内容,同时,在series中添加对应数量的值. ...

兴庆区13674869219: 请问您的那个echarts geocoord赋动态的数值,是怎么解决的呢? -
底常舒坦: 由于在echarts的使用手册中说了 {Object} geoCoord (geoCoord是Object类型) ,所以不能用传统的字符串拼接或数组的方式赋值.在后台的controller中用Map<String, double[]> geocoordMap=new HashMap<String, double[]>();来存储地理经...

本站内容来自于网友发表,不代表本站立场,仅表示其个人看法,不对其真实性、正确性、有效性作任何的担保
相关事宜请发邮件给我们
© 星空见康网