Heim > Artikel > Web-Frontend > Teilen Sie die Stiländerungen von sechs Echarts-Statistikdiagrammen
Die Erstellung von Echarts-Grafiken ist relativ einfach, zitieren Sie einfach Javascript direkt. Es gibt drei Hauptgründe für die Verwendung dieser Bibliothek. Einer davon ist, dass diese Bibliothek ein Baidu-Projekt ist und aktualisiert wurde. Zweitens ist die Projektdokumentation dieser Bibliothek relativ detailliert, jeder Punkt wird klar erklärt und ist auf Chinesisch, was das Verständnis erleichtert. Der dritte Punkt ist, dass diese Bibliothek eine Vielzahl von Grafiken unterstützt und Grafiken direkt umgeschaltet werden können, was die Verwendung sehr komfortabel macht.
1: Ändern Sie die Farbe der Liniendiagrammleiste
series : [ { name : ‘SBP(收缩压)’, type : ‘line’, itemStyle : { normal : { lineStyle:{ color:’#f73d31’ } } }, data : y_data },
2: Ändern Sie das Titelfarbattribut
Ändern Sie die Haupttitelfarbe des Symbols in Rot, fügen Sie einfach textStyle hinzu im Titel: : {color: 'red' } kann
picture.png
title: { text: ‘平均耗时(分钟)’, textStyle: { color: ‘red’ }, },
3 sein: Hintergrundfarbe festlegen
var option={ backgroundColor:‘rgba(128, 128, 128, 0.1)’ //rgba设置透明度0.1 }
4: Die Seite so ändern, dass sie leer angezeigt wird
Wenn alle Daten normal sind und die Konsole keinen Fehler meldet, die Daten jedoch nicht auf der Seite angezeigt werden, ist eine feste Breite erforderlich.
5: Probleme bei der mobilen Anpassung, Anpassung an verschiedene Handy-Bildschirme
Wenn mehrere Diagramme vorhanden sind, fügen Sie nach var option = {} einfach einen Code wie diesen ein. Das Symbol ändert sich entsprechend Bildschirmgröße ändert sich.
window.onresize = function () { myChart1.resize(); myChart2.resize(); myChart3.resize(); }
6: Modifikation der xy-Achsen-Farbmodifikation, herzlich willkommen, sie zu lesen und daraus zu lernen!
Das obige ist der detaillierte Inhalt vonTeilen Sie die Stiländerungen von sechs Echarts-Statistikdiagrammen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!