快捷導(dǎo)航

pyecharts如何使用formatter回調(diào)函數(shù)的問(wèn)題

更新時(shí)間：2023年08月22日 15:18:15 作者：威斯登

這篇文章主要介紹了pyecharts如何使用formatter回調(diào)函數(shù)的問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教

pyecharts使用formatter回調(diào)函數(shù)

說(shuō)明

筆者使用的pyecharts版本是1.7.1，如果使用0.x版本不知道是否可行，因?yàn)閮蓚€(gè)版本代碼差異較大。

查看官方文檔發(fā)現(xiàn)，formatter參數(shù)支持字符串模板和回調(diào)函數(shù)兩種形式，其中字符串模板顯示有四個(gè)選項(xiàng)：{a}（系列名稱），（數(shù)據(jù)名稱），{c}（數(shù)值數(shù)組）, wppm3vysvbp（無(wú)）。

如下圖：

可以使用formatter=‘{c}’顯示數(shù)值，將其寫(xiě)入LabelOpts里，.add()代碼如下：

.add(   
        type_="effectScatter",
        series_name="",         
        data_pair=data,
        symbol_size=10,
        effect_opts=opts.EffectOpts(),
        label_opts=opts.LabelOpts(
            position="top",
            is_show=True,   #is_show是否顯示標(biāo)簽,點(diǎn)上面的內(nèi)容
            formatter='{c}',
            ), 
        itemstyle_opts=opts.ItemStyleOpts(),
        is_selected=True,  #選中圖例
    )

運(yùn)行嘗試一下，如圖：

發(fā)現(xiàn)每個(gè)散點(diǎn)上方顯示的的一個(gè)數(shù)組[經(jīng)度值，緯度值，數(shù)據(jù)值]，但是我只想要顯示數(shù)據(jù)值。

筆者查了很多帖子最后又查了官方文檔，發(fā)現(xiàn)可以使用回調(diào)函數(shù)解決。

代碼如下：首先要導(dǎo)入一個(gè)包：

from pyecharts.commons.utils import JsCode

然后為formatter參數(shù)寫(xiě)回調(diào)函數(shù)，.add()代碼如下：

.add(   
        type_="effectScatter",
        series_name="",         
        data_pair=data,        
        symbol_size=10,
        effect_opts=opts.EffectOpts(),
        label_opts=opts.LabelOpts(
            position="top",
            is_show=True,   #is_show是否顯示標(biāo)簽,點(diǎn)上面的內(nèi)容
            formatter=JsCode(                  #formatter為標(biāo)簽內(nèi)容格式器{a}：系列名;：數(shù)據(jù)名;{c}：數(shù)值數(shù)組也可以是回調(diào)函數(shù)    
                    """function(params) {
                    if ('value' in params.data) {
                        return params.data.value[2];
                    }
                }"""
                ),#顯示數(shù)據(jù)，可以去掉經(jīng)緯度只顯示數(shù)值return params.data.value[2] + ': ' + params.data.value[0]+': ' + params.data.value[1];
            ), 
        itemstyle_opts=opts.ItemStyleOpts(),
        is_selected=True,  #選中圖例
    )

通過(guò)params.data.value[i]可以顯示數(shù)組對(duì)應(yīng)的值，例如params.data.value[0]顯示經(jīng)度值；params.data.value[1]顯示緯度值；params.data.value[2]顯示數(shù)據(jù)值。

params.data.name可以顯示數(shù)據(jù)名。

運(yùn)行看一下，如圖：

可以看到，顯示的正是數(shù)據(jù)值。

用Jupyter Notebook來(lái)調(diào)試pyecharts中的formatter回調(diào)函數(shù)

在pyecharts中，各種Label等文字輸出可以用formatter進(jìn)行格式化。

但formatter那個(gè)寫(xiě)法看起來(lái)實(shí)在讓人費(fèi)解，還要各種圖形的命名規(guī)則不同。

而formatter 可以接收一個(gè)回調(diào)函數(shù)來(lái)格式化出書(shū)。我發(fā)現(xiàn)這個(gè)回調(diào)函數(shù)居然是直接寫(xiě)js代碼。既然它會(huì)直接渲染到前端的javascript中，那么我們可以直接加入console.log來(lái)輸出params，看看里面到底是什么。

console.log的輸出在哪里看？用jupyter notebook來(lái)運(yùn)行你的pyechart代碼，然后直接在瀏覽其中F12打開(kāi)開(kāi)發(fā)調(diào)試工具，就可以在console中看到輸出了。

當(dāng)然也不一定要用Jupyter notebook。pyecharts直接輸出html后，在瀏覽器中打開(kāi)，然后f12也行。不過(guò)用Jupyter notebook會(huì)方便很多，直接在瀏覽其中修改代碼，直接看結(jié)果，直接調(diào)試。

formatter=JsCode(
? ? ? ? ? ? ? ? ? ? """function(params) {
? ? ? ? ? ? ? ? ? ? ? ? console.log(params.data);
? ? ? ? ? ? ? ? ? ? ? ? return params.data[2];
? ? ? ? ? ? ? ? }"""
? ? ? ? ? ? ? ? )