Skip to content

MarkerEditor

offtherailz edited this page Apr 13, 2013 · 2 revisions

This is a plugin for edit,export and import marker configurations. Allows to edit GeoJson strings that can be loaded using the MapStore API.

For instance you can load the Markers calling the method

app.showMarkerGeoJSON("Layer_Name",geojson);

A running configuration of this plugin is already available calling the viewer with the configuration "markerEditor".

exemple:

localhost:8081/viewer?config=markerEditor

Configuration

The plugin is a panel, so it have to be placed in a custom Panel

"customPanels":[
    {
        "xtype":"panel",
        "id":"east", 
        "region": "east",
        "width": 550,
        "minWidth":550,
        "header":false,
        "split": true,
        "collapseMode": "mini",
        "layout":"fit"
    }
],
"customTools":[{
    "ptype": "gxp_marker_editor",
    "outputTarget":"east",
    "toggleGroup":"toolGroup"
}]

Marker configuration

The configuration object that contains markers is mapcomposer/app/static/data/markerconfigurations.js. is basically a json object containing 1 attribute called markers, an array of configuration objects:

{
       
	"markers":[
		{
			"name": "red",
			"icons":{
				"img":{
					"markerDefault": "theme/app/img/markers/default_information.png",
					"markerShadow": "theme/app/img/markers/markers_shadow.png",
					"markerSelected": "theme/app/img/markers/default_information.png",
					"markerHighlights": "theme/app/img/markers/default_information_highlights.png"
				},
				"markersDimensions":{
					"width": "21",
					"height": "25"
				},
				"shadowDimensions":{
					"width": "25",
					"height": "15"
				}                                    
			}
		} ...]
     ]
}
  • name: the name of the marker configuration (label to display in marker chooser
  • icons: configuration of the icon
    • img: the images for the marker
      • markerDefault: default icon image
      • markerShadow: shadow image
      • markerSelected: picture to use when the marker is selected
      • markerHighlights: picture to use when the marker is hightlighted
    • markersDimensions: size of the pictures for the marker (e.g {width:15,height:12})
    • shadowDimensions: size of the shadow
Clone this wiki locally