Warum zeigt das von zk erzeugte Diagrammbild nicht die y-Nummern an?

Question

Ich verwende ZK Framework in einem Projekt und ich muss dieses Diagramm erstellen und als ein Bild exportieren.

Das ist mein Diagramm:

Und das ist das Bild, das erzeugt wird:

Wie Sie sehen können, wann immer das Bild der Zahlen auf der Y-Achse erzeugt wird verschwinden und seine Bereich ändert sich auch. Weiß jemand, warum das passiert?

zul

<charts id="chrtConsumoFaturado" type="line" title="Gráfico dos últimos 12 meses" /> 

Controller

this.chrtConsumoFaturado.setHeight(222); 
this.chrtConsumoFaturado.getYAxis().setTitle("Valores"); 
this.chrtConsumoFaturado.getYAxis().getLabels().setFormat("R$ {value},00"); 
this.chrtConsumoFaturado.getExporting().getButtons().setEnabled(true); 

this.chrtConsumoFaturado.getTooltip().setValuePrefix("R$ "); 
this.chrtConsumoFaturado.getTooltip().setValueSuffix(",00"); 

this.chrtConsumoFaturado.setModel(new DefaultCategoryModel()); 

Einige Beobachtungen: die ausführende Taste aktiviert ist; die anderen Werte sind korrekt und ich verwende zk 7.0.0

Answer 1

Da Sie das Achsen-Tick-Intervall nicht angeben, exportiert zkcharts das Achsenticket entsprechend seiner Größe. Die Größe des exportierten Bilds ist jedoch nicht die gleiche wie die, die Sie auf einem Browserbildschirm sehen. Es ist 600px Breite * 400px Höhe, wenn Sie die Breite/Höhe eines Diagramms nicht angeben.

Da Sie die Breite nicht angeben, exportieren zk-Diagramme das Diagramm standardmäßig mit der Breite (600 px) mit Standardskalierung. Daher ist das Ergebnisbild 1200 * 444. Die Höhe 444 ist von der angegebenen Höhe multipliziert mit der Standardskalierung, die 222 * 2 ist.

Wenn Sie versuchen, die Größe Ihres Diagramms auf 600px in Ihrem Browser verkleinern, werden Sie sehen Der y-Achsen-Tick ändert sich ebenfalls. Und dieses geänderte Ergebnis entspricht Ihrem aktuellen Exportbild. Zum Beispiel:

Original auf dem Browser-Bildschirm, breite

schmaleren

Da die gedreht x Achsenbeschriftung mehr Platz der Höhe verbraucht, schrumpft die Höhe, so dass die Die Nummer der y-Achsenbeschriftung wird kleiner.

ich es denken, sind mindestens zwei Lösungen:

1. vergrössern Export Quelle Breite Satz Export Quelle Breite so nah wie Ihre Bildschirmbreite z.B.

chart.getExporting().setSourceWidth(1200);

https://api.highcharts.com/highcharts/exporting.sourceWidth

2. y-Achse Tickintervall erzwingen Tickintervall

chart.getYAxis().setTickInterval(20);