echarts饼图如何自定义格式化扇区文字与百分比

echarts饼图若何自界说格局化扇区的显示文字,显示的数字主动加上百分比?是否需要在数据源入彀算好百分比呢?

东西/原料

  • echarts

方式/步调

  1. 1

    打开任一浏览器,进入echarts官网的实例界面,点击左侧的饼图菜单,再点击右边的【Referer of a website】饼图实例

  2. 2

    打开饼图实例后,可以看到左侧是设置装备摆设项,右侧是图形实例。将鼠标移到右侧图形上,就可以看到提醒信息中已经稀有字,还有百分比了,只是扇区的文字没稀有字和百分比

  3. 3

    细心不雅察左侧的设置装备摆设项,你会发现,series规模内的data数据中,并没有供给百分比的值

  4. 4

    那么,提醒信息中的百分比是若何呈现的呢?这个时辰就需要存眷option设置装备摆设项中的tooltip规模中的formatter信息,从这里可以看到,这个处所将提醒信息格局化显示了,这里带上了百分号

  5. 5

    若是要格局化扇区文字,是不是也可以参考tooltip中的格局化方式呢?在series的data前面添加如下的信息,formatter后面的内容完全利用tooltip中的formatter内容:

         label: { normal: { show: true, formatter: "{a} <br/>{b} : {c} ({d}%)" } }

  6. 6

    此时,不雅察右侧的图形,可以看到扇区的百分比已经有了,只不外换行符没有正常显示

  7. 7

    点窜第五步中的换行符就可以正常显示了,并且,想要自界说内容,都可以在formatter中填写

  • 发表于 2019-03-26 22:59
  • 阅读 ( 2984 )
  • 分类:其他类型

你可能感兴趣的文章

相关问题

0 条评论

请先 登录 后评论
admin
admin

0 篇文章

作家榜 »

  1. xiaonan123 189 文章
  2. 汤依妹儿 97 文章
  3. luogf229 46 文章
  4. jy02406749 45 文章
  5. 小凡 34 文章
  6. Daisy萌 32 文章
  7. 我的QQ3117863681 24 文章
  8. 华志健 23 文章

联系我们:uytrv@hotmail.com 问答工具