Set XML As File
Overview
AnyGantt can accept gantt chart data as file XML settings.
In this tutorial this feature will be shown and described, we suppose that you have already studied library, or, at least Simple Gantt Chart Embedding tutorial.
Actually almost all samples use this method to load chart XML file before rendering, but is possible to change XML file at run-time. We will show this technique at the sample below.
Method | Parameters | Description | setXMLFile(xmlPath) Returns: null |
xmlPath: String - path to XML file | Sets chart data file path You may call this method before write() |
---|
Sample setting XML file to chart at run-time
For the sample below we've created several XML files with different settings, you can find them in xml sub folder of the sample. In the sample itself we will create Combo Box that will choose file and set it on item select event.
Launch the sample with Set XML File Path: Open the Sample
Open the folder with Set XML File Path: Open Folder With Sample
At first we create Combo list with files:
<select id="fileslist" name="fileslist" onclick="selectFile()">
<option value="./xml/datagrid_resources.xml">Resources Gantt Chart - datagrid_resources.xml</option>
<option value="./xml/datagrid_tasks.xml">Datagrid in Project Gantt Chart - datagrid_tasks.xml</option>
<option value="./xml/tasks_progress.xml">Progress in Project Gantt Chart - tasks_progress.xml</option>
<option value="./xml/titles.xml">Titles in Gantt Chart - titles.xml</option>
</select>
Then create new chart, as usual, with a default file loaded:
AnyChart.swfFile = './swf/AnyGantt.swf';
// Create new gantt chart
var chart = new AnyChart();
// Set width and height
chart.width = "100%"
chart.height= "100%"
// Set xml for the default chart
chart.setXMLFile('./xml/titles.xml');
// Write gantt chart to div with "chart" id.
chart.write("chart");
And the last step - define function that sets file to chart:
// select->option->value and set it to the chart
selectFile = function() {
var filePath = document.getElementById('files').fileslist.value;
chart.setXMLFile(filePath);
}
Here it is, gantt chart accepts different XML files at a run-time, you can use this feature to show your different charts when user chooses certain kind of report or something, if you will use dynamic script files instead of static XML files - you can pass some parameters that will configure chart data or layout.