| Version 4 (modified by tjcri, 6 years ago) |
|---|
MetaCarta's MapViewerService is a way for anyone to create a map, displaying markers with content which can be viewed in a popup. It supports a number of different URL paramaters to control the display of the map, and the MapViewerService can then be included in an iframe to display the data that is needed.
Parameters
- controls: controls selects the controls to be used on the Map. Defaults to "panzoom,mouse". The options are:
- panzoom -- the normal pan/zoom controls, good for small maps
- panzoombar -- The zoombar control, allows you to drag a slider to select a zoom level. Good for use on larger maps.
- mouse -- the mouse dragging controls: Without these, the map cannot be moved by clicking and dragging. This may be useful where you want a map to only show one area.
- center: Location for center of map. Format is "lat,lon", ex. center=42,-71
- zoom: zoom level, starting from the whole world at level 0. Integer value from 0->16. Ex: zoom=10
- data: URL of data file. Data file format described below.
Example query string:
?controls=panzoombar,mouse¢er=42,-71&zoom=10&data=http://www.openlayers.org/dev/examples/textfile.txt
Data File
The data file is powered by OpenLayers.Layer.Text?. This Layer creates markers and appropriate popups for files in a tab-seperate-values format. Microsoft Excel or OpenOffice Calc can export this file format.
The first row of the data file should be a header line, with the column names of the data. Each column should be delimited by a tab space. The possible columns are:
- lat: Latitude of the point where a marker is to be placed
- lon: Longitude of the point where a marker is to be placed
- iconURL: URL of marker icon to use.
- iconSize: Size of Icon to use.
- iconOffset: Where the top-left corner of the icon is to be placed relative to the latitude and longitude of the point.
- title: The text of the 'title' is placed inside an 'h2' marker inside a popup, which opens when the marker is clicked.
- description: The text of the 'description' is placed below the h2 in the popup. this can be plain text or HTML.
Example Datafile: (again Delimited by a tab between each column)
lat lon title description iconSize iconOffset icon 10 20 title description 21,25 -10,-25 http://www.openlayers.org/dev/img/marker.png
Creating MVS in an iframe
One you have created your MVS query string, you can create an iframe which contains the MVS page, which will display a map inside your page. Example code:
<iframe src="http://www.openlayers.org/viewer/?controls=panzoom,mouse¢er=42,-71&zoom=10&data=http://www.openlayers.org/dev/examples/textfile.txt" style="width:400px; height:400px"></iframe>
