zoukankan      html  css  js  c++  java
  • echarts定义饼状图的指向线内容

    定义饼状图的指向线内容

    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Document</title>
      <script src="https://cdn.staticfile.org/echarts/4.3.0/echarts.min.js"></script>
    </head>
    <body>
      <div style=" 600px;height: 400px"></div>
      <script>
          var mCharts = echarts.init(document.querySelector('div'))
          var pieData = [
            {
              name: '淘宝',
              value: 11231
            },
            {
              name: '京东',
              value: 22673
            },
            {
              name: '唯品会',
              value: 6123
            },
            {
              name: '聚美优品',
              value: 6700
            }
          ]
          var option = {
            series: [
              {
                type: 'pie',
                data: pieData,
                label: {
                  show: true,
                  formatter: function(arg) {
                    return arg.name + arg.value + '元
    ' + arg.percent + '%'
                  }
                },
                //第一个代表内圆半径,第二个代表外圆半径
                radius: ['50%', '70%']
              }
            ]
          }
          mCharts.setOption(option)
      </script>
    </body>
    </html>
    

    作者:明月人倚楼
    出处:https://www.cnblogs.com/IwishIcould/

    想问问题,打赏了卑微的博主,求求你备注一下的扣扣或者微信;这样我好联系你;(っ•̀ω•́)っ✎⁾⁾!

    如果觉得这篇文章对你有小小的帮助的话,记得在右下角点个“推荐”哦,或者关注博主,在此感谢!

    万水千山总是情,打赏5毛买辣条行不行,所以如果你心情还比较高兴,也是可以扫码打赏博主(っ•̀ω•́)っ✎⁾⁾!

    想问问题,打赏了卑微的博主,求求你备注一下的扣扣或者微信;这样我好联系你;(っ•̀ω•́)っ✎⁾⁾!

    支付宝
    微信
    本文版权归作者所有,欢迎转载,未经作者同意须保留此段声明,在文章页面明显位置给出原文连接
    如果文中有什么错误,欢迎指出。以免更多的人被误导。
  • 相关阅读:
    springcloud的turbine集成zookeeper
    点赞功能与redis的相遇
    kmeans聚类源代码
    java map.entry
    M2Eclipse:Maven Eclipse插件无法搜索远程库的解决方法
    Maven仓库
    java生成验证码
    手工利用Chrome浏览器“Javascript控制台”
    分类算法之朴素贝叶斯分类(Naive Bayesian classification)
    JavaWeb 服务启动时,在后台启动加载一个线程
  • 原文地址:https://www.cnblogs.com/IwishIcould/p/15161231.html
Copyright © 2011-2022 走看看