MapGuide Open Source Users Workshop
Zak James, Paul Spencer
DM Solutions Group
MapGuide Web Studio
- Installing and Starting Web Studio
- Web Studio vs. Autodesk MapGuide Studio
- Tutorial - creating a map
- Extending Web Studio
- Getting involved
Installing and Starting Web Studio
- Where to find the application
- Compatible Browsers
- IE 6, Firefox 1.0+, Safari 1.3+, Opera 8+
- FDO and supported providers
- Launching Web Studio
Web Studio vs. Autodesk MapGuide Studio
Doesn’t have:
- Load Procedures
- full FDO provider support
- Web Layout or Print Layout editing
- symbol editing
- complete documentation
Web Studio vs. Autodesk MapGuide Studio (cont’d)
Does have:
- cross-platform support
- zero-step install
- managed vs. unmanaged feature sources
- relatively easy enhancement
- low, low price
Tutorial - Creating a new layer
Goals:
- Launch Web Studio and connect to a server
- Use the Site Administrator to load a mapguide package
- Upload data and create a feature source
- Create and style a layer
- Create a map
- Add the layer to an existing map
- Preview in a browser
Launching Web Studio
- load http://localhost:8008/mapguide/webstudio
- site should be http://localhost:8008/mapguide
- Administrator is username
- admin is password
- open a resource in the tree and try out the panel controls - drag and drop them and try maximize/minimize
Main Panel
- open a resource in the tree and try out the panel controls - drag and drop them and try maximize/minimize
- Library://Samples/Sheboygan/Maps/Sheboygan is a map layout that you can load and interact with in the preview panel (bottom-most panel on the right). Click the maximize control in the tab title bar to have the preview fill the available space.
Load a package file using the Site Admin interface
- choose Tools->Site Administrator from the menu bar and enter Administrator/admin as to authenticate
- choose ‘Manage Packages’ near the bottom of the list down the left side.
- scroll down to the ‘Load Package’ section and click the button next to gmap.mgp, then click the ‘Load Package’ icon
- after load has completed, close the site administrator using the tab close control (X at top right)
- choose ‘Refresh Site’ from the file menu then use the Site Explorer to view the new resources
Uploading data
- Select Library://gmap/Data in the Site Explorer
- Navigate to File->New->Feature Source from the menubar
- name your Feature Source “grid” in the dialog that appears and click OK
- once the dialog has closed, look in the object editor panel (top right) and locate the ‘upload data:’ browse button
- click the button and choose the file named C:webstudiogrid.sdf
- dismiss the file dialog and hit upload - grid.sdf should appear in the data files list
Creating a layer
- Select Library://gmap/Layers in the Site Explorer
- Navigate to File->New->Layer from the menubar
- name your Layer “Grid” in the dialog that appears and click OK
- in the Data section under Settings in the right hand panel, click on the ‘…’ button
- find the grid Feature Source you created and click Select
- if everything is ok, “Default:grid” should appear as the Feature Class and “Geometry” should appear as the Geometry
Styling the “Grid” layer
- In the style sub-panel, click on the leftmost icon to create a new scale range
- give the new range that appears a label for the legend (“Graticule”)
- double click in the style cell to style the range
Styling the “Grid” layer (cont’d)
- colours: [alpha, red, green, blue] as hex (e.g. FFFF0000 is red)
- In the line-style dialog, pick a line style and type in a colour (e.g. FFFF0000 is red)
- thickness of 0 is the thinnest line width possible
- click plus to add an additional pattern and colour
- you can change order and remove styles using the toolbar icons
- click ok when you’re done
- save the layer using File->Save or the main toolbar’s save icon
Creating the map
- navigate to Library://gmap/Maps/ in the Site Explorer and select it with a click.
- select File->New->Map
- in the settings panel, give it a name and pick epsg:42304 from the coordinates pop up
- enter the Initial View as shown in the image (LL: -2200000, -712631; UR: 3072800, 3840000)
- in the layers tab, select the Map group with a click then click Add Layer (green cross icon 2nd from left) and choose layers from Library://gmap/Layers for your map
- switch to the Drawing Order tab and move the layers around so they are drawn in a suitable order using the blue arrow icons
- save the map using File->Save or the main toolbar’s save icon
- you may need to close and reopen the map to get a preview - click the ‘x’ next to it in the Open Resources list to close. If that doesn’t work, reload the application - your work has been saved and you can reopen the map.
Adding the “Grid” layer to the map
- navigate to Library://gmap/Maps/gmap in the Site Explorer and double click to open it.
- select Map in the Layers panel - it should get a blue highlight
- click the icon with the green +, second from the left in the Groups toolbar
- in the resource dialog that appears, add your “grid” layer
- select the added layer (it will appear at the bottom) and adjust settings in the right pane as desired
- switch to the Drawing Order tab and move the grid layer up so it is drawn over all other layers using the blue arrow icons
- save the map using File->Save or the main toolbar’s save icon
- you may need to close and reopen the map to get a preview - click the ‘x’ next to it in the Open Resources list to close
Adding Rules to the “Park” layer
- Open Library://gmap/Layers/park
- in the Style panel, select the scale range then click on the ‘Add Rule’ icon (second from the left in the toolbar)
- set conditions for two rules (AREAKMSQ < 20000 for the first and AREAKMSQ > 20000 for the second) by clicking in the condition cell and entering expressions for each
- set different styles for each condition by clicking the style cell and editing the colours and patterns in the dialog
- save the layer and refresh the preview - you may need to close and reopen the layer to see a change or you can just zoom or pan instead.
- experiment with different scale ranges and conditions for the style
Viewing with the map viewer
- the modified map application can now be viewed from any browser without MapGuide software
- load http://localhost/mapguide/mapviewerajax/?WEBLAYOUT=Library://gmap/gmapLayout.WebLayout
- if prompted, Administrator is username, admin is password
- Web Studio can’t edit Web Layouts, but you can modify them using MapAgent
Save a package file using the Site Admin interface
- allows you to create a relocatable package of data and other resources
- doesn’t provide a copy of database content, just connection
- some issues with current raster provider
- choose Tools->Site Administrator from the menu bar and enter Administrator/admin as to authenticate
- choose ‘Manage Packages’ near the bottom of the list down the left side.
- scroll down to the ‘Make Package’ section and enter Library://gmap
- you can determine the Packages directory from the Site Admin settings and locate your new package in the Windows filesystem.
Extending Web Studio
- 100% javascript (almost)
- all communication with server is via web tier MapAgent api
- see http://localhost:8008/mapguide/mapagent
- MVC architecture
- add type (e.g. layout editor) support in 2 steps:
- model data type in WSFactory.js
- create an interface in WSView.js from layout in html files
Getting involved
- http://mapguide.osgeo.org
- mapguide-users mailing list
- svn access to latest features