By Daniel Du
Flexible web layout(aka Fusion Viewer) provides 5 templates with different styles. You can choose your favorite when embedding fusion viewer into your web application. And you may also customize the existing template or even create your own flexible web layout template yourself, here is a hint for your reference.
Fusion Viewer is based on OpenLayers and JxLib, so you can use JxLib to create your layout. I will not cover all details of JxLib in this post, you can find more examples and documents in JixLib website. I will make very quick sample, to add a panel into Slate template to show you how to get started.
Before we start, this is a screen-shot what I have done:
Now, let’s do it. Open the slate template in text editor firstly, it locates at C:\Program Files\Autodesk\Autodesk Infrastructure Web Server Extension 2013\www\fusion\templates\mapguide\slate\index.html by default.
…
panel3 = new Jx.Panel({
label: OpenLayers.i18n('taskPaneTitle'),
collapse: true,
maximize: true,
contentId: 'TaskPane'
});
panel4 = new Jx.Panel({
label: 'mytest',
collapse : true,
maximize : true,
contentId : 'mytest',
content : 'your content here'
});
panelman = new Jx.PanelSet({
parent: splitter.elements[0],
panels: [panel1, panel2, panel3,panel4]
});
…
Please note the code in bold, which is added to create a new panel and add it to the template. Hope this helps and please refer to JxLib website if you want to know more. You may also want to check out this DevTV:
DevTV: MapGuide Fusion Technology Introduction
A self-paced video tutorial on how to build a web-based mapping application using the Fusion Viewer Technology and MapGuide Enterprise.
View Online | Download