Dostosuj punkty danych w wykresach Treemap i Sunburst przy użyciu JavaScript

Wprowadzenie

Wśród innych typów wykresów PowerPoint znajdują się dwa typy „hierarchiczne” - Treemap i Sunburst (znany także jako Sunburst Graph, Sunburst Diagram, Radial Chart, Radial Graph lub Multi Level Pie Chart). Te wykresy wyświetlają hierarchiczne dane zorganizowane jako drzewo - od liści do wierzchołka gałęzi. Liście są definiowane przez punkty danych serii, a każdy kolejny zagnieżdżony poziom grupowania jest definiowany przez odpowiednią kategorię. Aspose.Slides for Node.js via Java umożliwia formatowanie punktów danych wykresu Sunburst i Treemap w JavaScript.

Poniżej znajduje się wykres Sunburst, w którym dane w kolumnie Series1 definiują węzły liści, natomiast pozostałe kolumny definiują hierarchiczne punkty danych:

todo:image_alt_text

Zacznijmy od dodania nowego wykresu Sunburst do prezentacji:

var pres = new aspose.slides.Presentation();
try {
    var chart = pres.getSlides().get_Item(0).getShapes().addChart(aspose.slides.ChartType.Sunburst, 100, 100, 450, 400);
    // ...
} finally {
    if (pres != null) {
        pres.dispose();
    }
}

Jeśli istnieje potrzeba formatowania punktów danych wykresu, powinniśmy użyć następujących:

ChartDataPointLevelsManager, ChartDataPointLevel klasy i ChartDataPoint.getDataPointLevels metoda zapewniają dostęp do formatowania punktów danych wykresów Treemap i Sunburst.
ChartDataPointLevelsManager jest używany do uzyskiwania dostępu do kategorii wielopoziomowych - reprezentuje kontener obiektów ChartDataPointLevel.
Zasadniczo jest to wrapper dla ChartCategoryLevelsManager z właściwościami dodanymi specjalnie dla punktów danych.
Klasa ChartDataPointLevel posiada dwie metody: getFormat i getDataLabel które zapewniają dostęp do odpowiednich ustawień.

Pokaż wartość punktu danych

Pokaż wartość punktu danych “Leaf 4”:

var dataPoints = chart.getChartData().getSeries().get_Item(0).getDataPoints();
dataPoints.get_Item(3).getDataPointLevels().get_Item(0).getLabel().getDataLabelFormat().setShowValue(true);

todo:image_alt_text

Ustaw etykietę i kolor punktu danych

Ustaw etykietę danych “Branch 1”, aby wyświetlała nazwę serii (“Series1”) zamiast nazwy kategorii. Następnie ustaw kolor tekstu na żółty:

var branch1Label = dataPoints.get_Item(0).getDataPointLevels().get_Item(0).getLabel();
branch1Label.getDataLabelFormat().setShowCategoryName(false);
branch1Label.getDataLabelFormat().setShowSeriesName(true);
branch1Label.getDataLabelFormat().getTextFormat().getPortionFormat().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.Solid));
branch1Label.getDataLabelFormat().getTextFormat().getPortionFormat().getFillFormat().getSolidFillColor().setColor(java.getStaticFieldValue("java.awt.Color", "YELLOW"));

todo:image_alt_text

Ustaw kolor gałęzi punktu danych

Zmień kolor gałęzi “Steam 4”:

var pres = new aspose.slides.Presentation();
try {
    var chart = pres.getSlides().get_Item(0).getShapes().addChart(aspose.slides.ChartType.Sunburst, 100, 100, 450, 400);
    var dataPoints = chart.getChartData().getSeries().get_Item(0).getDataPoints();
    var stem4branch = dataPoints.get_Item(9).getDataPointLevels().get_Item(1);
    stem4branch.getFormat().getFill().setFillType(java.newByte(aspose.slides.FillType.Solid));
    stem4branch.getFormat().getFill().getSolidFillColor().setColor(java.getStaticFieldValue("java.awt.Color", "RED"));
    pres.save("pres.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    if (pres != null) {
        pres.dispose();
    }
}

todo:image_alt_text

FAQ

Czy mogę zmienić kolejność (sortowanie) segmentów w wykresie Sunburst/Treemap?

Nie. PowerPoint sortuje segmenty automatycznie (zazwyczaj według wartości malejących, zgodnie z ruchem wskazówek zegara). Aspose.Slides odzwierciedla to zachowanie: nie możesz zmienić kolejności bezpośrednio; osiąga się to poprzez wstępne przetworzenie danych.

Jak motyw prezentacji wpływa na kolory segmentów i etykiet?

Kolory wykresu dziedziczą motyw/paletę prezentacji, chyba że wyraźnie ustawisz wypełnienia/czcionki. Aby uzyskać spójne wyniki, zastosuj stałe wypełnienia i formatowanie tekstu na wymaganych poziomach.

Czy eksport do PDF/PNG zachowa niestandardowe kolory gałęzi i ustawienia etykiet?

Tak. Podczas eksportu prezentacji ustawienia wykresu (wypełnienia, etykiety) są zachowywane w formatach wyjściowych, ponieważ Aspose.Slides renderuje wykres z zastosowanym formatowaniem.

Czy mogę obliczyć rzeczywiste współrzędne etykiety/elementu w celu umieszczenia własnej nakładki nad wykresem?

Tak. Po zwalidowaniu układu wykresu dostępne są rzeczywiste współrzędne X i Y dla elementów (na przykład dla DataLabel), co ułatwia precyzyjne pozycjonowanie nakładek.