Within the last weeks there have been several requests regarding the new WP OSM Plugin shortcode osm_map_v3 and the differences to osm_map. So it’s time for a more detailled answere which needs some background information. All mapping plugings are ususally structured like this:
- there are map data wich should be displayed (OpenStreetMap, Bin, GoogleMaps, …)
- there are software components to display map data (OpenLayers, Leaflet, GoogleAPI, …)
- there is additional functionality added by the mapping plugin (show geotagged posts, shortcode generator, …)
The responsibility for 1.) is handed over to blog admin / author, the maps differ a lot in the license and that’s way many people choose OpenStreetMap for commercial and non commercial sites.
The point 2.) is quite important for the compatibility of your map on different browsers / devices. A lot of mapping plugins integrate software components which are five years old or even older … especially in the last years this part changed a lot because of mobile devices. WP OSM Plugin V3.5.1 with argument osm_map_v3 integrates OpenLayers 3.10.1 which was released in October 2015.
The point 3.) is mainly the added value by the plugin development team.
WP OSM Plugin provides two shortcodes to integrate maps, it’s like a “two in one plugin”. The osm_map shortcode ist based on OpenLayers 2 technology (point 2.) which is not state of the art anymore but still works. The new osm_map_v3 uses a mapping software which is the state of the art OpenLayers 3 and was released 1 month ago.
osm_map_v3 is a new and seperate development and because of limitted resource, the maintenance os WP OSM Plugin is limitted to osm_map_v3. Also new features, like fullscreen map button <=> is only implemented in osm_map_v3!
osm_map_v3 focuses on mobile devices, performance and simplicity
The arguments to be used with osm_map_v3 changed compared to osm_map. Mostly the shortcode is autogenerated with the WP OSM Plugin shortcode generator when you edit the post, but if you want just manually change it, you might want to know the relation within the table at the end of the article.
A map with all geotagged posts has got this osm_map_v3 shortcode:
[*osm_map_v3 map_center="52.795,23.51" zoom="3" width="75%" height="300" tagged_type="post" marker_name="wpttemp-yellow.png" control="fullscreen" map_border="thin solid grey"]
Improvement needs your feedback
You should update your osm_map shortcode to osm_map_v3 shortcode to make sure your readers see want you want them to see – on different devices with different features and high performance.
For further improvements we want to know which shortcode you use – please leave a comment to this article with your shortcode.
WP OSM Plugin shortcode table:
| osm_map | osm_map_v3 | comment |
|---|---|---|
| lat | map_center | lat and lon are compined in one argument |
| lon | — | -“- |
| kml_file | file_list | filetype is recognized by osm plugin. |
| kml_file_list | file_list | -“- |
| gpx_file | file_list | -“- |
| gpx_file_list | file_list | -“- |
| control | control | not fully supported |
| kml_colour | file_color_list | color is automatically related to gpx or kml files |
| gpx_colour | file_color_list | -“- |
| gpx_colour_list | file_color_list | -“- |
| width | width | |
| height | height | |
| map_border | map_border | -“- |
| import | tagged_type | import and post_type is combined to one |
| post_type | — | -“- |
| zoom | zoom | |
| marker_name | marker_name | |
| type | type | -“- |
| zoom | zoom | -“- |
| map_border | map_border | -“- |
| marker | marker_latlon | -“- |
| marker_height | *** | not supported yet |
| marker_width | *** | not supported yet |
| marker_focus | *** | not supported yet |
| marker_routing | *** | not supported yet |
| import_osm_cat_excl_name | *** | not supported yet |
| import_osm_cat_incl_name | *** | not supported yet |
| import_osm_line_width | *** | not supported yet |
| import_osm_line_color | *** | not supported yet |
| import_osm_line_opacity | *** | not supported yet |
| theme | — | not supported anymore |
| marker_file | — | not supported anymore |
Thanks for your work, we use :
[osm_map lat="48.861" lon="2.439" zoom="14" width="900" height="900" import="osm_l" import_osm_cat_incl_name="comptoir" post_type="post"]
How can we have v3 and select one Category ?
see : http://peche-monnaie-locale.fr/carte-osm_map/
(the first map as been migrated in V3, but not the second one beacause it needs to reflect a single catégory caled ‘comptoirs’)
Solved ! The shortcode generator said : tagged_filter=”comptoir”
It also said type=”cyclemap”, that’s perfect, thanks Mika.
Hum . . . this doesn’t work, I got somme warnings and a blank map (no markers) :
[OSM-Plugin-Error]:No posts/pages with geotag found!
[OSM-Plugin-Error]:CustomField: OSM_geo_data
[OSM-Plugin-Error]:PostType: post
[OSM-Plugin-Error]:Tagged_Filter: “comptoir“
Warning: Invalid argument supplied for foreach() in /var/www/vhosts/peche-monnaie-locale.fr/httpdocs/wp-content/plugins/osm/osm-sc-ol3js.php on line 211
An idea ?
Thanks for your feedback 🙂
And now it works see http://peche-monnaie-locale.fr/carte-osm_map/
Another joke of copy/paste or my bad ? Nevermind I am very proud of your work, I can reject g**maps more easily now.
Hi Mika,
thanks for the great work!
I use the following shortcode:
[osm_map lat="-23.89414" lon="-46.77864" zoom="4" width="100%" height="1000" type="stamen_watercolor" theme="dark" marker_name="custom_logo.png" marker_height="62" marker_width="75" import="osm_l" import_osm_line_color="orange"]
On a test page I tried to adapt it to version 3 as follows:
[osm_map_v3 map_center="-23.89414,-46.77864" zoom="4" width="100%" height="1000" tagged_type="post" marker_name="mic_black_pinother_02.png" type="stamen_watercolor"]
However this brings up the following error, even though I have entries in the “OSM_geo_data” field in all my posts:
[OSM-Plugin-Error]:No posts/pages with geotag found!
Can you help me out where my error is caused?
Other questions of curiosity:
– When do you think to support the feature that draws a line between the markers in version 3?
– Do you think of integrating a layer switcher into version 3 to switch between stamen and osm/mapnik for example?
Thanks for your help! I hope I posted on the right site.
Viele Grüße,
Tobias
Hallo Tobias,
bitte erstelle eine Testseite in Deinem Blog mit zwei Karten:
[*osm_map_v3 map_center=”-23.89414,-46.77864″ zoom=”4″ width=”75%” height=”300″ tagged_type=”post” marker_name=”wpttemp-yellow.png” control=”fullscreen” map_border=”thin solid grey”]
und
[*osm_map_v3 map_center=”-23.89414,-46.77864″ zoom=”4″ width=”75%” height=”300″ tagged_type=”page” marker_name=”wpttemp-yellow.png” control=”fullscreen” map_border=”thin solid grey”]
und dann den link zur Seite hier posten.
Verbinden der posts und filter wird noch in diesem Jahr kommen.
LG, MiKa
Hi Mika,
danke für die schnelle Antwort!
Hier der Link zur Testseite: http://eloto.biz/ol3test/
Eigentlich sind alle meine Posts geotagged (siehe OL2 Map im Header), Seiten mit geotag habe ich nicht.
VG,
Tobias
Hallo Tobias,
wir werden Dir am Wochenende eine Version zum Testen senden … mit dem Ziel bis Ende kommender Woche ein neues Release inklusive Fix zu haben 🙂
Br, MiKa
Wao, besten Dank!
Hi Mika,
ich habe letzte Woche das Update auf die Plugin Version 3.5.3 durchgeführt, aber tagged_type funktioniert bei mir in v3 leider noch nicht. Kann ich irgendwie noch weiterhelfen?
Danke und Grüße,
Tobias
Hallo Tobias,
kann es sein, dass Du eine Formatierung in einem Shortcode hast? Beim Editor, wo man den Artikel schreibt, kann man zwischen Visuell und Text hin und her schalten. Einmal sieht man auch die ganzen HTML tags usw. Schalte mal in den Textmodus und kontrolliere ob der osm shortcode ohne tags inzwischen ist.
Br, MiKa
We use:
[*osm_map lat=”47.608″ long=”12.70″ zoom=”6″ width=”430″ height=”200″ control=”scaleline” map_border=”thin solid grey” theme=”dark” type=”basemap_at” marker_name=”wpttemp-yellow.png” import=”osm_l” post_type=”any”]
but it wil be changed to osm_map_v3.
Fotomobil-Project uses:
[*osm_map_v3 map_center=“52.795,23.51″ zoom=“3″ width=“75%“ height=“300″ tagged_type=“post“ marker_name=“wpttemp-yellow.png“]