1. 程式人生 > >EChart 文字大小調整 餅狀圖為例

EChart 文字大小調整 餅狀圖為例

源碼 har enter 價格 alt style 圖片 legend 4.5

一、EChart圖中的文字調整(以餅圖為例)

技術分享圖片

技術分享圖片

二、源碼:

{
  "title": {
    "text": "",
    "subtext": "",
    "x": "center"
  },
  "tooltip": {
    "trigger": "item",
    "formatter": "{a} <br\/>{b} : {c}%",
  "textStyle": {
    "fontSize": 18
  }
},
  "legend": {
    "orient": "vertical",
    "left": "left",
    "data": ["", "使用場景", "活動", "適用人群", "品牌", "款式", "物流", "價格", "功能", "服務", "質量"],
  "textStyle": {
    "fontSize": 18
  }
},
  "toolbox": {
    "feature": {
      "dataView": {
        "show": true,
        "readOnly": false
  },
  "saveAsImage": {
    "show": true
    }
  }
},
  "series": [{
    "name": "",
    "type": "pie",
    "radius": ["0%", "100%"],
    "data": [{
      "name": "使用場景",
      "value": 0.23
       }, {
        "name": "活動",
        "value": 0.44
       }, {
        "name": "適用人群",
        "value": 0.83
       }, {
        "name": "品牌",
        "value": 1.09
       }, {
        "name": "款式",
        "value": 4.56
       }, {
        "name": "物流",
        "value": 7.56
       }, {
        "name": "價格",
        "value": 7.62
       }, {
        "name": "功能",
        "value": 17.03
       }, {
        "name": "服務",
        "value": 20.03
       }, {
        "name": "質量",
        "value": 40.6
    }],
    "label": {
      "normal": {
        "show": true,
        "textStyle": {
          "fontSize": 18
            }
          },
      "emphasis": {
        "show": true
        }
      },
    "lableLine": {
      "normal": {
        "show": true
        },
    "emphasis": {
      "show": true
      }
    }
  }]
}

EChart 文字大小調整 餅狀圖為例