noob question, Problem when add multiple marker

[Dwiki Putrandityo]

Hello,

I am completely new to Leaflet, now i am trying to display 2 kind of marker, first marker will display "<b>Hello world!</b><br />I am a popup." if user click it, the second marker will display "<b>Hello im a client </b>" if user click it.
At first run, it only display the second marker on map,



 but after zoom out the map, here is the result:



why there is duplicate country in map? the first marker appear in the first country
i want all marker display in one country.

here is the code

var map = L.map('map').setView([-6.17521, 466.82728], 13);

L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoiZHdpa2lwIiwiYSI6ImNpaGJydmF5MTB6M212MGtpODRwazdoZHMifQ.anGId5hZ99MTj_wv7lM47Q', {
            maxZoom: 13,
            attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
                '<a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
                'Imagery © <a href="http://mapbox.com">Mapbox</a>',
            id: 'mapbox.streets'
        }).addTo(map);

L.marker([-6.186193, 106.860289]).addTo(map)
    .bindPopup("<b>Hello world!</b><br />I am a popup.");
L.marker([-6.172531, 106.867282]).addTo(map)
    .bindPopup("<b>Hello world!</b><br />I am a popup.");
L.marker([-6.163567, 106.86796]).addTo(map)
    .bindPopup("<b>Hello world!</b><br />I am a popup.");
L.marker([-6.187583, 106.872753]).addTo(map)
    .bindPopup("<b>Hello world!</b><br />I am a popup.");
L.marker([-6.208379, 106.865782]).addTo(map)
    .bindPopup("<b>Hello world!</b><br />I am a popup.");
L.marker([-6.189273, 106.879278]).addTo(map)
    .bindPopup("<b>Hello world!</b><br />I am a popup.");
L.marker([-6.229472, 106.813541]).addTo(map)
    .bindPopup("<b>Hello world!</b><br />I am a popup.");
L.marker([-6.152827, 106.880576]).addTo(map)
    .bindPopup("<b>Hello world!</b><br />I am a popup.");
L.marker([-6.187779, 106.886531]).addTo(map)
    .bindPopup("<b>Hello world!</b><br />I am a popup.");
L.marker([-6.194763, 106.885736]).addTo(map)
    .bindPopup("<b>Hello world!</b><br />I am a popup.");

L.marker([-6.12469,466.83277]).addTo(map)
    .bindPopup("<b>Hello im a client </b>");
L.marker([-6.17162,466.90719]).addTo(map)
    .bindPopup("<b>Hello im a client </b>");
L.marker([-6.11974,466.75243]).addTo(map)
    .bindPopup("<b>Hello im a client </b>");
L.marker([-6.23118,466.83243]).addTo(map)
    .bindPopup("<b>Hello im a client </b>");
L.marker([-6.19876,466.79947]).addTo(map)
    .bindPopup("<b>Hello im a client </b>");
L.marker([-6.25799,467.01508]).addTo(map)
    .bindPopup("<b>Hello im a client </b>");

var popup = L.popup();
function onMapClick(e) {
   popup
       .setLatLng(e.latlng)
       .setContent("You clicked the map at " + e.latlng.toString())
       .openOn(map);
}

map.on('click', onMapClick)

thank you....
sorry for my bad english

[Dwiki Putrandityo]

sorry, this is the image i want to show you

http://ojekbdg.com/assets/img/maps.jpg

[ghybs]

Hi,

Please realize that the longitude coordinate is usually within [-180; +180] degrees range.
The world is made up of 360 longitude degrees, no more.

With Leaflet you can specify longitude outside this range (like you put some markers at about 467 degrees), but they will be placed on "adjacent copies of the world".
Those duplicate "copies" are there to cover this case.

You should simply wrap your coordinates (including your map.setView) so that they all fit within the "same world".
Simply remove 360 degrees to all your longitude coordinates that are about 467 degrees.
Of course there would probably be cleaner ways to achieve this.

If you put back all your features (markers) within the [-180; +180] degrees longitude range, then you could use a combination or all options map>maxBounds, map>maxZoom, map>worldCopyJump and tileLayer>noWrap to avoid seeing these world copies.
http://leafletjs.com/reference.html#map-options
http://leafletjs.com/reference.html#tilelayer-nowrap

See also: https://stackoverflow.com/questions/33522495/multiple-copies-of-the-world-when-zooming-out-in-worldmap-created-with-leaflet-i/33524196#33524196

[Dwiki Putrandityo]

Ah.....
Thank You!!