So verwenden Sie Echarts, um dynamische Daten auf Knoten anzuzeigen und Eingabeaufforderungstext hinzuzufügen

Dieses Mal zeige ich Ihnen, wie Sie Echarts zum Anzeigen dynamischer Daten und zum Hinzufügen von Eingabeaufforderungstext zu Knoten verwenden Werfen wir einen Blick darauf. 1. Dies kann tatsächlich über Konfigurationselemente

Datenbindung

erfolgen. Sie können die Etikettenformatierung im ursprünglichen Konfigurationselement „itemStyle“ verwenden Der Code lautet wie folgt:

Der Code lautet wie folgt: Wenn Sie den Textanzeigestil ändern müssen, müssen Sie zusätzliche Elemente konfigurieren (z. B.

Schriftart). Stil

, Schriftstärke usw.) Vollständig

{
      name: '其中：少数民族',
      type: 'line',
      data: ssmz,
      markPoint : {
        data : [
          {type : 'max', name: '最大值'},
          {type : 'min', name: '最小值'}
        ]
      },
      itemStyle: {//节点数据显示
        normal: {
          label: {
            show: true,
            position: 'right',
            formatter: ssmz,//该值动态显示数据，若需固定的文本，则直接写入
          }
        }
      }
    },

2. Einige Kunden stellen andere Anforderungen. Während die Polylinie den höchsten und den niedrigsten Wert anzeigt, muss die Bedeutung der Polylinie vorhanden sein Am Ende der Polylinie hinzugefügt, kann es zu diesem Zeitpunkt auch über itemStyle vervollständigt werden, aber wenn der Formatierer Textaufforderungen formatiert, müssen Sie selbst eine Funktion schreiben, um die Formatierungsbeurteilung durchzuführen und dann

anzuzeigen.

Der Code lautet wie folgt:

{
      name: '合计',
      type: 'line',
      data: hj,
      markPoint : {
        data : [
          {type : 'max', name: '最大值'},
          {type : 'min', name: '最小值'}
        ],
      },
      itemStyle: {
        normal: {
          label: {
            show: true,
            position: 'right',//居右
            offset:[20,0],//横向往右20
            formatter: function(para){//格式化提示文本
            if(para.value == hj[hj.length-1]){
            return '合计';//显示文本
            }else{
            return '';
            }
            }
          }
        }
      }
    },

Ich glaube, Sie haben den Fall in diesem Artikel gelesen. Nachdem Sie die Methode gemeistert haben, achten Sie bitte auf andere verwandte Artikel auf der chinesischen PHP-Website, um weitere spannende Inhalte zu erhalten!

Empfohlene Lektüre:

Wie man mit Vue einen Countdown-Button implementiert

Wie man mit Vue eine Zwei schreibt -Wege-Datenbindung

Das obige ist der detaillierte Inhalt vonSo verwenden Sie Echarts, um dynamische Daten auf Knoten anzuzeigen und Eingabeaufforderungstext hinzuzufügen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!