TreeMapChart

Owned by Christian K
Last updated: Apr 15, 2020
3 min read

 

Inhalt:

  • FĂĽllen von Daten

  • Properties

Allgemein

Detaillierte Information finden Sie zusätzlich hier: https://developers.google.com/chart/interactive/docs/gallery/treemap

Beispiel: FĂĽllen der Daten

final ChartModel model = ChartModel.New() .addColumn(Column.New(Column.Type.STRING, idColumn)) .addColumn(Column.New(Column.Type.STRING, parentIdColumn)) .addColumn(Column.New(Column.Type.NUMBER, sizeColumn)); model.addRow("Shakespeare", null, 0); model.addRow("Comedies", "Shakespeare", null); model.addRow("Tragedies", "Shakespeare", null); model.addRow("Histories", "Shakespeare", null); model.addRow("As You Like It", "Comedies", null); model.addRow("Adam", "As You Like It", 10); model.addRow("Amiens", "As You Like It", 10); model.addRow("Audrey", "As You Like It", 12); model.addRow("Celia", "As You Like It", 108); model.addRow("Charles", "As You Like It", 8); model.addRow("Corin", "As You Like It", 24); model.addRow("Dennis", "As You Like It", 2); model.addRow("Duke", "As You Like It", 32); model.addRow("Frederick", "As You Like It", 20); model.addRow("Hymen", "As You Like It", 1); model.addRow("Jaques (lord)", "As You Like It", 57); model.addRow("Jaques (son)", "As You Like It", 2); model.addRow("Le Beau", "As You Like It", 14); model.addRow("Oliver", "As You Like It", 37); model.addRow("Orlando", "As You Like It", 120); model.addRow("Phebe", "As You Like It", 23); model.addRow("Rosalind", "As You Like It", 201); model.addRow("Silvius", "As You Like It", 24); model.addRow("Sir Oliver Martext", "As You Like It", 3); model.addRow("Touchstone", "As You Like It", 74); model.addRow("William", "As You Like It", 11); model.addRow("Comedy Of Errors", "Comedies", null); model.addRow("Adriana", "Comedy Of Errors", 79); model.addRow("Aegeon", "Comedy Of Errors", 17); model.addRow("Aemilia", "Comedy Of Errors", 16); model.addRow("Angelo", "Comedy Of Errors", 31); treeMapChart.setModel(model);

API und Methoden:

Properties

 

Properties

 

HeaderColor

The color of the header section for each node. Specify an HTML color value.

this.treeMapChart.setHeaderColor("#009688");

HeaderHeight

The height of the header section for each node, in pixels (can be zero).

this.tableChart.setHeaderHeight(15);

HeaderHighlightColor

The color of the header of a node being hovered over. Specify an HTML color value or null; if null this value will be headerColor lightened by 35%.

HighlightOnMouseOver

Determines if elements should show highlighted effects when moused over. If set to true, highlighting for different elements can be specified using the various highlightColor options.

HintOpacity

When maxPostDepth is greater than 1, causing nodes below the current depth to be shown, hintOpacity specifies how transparent it should be. It should be between 0 and 1; the higher the value, the fainter the node.

Max / Mid / MinColor

The color for a rectangle with a column 3 value of maxColorValue. Specify an HTML color value.

MaxDepth

The maximum number of node levels to show in the current view. Levels will be flattened into the current plane. If your tree has more levels than this, you will have to go up or down to see them. You can additionally see maxPostDepth levels below this as shaded rectangles within these nodes.

Max / Mid / MinHighlightColor

Sets the horizontal scrolling position, in pixels, if the table has horizontal scroll bars because you have set the width property. The table will open scrolled that many pixels past the leftmost column.

MaxPostDepth

How many levels of nodes beyond maxDepth to show in "hinted" fashion. Hinted nodes are shown as shaded rectangles within a node that is within the maxDepth limit.

NoColor

The color to use for a rectangle when a node has no value for column 3, and that node is a leaf (or contains only leaves). Specify an HTML color value.

NoHightlightColor

The color to use for a rectangle of "no" color when highlighted. Specify an HTML color value or null; if null, this will be the value of noColor lightened by 35%.

ShowScale

Whether or not to show a color gradient scale from minColor to maxColor along the top of the chart. Specify true to show the scale.

ShowTooltip

Whether to show tooltips.

 

XDEV Software Corp. - One Embarcadero Center, San Francisco, CA 94111, US
Copyright © 2015. XDEV Software Corp. All rights reserved.