5
2

How can I create a multiple markers on openstreetmap? and how can I interact with them with ajax?

asked 12 Dec '10, 11:51

godard59's gravatar image

godard59
76124
accept rate: 0%

edited 24 Feb '11, 11:25

Pieren's gravatar image

Pieren
3.1k92863


You can't add multiple markers on the OpenStreetMap.org homepage. For point & click solutions you might like geocommmons, StaticMap, and others, but for more power and flexibility it's worth learning a few javascript tricks:

Check out: this multiple markers OpenLayers example

Do "view source" to see how it works, and feel free to copy it. Some things to note:

  • It uses the open source JavaScript library called OpenLayers (other 'slippy map' libraries are available)
  • The map is initialised with a basemap layer from the default OpenStreetMap tile server (other tileservers and alternative renderings of OpenStreetMap data are available)
  • It adds a 'Vector' layer, where the markers are defined.
  • It needs a marker image file placed in a 'img' folder alongside
  • It adds three markers. If you were adding more, you might want to do this by defining an array first, and then looping through this to call vectorLayer.addFeatures
  • As an exampe of event handling, it detects the event of selecting the marker, and calls 'createPopup'
link

answered 15 Dec '10, 14:39

Harry%20Wood's gravatar image

Harry Wood
4.9k144777
accept rate: 11%

Thank you all, Harry I saw OpenLayers library I Like the example of the three marker, but i need add more. Can you give me an example how to integrate an array in this code ?, Or there is an example on OpenLayers library?

(16 Dec '10, 09:44) godard59

How about you learn javascript or pay somebody to code it for you? Looping over an array in javascript is not really openstreetmap related.

(24 Feb '11, 18:12) petschge

This is not yet possible for the slippy map on the front page. But you can check out OpenLayers which is an open source javascript slippy map that you can deploy on your own site.

link

answered 12 Dec '10, 12:05

Gnonthgol's gravatar image

Gnonthgol
10.2k777158
accept rate: 14%

edited 15 Dec '10, 13:28

ChrisH's gravatar image

ChrisH
2.0k112535

The short answer is that we don't provide a mechanism to do that directly on the web site, but that doing so isn't hard at all if you have a little web development experience (which it seems you do). All you need to do is use OpenLayers and use OSM as your background layer.

Here's a URL of a talk I prepared for State of the Map US 2010 (but never got to present), which will take you through the basics of web development using OSM:

http://www.emacsen.net/osm/osm-web-tutorial.pdf

If you go through that presentation, you should hopefully have a good foundation on how to use OSM on your site.

link

answered 15 Dec '10, 11:49

emacsen's gravatar image

emacsen
1.1k1323
accept rate: 10%

Leaving aside the "ajax" bit, you may find that http://open.mapquest.com/ (or other country site) does what you want - it uses OSM data, has a slightly different rendering to OSM's mapnik, but does have a rudimentary "stick a marker here" logic.

link

answered 24 Feb '11, 14:44

SomeoneElse's gravatar image

SomeoneElse
5.2k1640108
accept rate: 11%

edited 24 Feb '11, 14:45

The map rendering Mapquest Open may be more familiar to people who are used to the Thomas Guide or AAA's maps who haven't ever seen Ordnance Survey.

(24 Feb '11, 17:03) Paul Johnson
Your answer
toggle preview

Follow this question

By Email:

Once you sign in you will be able to subscribe for any updates here

By RSS:

Answers

Answers and Comments

Markdown Basics

  • *italic* or _italic_
  • **bold** or __bold__
  • link:[text](http://url.com/ "title")
  • image?![alt text](/path/img.jpg "title")
  • numbered list: 1. Foo 2. Bar
  • to add a line break simply add two spaces to where you would like the new line to be.
  • basic HTML tags are also supported

Tags:

×17
×6
×2

Asked: 12 Dec '10, 11:51

Seen: 4,317 times

Last updated: 24 Feb '11, 18:12

powered by OSQA