Mapbender3 offers an app/console command to create different elements. You can generate general elements, buttons, elements for map-click or map-box events.
Please note: The new generated element contains only a skeleton and has to be modivied after generation.
The following example show the generation and modification of a map-click element.
There are some steps you have to follow on the way to your own element.
Find out more about the command with –help:
app/console mapbender:generate:element --help
Generate a new element with the following command:
app/console mapbender:generate:element --type "map-click" "Mapbender\CoreBundle" MapKlick mapbender/src
You will get a summary of actions
- Your element MapbenderCoreBundle\Element\MapKlick has been created.
- The following files have been created:
- PHP class (mapbender/src/Mapbender/CoreBundle/Element/MapKlick.php)
- jQuery widget (mapbender/src/Mapbender/CoreBundle/Resources/public/mapbender.element.mapklick.js)
You will find several functions in the php file. Change the return value of the functions getClassTitle() and getClassDescription().
public static function getClassTitle() {
return "MapKlick";
}
public static function getClassDescription() {
return "Generates an Url with the the mapklick coordinates added";
}
You can register an element by adding it to the function getElements() in the file /mapbender/src/Mapbender/CoreBundle/MapbenderCoreBundle.php
This will make the element available in the backend when you configure your application.
public function getElements()
{
return array(
'Mapbender\CoreBundle\Element\AboutDialog',
'Mapbender\CoreBundle\Element\ActivityIndicator',
'Mapbender\CoreBundle\Element\BaseSourceSwitcher',
'Mapbender\CoreBundle\Element\Button',
....
'Mapbender\CoreBundle\Element\MapKlick'
);
}
Create a new application and add your element to the new application. Note that the configuration for your generated element is done in YAML syntax. If you want to use the map-element as target you have to find out the id of the map-element (f.e. via firebug inspect).
When you generated a map-click element you get an event on click and an action. The action can be modified. Have a look in the JQuery widget file (mapbender/src/Mapbender/CoreBundle/Resources/public/mapbender.element.mapklick.js).
You will find the function _mapClickHandler() that determines the coordinates from the click event and passes them to the function _mapClickWorker(). The new generated element will show the coordinates of the click event in an alert box.
You can modify the action of the function _mapClickWorker().
_mapClickWorker: function(coordinates) {
alert('You clicked: ' +
coordinates.pixel.x + ' x ' + coordinates.pixel.y +
' (Pixel), which equals ' +
coordinates.world.x + ' x ' + coordinates.world.y +
' (World).');
}
Alternatively you could open a new window with an URL and add the coordinates as parameters. You can open OpenStreetMap and center to the coordinates of the click event.
http://www.openstreetmap.org/export#map=15/50.7311/7.0985
_mapClickWorker: function(coordinates) {
window.open('http://www.openstreetmap.org/export#map=15/' + coordinates.world.y + '/' + coordinates.world.x);
}