FacetChart with DataSource

I follow this example
http://smartclient.com/#simpleChart

But I want the data to be retrieved from DataSource instead of javascript variable.

I change it to dataSource: chartData.

<isomorphic:loadDS ID="chartData" />

isc.FacetChart.create({
ID: "simpleChart",
facets: [{
id: "REGION",
title: "Region"
},{
id: "PRODUCT",
title: "Product"
}],
dataSource: chartData,
valueProperty: "SALES",
chartType: "Area",
title: "Sales by Product and Region" });

(Other parts of the program are not changed)

And the dataSource is


<DataSource
schema="VTTPC"
dbName="OracleDev"
tableName="chartData"
ID="chartData"
dataSourceVersion="1"
generatedBy="v9.1p_2014-07-18/EVAL Deployment 2014-07-18"
serverType="sql"
>
<fields>
<field sqlType="varchar" sqlLength="50" name="REGION" length="50" type="text"></field>
<field sqlType="varchar" sqlLength="50" name="PRODUCT" length="50" type="text"></field>
<field sqlType="decimal" sqlLength="6" name="SALES" type="integer"></field>
</fields>
</DataSource>

But there is no chart displayed.
Please help

Many thanks