Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
<link rel="stylesheet" href=""/>
<label for="latInput">Latitude</label>
<input id="latInput"/>
<label for="lngInput">Longitude</label>
<input id="lngInput"/>
<div id="map"></div>
<script src=""></script>
<script src=""></script>
function addMapPicker() {
var mapCenter = [22, 87];
var map ='map', {center : mapCenter, zoom : 3});
L.tileLayer('https://{s}{id}/{z}/{x}/{y}.png', {
maxZoom: 18,
attribution: 'Map data &copy; <a href="">OpenStreetMap</a> contributors, ' +
'<a href="">CC-BY-SA</a>, ' +
'Imagery © <a href="">Mapbox</a>',
id: '',
noWrap : true
var marker = L.marker(mapCenter).addTo(map);
var updateMarker = function(lat, lng) {
.setLatLng([lat, lng])
.bindPopup("Your location : " + marker.getLatLng().toString())
return false;
map.on('click', function(e) {
updateMarker(, e.latlng.lng);
var updateMarkerByInputs = function() {
return updateMarker( $('#latInput').val() , $('#lngInput').val());
$('#latInput').on('input', updateMarkerByInputs);
$('#lngInput').on('input', updateMarkerByInputs);
$(document).ready(function() {
input {
margin-bottom : 2px;
#map {
width : 600px;
height : 200px;
Copy link

tuytoosh commented Jul 15, 2019

Thanks for your good job, but it is not working in my case, for all requests for images of map, it returns following response:

message: "Tileset does not exist"

I checked out your JSFilldle code but it is no longer works...

Have you any suggestion for me?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment