function viewOnMap(a,b,c,d){
  markers.forEach(m=>map.removeLayer(m));markers=[];
  if(routeLine){map.removeLayer(routeLine);routeLine=null}

  let greenIcon = L.divIcon({
    html:'<div style="background:#22c55e;width:22px;height:22px;border-radius:50%;border:3px solid white;box-shadow:0 0 5px black"></div>',
    iconSize:[22,22], iconAnchor:[11,11]
  });
  let redIcon = L.divIcon({
    html:'<div style="background:#d61f26;width:22px;height:22px;border-radius:50%;border:3px solid white;box-shadow:0 0 5px black"></div>',
    iconSize:[22,22], iconAnchor:[11,11]
  });

  let p=L.marker([a,b],{icon:greenIcon}).bindPopup('📍 Pickup').addTo(map);
  let q=L.marker([c,d],{icon:redIcon}).bindPopup('🏁 Drop').addTo(map);
  markers.push(p,q);
  map.fitBounds(L.latLngBounds([[a,b],[c,d]]).pad(0.3));
  fetch(`https://router.project-osrm.org/route/v1/driving/${b},${a};${d},${c}?overview=full&geometries=geojson`)
 .then(r=>r.json()).then(j=>{
    if(j.routes&&j.routes[0]){
      routeLine=L.polyline(j.routes[0].geometry.coordinates.map(x=>[x[1],x[0]]),{color:'#007bff',weight:5}).addTo(map);
      map.fitBounds(routeLine.getBounds())
    }
  });
  window.scrollTo(0,0)




  
   
  

  


  

<script defer data-domain="html.cafe" src="https://milkymouse.com/js/script.js"></script>