Markers ใน LeafletJS

Markers ใน LeafletJS คือไอคอนที่ใช้แสดงตำแหน่งบนแผนที่ Markers สามารถใช้แสดงตำแหน่งที่ตั้งของบริษัท ร้านอาหาร สถานที่ท่องเที่ยว หรือตำแหน่งอื่นๆ ที่คุณต้องการ

To add a marker to a Leaflet map, you can use the following steps:

  1. Create a new marker object using the L.marker() function.
  2. Pass the latitude and longitude of the marker to the L.marker() function.
  3. Add the marker object to the map using the map.addLayer() function.

For example, the following code adds a marker to the map at the coordinates 51.505, -0.09:

1
2
var marker = L.marker([51.505, -0.09]);
map.addLayer(marker);

You can also customize the marker by passing an options object to the L.marker() function. For example, the following code adds a marker with a custom icon:

1
2
3
4
var marker = L.marker([51.505, -0.09], {
icon: L.icon('https://example.com/marker.png')
});
map.addLayer(marker);

Markers can also be used to display popups when clicked. To do this, you can use the marker.bindPopup() function. For example, the following code adds a marker with a popup that displays the message “Hello, world!”:

1
2
var marker = L.marker([51.505, -0.09]).bindPopup('Hello, world!');
map.addLayer(marker);

Markers are a powerful tool for displaying data on Leaflet maps. By using markers, you can easily create maps that show the locations of important places, track the movement of objects, or visualize other spatial data.

Here are some examples of how markers can be used in Leaflet maps:

  • A map of restaurants with markers showing the location of each restaurant.
  • A map of tourist attractions with markers showing the location of each attraction.
  • A map of real estate listings with markers showing the location of each property.
  • A map of crime data with markers showing the location of each crime incident.
  • A map of traffic data with markers showing the location of traffic congestion.

Markers are a versatile tool that can be used to create a wide variety of Leaflet maps. By learning how to use markers, you can create maps that are informative, engaging, and useful.