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

Echarts之懸浮框中的數(shù)據(jù)排序問(wèn)題

 更新時(shí)間：2018年11月08日 08:55:29   作者：yezi-dream  
Echarts非常強(qiáng)大，配置也非常的多，有很多細(xì)節(jié)需要深入研究。這篇文章主要介紹了Echarts之懸浮框中的數(shù)據(jù)排序問(wèn)題,需要的朋友可以參考下

 Echarts非常強(qiáng)大，配置也非常的多，有很多細(xì)節(jié)需要深入研究。詳解一下關(guān)于懸浮框中的數(shù)據(jù)排序問(wèn)題

        懸浮框的數(shù)據(jù)排序默認(rèn)是根據(jù)series中的數(shù)據(jù)位置排序的，在我們想自定義排序時(shí)，在echarts的配置中有一個(gè)tooltip

        以下為數(shù)據(jù)降序的代碼：       

  tooltip = {
      trigger: 'axis',
      formatter: (params) => { // params為懸浮框上的全部數(shù)據(jù)
       const newParams = [];
       let paramsData = _.sortBy(params, 'value'); // 根據(jù)value值升序，_.sortBy為lodash的方法
       paramsData = _.reverse(paramsData); // 將數(shù)據(jù)降序，_.reverse為lodash的方法
       paramsData.forEach((p) => {
        // p.marker為對(duì)應(yīng)數(shù)據(jù)線的顏色的圓點(diǎn) 
        // p.seriesName為對(duì)應(yīng)數(shù)據(jù)的數(shù)據(jù)名稱
        // p.value為對(duì)應(yīng)數(shù)據(jù)的值
        const cont = p.marker + ' ' + p.seriesName + ': ' + p.value + '<br/>'; 
        newParams.push(cont);
       });
       return _.join(newParams, ''); // 這里是需要將數(shù)組轉(zhuǎn)化成字符串顯示，如果不轉(zhuǎn)化，每個(gè)數(shù)據(jù)前面都會(huì)出現(xiàn)一個(gè)逗號(hào)（，），_.join為lodash的方法
      }
     }

         主要是在formatter中設(shè)置，formatter可以接受兩種形式，字符串模版和回調(diào)函數(shù)

          回調(diào)函數(shù)可以根據(jù)需求相應(yīng)處理數(shù)據(jù)

         字符串模版可以自定義顯示形式

         字符串模版有多中，根據(jù)具體是什么圖，官網(wǎng)詳細(xì) 介紹了這幾種類型

          鏈接：http://www.echartsjs.com/option.html#tooltip.formatter

總結(jié)

以上所述是小編給大家介紹的Echarts之懸浮框中的數(shù)據(jù)排序問(wèn)題，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

相關(guān)文章

  • JS 刪除字符串最后一個(gè)字符的實(shí)現(xiàn)代碼

    JS 刪除字符串最后一個(gè)字符的實(shí)現(xiàn)代碼

    本篇文章主要是對(duì)JS刪除字符串最后一個(gè)字符的實(shí)現(xiàn)代碼進(jìn)行了介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助
    2014-02-02
  • JS實(shí)用的動(dòng)畫彈出層效果實(shí)例

    JS實(shí)用的動(dòng)畫彈出層效果實(shí)例

    這篇文章主要介紹了JS實(shí)用的動(dòng)畫彈出層效果,實(shí)例分析了javascript實(shí)現(xiàn)動(dòng)畫效果彈出層的方法,非常具有實(shí)用價(jià)值,需要的朋友可以參考下
    2015-05-05
  • 微信小程序用戶信息encryptedData詳解

    微信小程序用戶信息encryptedData詳解

    這篇文章主要為大家詳細(xì)介紹了微信小程序用戶信息encryptedData的相關(guān)資料，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
    2018-08-08
  • AJAX使用了UpdatePanel后無(wú)法使用alert彈出腳本

    AJAX使用了UpdatePanel后無(wú)法使用alert彈出腳本

    今天在做項(xiàng)目的時(shí)候發(fā)現(xiàn)個(gè)問(wèn)題。。使用UpdatePanel后alert腳本就要報(bào)錯(cuò)了。
    2010-04-04
  • ES6新特性七：數(shù)組的擴(kuò)充詳解

    ES6新特性七：數(shù)組的擴(kuò)充詳解

    這篇文章主要介紹了ES6新特性之?dāng)?shù)組的擴(kuò)充,結(jié)合實(shí)例形式分析了ES6數(shù)組操作的常見方法與相關(guān)使用技巧,需要的朋友可以參考下
    2017-04-04
  • js 代碼優(yōu)化點(diǎn)滴記錄

    js 代碼優(yōu)化點(diǎn)滴記錄

    這次項(xiàng)目中有一個(gè)功能，頻繁使用switch語(yǔ)句，代碼優(yōu)化的時(shí)候，將其換成數(shù)組
    2012-02-02
  • Javascript模擬加速運(yùn)動(dòng)與減速運(yùn)動(dòng)代碼分享

    Javascript模擬加速運(yùn)動(dòng)與減速運(yùn)動(dòng)代碼分享

    這篇文章主要介紹了Javascript加速運(yùn)動(dòng)與減速運(yùn)動(dòng)代碼分享,需要的朋友可以參考下
    2014-12-12
  • JS實(shí)現(xiàn)動(dòng)態(tài)給圖片添加邊框的方法

    JS實(shí)現(xiàn)動(dòng)態(tài)給圖片添加邊框的方法

    這篇文章主要介紹了JS實(shí)現(xiàn)動(dòng)態(tài)給圖片添加邊框的方法,涉及javascript操作圖片border的技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
    2015-04-04
  • 在JavaScript中如何使用宏詳解

    在JavaScript中如何使用宏詳解

    這篇文章主要給大家介紹了關(guān)于在JavaScript中如何使用宏的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
    2021-05-05
  • 一文詳解MySQL5.7與MySQL8之間的區(qū)別

    一文詳解MySQL5.7與MySQL8之間的區(qū)別

    MySQL作為最常用的開源關(guān)系型數(shù)據(jù)庫(kù)管理系統(tǒng)之一,一直在不斷發(fā)展和改進(jìn),其中,MySQL 5.7和MySQL 8是兩個(gè)備受關(guān)注的版本,它們之間存在一些關(guān)鍵的差異,本文將深入探討這兩個(gè)版本之間的主要差異,需要的朋友可以參考下
    2023-11-11

最新評(píng)論