title: JQuery: how to add a Leaflet marker with Coordinates from json
body: <p>I have a problem creating a marker on my leaflet map with coordinates from a json array.</p>
  
  <p>json example:</p>
  
  <blockquote>
    <p>{"id":"1","longitude":"8.1876","latitude":"50.1297","name":"Rhineland-Palatinate"}</p>
  </blockquote>
  
  <p>(background info: this comes from a PHP file that fetches data from a database which updates the current position every 10 seconds)</p>
  
  <p>The jquery code: It creates the map on my html and upon the "get_marker" click event it starts ajax which pulls a new json every 10 seconds from my .php file</p>
  
  <pre><code>$(document).ready(function () { 
              var map = L.map('map', {
                  center: [50.0231, 8.8849],
                  zoom: 9
              });
              L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
                  attribution: '&amp;copy; OpenStreetMap contributors'
              }).addTo(map);
  
  $("#get_marker").click(function(event){
     startajax();
    alert("get marker clicked");
   }); 
  
  $("#delete_marker").click(function(event){
     deletemarkers();
        alert("marker deleted");
   });
  
  function startajax () { 
    $.ajax({
    url: ('query_fetcharray.php'),
    data: {},
    type: 'POST',
    timeout: 10000,
    dataType: 'json',
    error: function() { 
      alert('Error, no Data received!');
    },
    success: drawmarker
    }) 
   };
  </code></pre>
  
  <p>everything above seems to be working fine
  The Problem is getting the actual marker on the map with the json coordinates. Nothing shows up on my map.</p>
  
  <p>I tried accessing the long and lat values with json.longitude/json.latitude and then converting these into float => then saved in JS variables: var longitude.
  I then put the varibles into the L.marker.</p>
  
  <p>my code:</p>
  
  <pre><code>function drawmarker (json) {    
          var longitude = parseFloat(json.longitude);
          var latitude = parseFloat(json.latitude);
  
          L.marker([longitude, latitude], {
                 clickable: true
            })
                 .bindPopup('hello')
                  .addTo(map);    
  };
  </code></pre>
  
  <p>The Problem seems to be the actual variables since hardcoding a set of coordinates into L.marker works fine.</p>