欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

echarts圖例過(guò)多顯示問題解決方案

 更新時(shí)間：2023年11月09日 09:34:28   作者：前端攻程獅  
開發(fā)Echarts圖標(biāo)時(shí)經(jīng)常遇到數(shù)據(jù)量過(guò)多引起的圖例錯(cuò)亂,這個(gè)時(shí)候我們應(yīng)該如何處理?下面這篇文章主要給大家介紹了關(guān)于echarts圖例過(guò)多顯示問題的解決方案,需要的朋友可以參考下

問題描述

當(dāng)項(xiàng)目中使用echarts時(shí)，會(huì)遇到圖例過(guò)多的問題，面板大小有限，本身餅圖或者折線圖等已占據(jù)面板大部分空間，圖例過(guò)多時(shí)會(huì)使圖形和圖例產(chǎn)生壓蓋的情況，非常不美觀

原因分析：

翻閱echarts文檔時(shí)，我們發(fā)現(xiàn)有api可以供我們使用，當(dāng)圖例過(guò)多時(shí)，我們可以使用圖例分頁(yè)使用

解決方案：

代碼參考如下：

  legend: {
          textStyle: {
            color: "#ffffff",
            size:14,
          },
          type: 'scroll',
          pageIconColor: '#ffffff', //圖例分頁(yè)左右箭頭圖標(biāo)顏色
          pageTextStyle:{  
            color: '#ffffff', //圖例分頁(yè)頁(yè)碼的顏色設(shè)置
          },
          pageIconSize: 12,  //當(dāng)然就是按鈕的大小
          pageIconInactiveColor: '#7f7f7f',  // 禁用的按鈕顏色
     },
   xAxis: {
          type: 'category',
          boundaryGap: true,
          data: this.yearsList, //相關(guān)數(shù)據(jù)
          axisLabel: {
            // formatter: '{value}',
            textStyle: {
              color: "#ffffff",
              margin: 15
            },
            width: 70,
            overflow: 'breakAll', //圖例分頁(yè)設(shè)置
          },

    },

總結(jié) 

到此這篇關(guān)于echarts圖例過(guò)多顯示問題解決方案的文章就介紹到這了,更多相關(guān)echarts圖例過(guò)多顯示內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

相關(guān)文章

最新評(píng)論