Using SVG in ZEN

Hi Bob,

The databag API is what the Zen MVC uses internally, you shouldn't have to worry about it.

Here's some sample code modifying the ZENTest.SVGSpriteTest sample page to display data from a datacontroller:

ClientMethod initializeCanvas() [ Language = javascript ]
{
var canvas = zenPage.getComponentById('svgCanvas');
if ((!canvas) || !canvas.document) {
// ensure we don't execute code before the SVG document has been fully loaded
setTimeout('zenPage.initializeCanvas();',10);
return;
}
var inspector = this.getComponentById('objectInspector');
inspector.setCurrObject(canvas);
var controller = zenPage.getComponentById('spriteController');
controller.setModelId(1);
// create initial set of sprites & connectors
var sprite = new Array();
sprite[0] = canvas.createSprite('sprite',200,100);
sprite[0].setProperty('onclick','zenPage.selectSprite(zenThis);');
sprite[0].setProperty('caption', controller.getDataByName("sprite1"));
sprite[1] = canvas.createSprite('sprite',200,300);
sprite[1].setProperty('caption', controller.getDataByName("sprite2"));
sprite[2] = canvas.createSprite('sprite',400,100);
sprite[2].setProperty('caption', controller.getDataByName("sprite3"));
sprite[3] = canvas.createSprite('sprite',400,300);
sprite[3].setProperty('caption', controller.getDataByName("sprite4"));
var connect = canvas.createConnector('connector');
connect.addOutput(sprite[0],1);
//connect.addOutput(sprite[2],1);
connect.addInput(sprite[1],0);
//connect.addInput(sprite[3],0);
// turn off layout; turn on edit mode
canvas.setProperty('layout','');
canvas.setProperty('editMode','drag');
}