MarkerEditor

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",
    "zoomToMarkersExtent": true,
    "toggleGroup":"toolGroup",
    "saveState": false
}]

• zoomToMarkersExtent: Set this to true if you want to zoom to the markers extent
• saveState: Set to true if you want to maintain the markers state in the map configuration during the save procedure.

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