title: Changing values of html code using android
body: <p>I have an app that shows a map by using the following WebView and reading the HTML file from my assets folder as follows:</p>
  
  <pre><code>WebView myWebView = (WebView) findViewById(R.id.map);
  WebSettings webSettings = myWebView.getSettings();
  webSettings.setJavaScriptEnabled(true);
  myWebView.loadUrl("file:///android_asset/test.html");
  </code></pre>
  
  <p>And the HTML file is:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  
      &lt;title&gt;Quick Start - Leaflet&lt;/title&gt;
  
      &lt;meta charset="utf-8" /&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
  
      &lt;link rel="shortcut icon" type="image/x-icon" href="docs/images/favicon.ico" /&gt;
  
      &lt;link rel="stylesheet" href="https://unpkg.com/leaflet@1.4.0/dist/leaflet.css" integrity="sha512-puBpdR0798OZvTTbP4A8Ix/l+A4dHDD0DGqYW6RQ+9jxkRFclaxxQb/SJAWZfWAkuyeQUytO7+7N4QKrDh+drA==" crossorigin=""/&gt;
      &lt;script src="https://unpkg.com/leaflet@1.4.0/dist/leaflet.js" integrity="sha512-QVftwZFqvtRNi0ZyCtsznlKSWOStnDORoefr1enyq5mVL4tmKB3S/EnC3rRJcxCPavG10IcrVGSmPh6Qw5lwrg==" crossorigin=""&gt;&lt;/script&gt;
  
  
  
  &lt;/head&gt;
  &lt;body&gt;
  
  
  
  &lt;div id="mapid" style="width: 600px; height: 400px;"&gt;&lt;/div&gt;
  &lt;script&gt;
  
  var mymap = L.map('mapid').setView([Lat_Coordinate, Lon_Coordinate], 13);
  
      L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
      maxZoom: 18,
      attribution: 'Map data &amp;copy; &lt;a href="https://www.openstreetmap.org/"&gt;OpenStreetMap&lt;/a&gt; contributors, ' +
      '&lt;a href="https://creativecommons.org/licenses/by-sa/2.0/"&gt;CC-BY-SA&lt;/a&gt;, ' +
      'Imagery © &lt;a href="https://www.mapbox.com/"&gt;Mapbox&lt;/a&gt;',
      id: 'mapbox.streets'
      }).addTo(mymap);
  
  L.marker([Lat_Coordinate, Lon_Coordinate]).addTo(mymap)
      .bindPopup("&lt;b&gt;My Location&lt;/b&gt;").openPopup();
  
  L.circle([Lat_Coordinate, Lon_Coordinate], 5000, {
      color: 'red',
      fillColor: '#f03',
      fillOpacity: 0.5
  }).addTo(mymap);
  
  
  var popup = L.popup();
  
  &lt;/script&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Now, I have another code that uses google service to obtain the <code>Lat</code> and <code>Lon</code> coordinates of the user.
  The coordinates that I get are by using google service:</p>
  
  <pre><code>Latitude_Coor = location.getLatitude();
  Longitude_Coor = location.getLongitude();
  </code></pre>
  
  <p>Now, once I obtained them in my java code, I had like to insert them as values to the <code>HTML</code> code above wher it says <code>[Lat_Coordinate, Lon_Coordinate]</code>.</p>
  
  <p>How can I pass variables to HTML that in my <code>assets</code> folder?</p>
  
  <p>Thank you!</p>