Next we're going to create text fields so we can enter data for the chart.
The user will select the number of text fields to enter, fill them in and
then click the Update chart button. The data labels and values will be transferred
to the chart.
I added the change handler function drawFields to the combo box in the property
inspector. After the user has selected the number of fields to add, the function
will generate the input boxes to the right of the chart to allow the data to be
entered. The function is shown below and is broken down
on the following pages.
function drawFields(component) {
//remove fields
removeTextFields();
//get number of fields
var NumFieldsDraw = component.getSelectedItem().data;
//text format
Tformat = new TextFormat();
Tformat.font = "Verdana";
Tformat.size = 10;
//label format
Lformat = new TextFormat();
Lformat.bold = true;
Lformat.font = "Verdana";
Lformat.size = 10;
//dynamically create text fields
for (var i=0; i < NumFieldsDraw; i++) {
//instanceName,depth,x,y,width,height
this.createTextField("ChartLabel"+i,i,380,90+(i*25),110,20);
this["ChartLabel"+i].text = "Enter Chart Label";
this["ChartLabel"+i].type = "input";
this["ChartLabel"+i].setTextFormat(Lformat);
this["ChartLabel"+i].setNewTextFormat(Lformat);
The variable NumFieldsDraw is the value of the Data Rows combo box and determines how
many text fields will be created. Creating the text fields is explained in
more detail on the next page.