Send Data to JavaScript
Hide Data Editor
Show Data Editor
This sample is to show how to use the data editor.

[Data Editor]
showOnInit: whether or not to show the data editor with the chart.
useCloseButton: whether or not to show the close button at the top-right of the editor.
editorHeight: Sets the height of the editor.
borderColor: Sets the border color of the editor.
fontFamily: Sets the font name.
fontWeight: Sets the font weight. normal | bold
fontSize: Sets the font size.
color: Sets the font color.
headerColors: Sets the color of the header.
headerHeight: Sete the height of the header.
reverseRow: Whether or not to display data in the reverse order of the chart data.
showHeader: Whether or not to show the header.
textAlign: Sets the alignment of text in the editor. left | center | right
verticalAlign: Sets the vertical alignment of text in the cell. top | middle | bottom
styleName: Sets the style name of the data editor.
minColumnWidth: Sets the minimum size of the column.

●Script
chartVars += "&useDataEditor=true";

●Layout
<DataEditor showOnInit="true" formatter="{numFmt}" editorHeight="96" 
reverseRow="true" styleName="gridStyle" borderStyle="none"/>
<Style>
	.gridStyle {color:#378F8B;alternatingItemColors:#C5E3E3,#FFFFFF;headerColors:#88C3C3,#5C8484;
		headerStyleName:gridHeaderStyle;horizontalGridLines:false;horizontalGridLineColor:#5C8484;
		selectionColor:#ADC1C1;rollOverColor:#CC9999;fontWeight:bold;textDecoration:underline;
		fontSize:11;verticalAlign:middle;verticalGridLineColor:#5C8484
	}
	.gridHeaderStyle {
		color:#FFFFFF;
	}
</Style>