Beim Liniendiagramm von echarts ändert sich die Eingabeaufforderung nach dem Klicken auf die Legende und es wird kein Fehler gemeldet. So schreiben Sie den Formatierer für Tooltips

Nachdem Sie auf die Legende geklickt haben, ändert sich das Eingabeaufforderungsfeld entsprechend und sowohl die Mehrfachauswahl als auch die Einzelauswahl reagieren auf die Änderungen. Die Bedeutung von tooptip liegt im Formatierer

        tooltip:{
                show:true,
                trigger:"axis",
                alwaysShowContent:true,
                triggerOn:"mousemove",
                textStyle:{
                    color:"#fff"
                },
                backgroundColor:'rgba(6,17,71,0.8)',
                borderColor:"#0E8BFF",
                borderWidth:2,
                // formatter:"{b}销售额<br/>{a0}:{c0}<br/>{a1}:{c1}<br/>{a2}:{c2}"
                formatter:function(params){
                    console.log(params,"params")
                    if(params.length==0){return}
                    let base=params[0].name+"销售额"+"<br/>"
                    for(let i=0;i<params.length;i++){
                        base=base+`<span style="display: inline-block;padding: 5px 5px 5px 0px;"><i style="display: inline-block;width: 10px;height: 10px;background:${params[i].color};border-radius: 50%;"></i>
                            </span>`+params[i].seriesName+": "+params[i].value+"<br/>"
                    }
                    return base                
                }

            },

Wenn Sie auf die Legende klicken, erhalten Sie das Array. Wenn der Titel das Array durchläuft, wird bei jedem Durchlaufen neuer Inhalt zum ursprünglichen Basistitel hinzugefügt und schließlich wird der Basistitelinhalt zurückgegeben. Daher reagiert die Eingabeaufforderung nach dem Klicken auf die Legende auf die Änderungen

Benutzerdefiniertes Eingabeaufforderungsfeld (tooltip.formatter) in echarts_echarts Tooltip-Formatteranpassung_still gewöhnlicher Blog-CSDN-Blog

Supongo que te gusta

Origin blog.csdn.net/Frank_colo/article/details/132888149
Recomendado
Clasificación