| Table of Contents |
|---|
Model: pieChartAM.zip
How to Make Your Own
- Start by dragging out AM|Charts from the components menu
- Resize it to the desired size
- Drag out another component nearby (in the example we are using a button)
- Select the AM|Chart and the other component and right click, and create group
- Delete the other component, so it is just the AM|Chart in the group
- Tag the group (ex. pieChartAM)
Next we will add the Program
...
| Code Block |
|---|
finstack.eval(point.query, function(data){
queryData=data.result.toObj();
queryData.forEach(function (item)
{
item.curValPretty = GetPrettyValue(item);
});
function handleZoom(ev){
var myPointId = ev.dataItem.dataContext.id;
top.app.ShowRelatedBubbles(myPointId,myPointId,false);
}
var chart = AmCharts.makeChart(Chart.view, {
"type": "pie",
"theme": "light",
"dataProvider": queryData,
"valueField": "curVal",
"titleField": "navName",
"balloonText": "[[navName]]: <b>[[curValPretty]]</b>",
"balloon":{
"fixedPosition":true
},
"export": {
"enabled": true
},
"listeners": [ {
"event": "clickSlice",
"method": handleZoom
}]
} );
}); |
Set the Query
Add string tag query (to group/model) with value set to the query
Call the tag query and set the value to the query
Using this Chart with Ractive
...