Embed HTML5 Viewer with an existing html page
Hi all,
We have got a need to embed the HTML5 Viewer to our existing HTML pages.
I have tried to directly write html elements in the HTML5viewer code (say adding DIVs, Buttons and Spans, etc) but all elements I added just didn't show up. Actually I noticed they were up there but as soon as the map built up, the new added elements went disappeared.
For example in "Index.html":
<body>
<span>HELLO WORLD</SPAN> <!-- didn't show up --/>
<div data-region-name="ApplicationRegion" data-region-adapter="geocortex.framework.ui.MultiDivRegionAdapter"></div>
<input type="button" value="Click me" id="butClickMe"/> <!-- didn't show up --/>
</body>
It looks like the HTML Viewer has to be rendered as full page. But we really want to embed it into our existing web pages. Does the existing web page have to be in HTML5?
Could anyone please give me some ideas?
Thanks
Alex
-
Hi Alex,
The viewer comes with a number of different "shells". A Shell is basically a layout with named regions that components can be hosted in. There are currently three shells in the viewer package: Desktop, Tablet, and Handheld.
These shells perform layout and optimization based on the size of the browser window and thus are geared towards full page GIS applications.
If you're embedding the viewer, you can host the specific components you want by creating "regions" and using configuration to place your desired components in the appropriate regions. Typically when embedding a viewer, administrators will remove a bunch of unnecessary modules and UI components such as the banner, log, menu, and shell. The Administrator and Developer guide found in the HTML5 SDK package has more information about regions and configuration. Also, there is an SDK Samples folder in the same package that has a number of examples of embedding viewer components.
I suggest you open your viewer's configuration file and look at the different views and what regions they target. Remove anything you don't need (including the shell) and target regions you create yourself. For example, create a region in your existing page called "MyMapRegion" and target the MapView into it.
Hope this helps!
-Jason
0 -
Hi Jason,
Thanks for your clarification.
I will get started with playing around those regions and creating mine wherever necessary.
Cheers,
Alex
0
Bitte melden Sie sich an, um einen Kommentar zu hinterlassen.
Kommentare
2 Kommentare