I have an HTML document containing javascript to show google map. This html file works perfectly when executed alone.
I need to execute it in C# Chromium Browser, but I realised that my web page is returning blank because the javascript was not executed.
This is the HTML File:
<html>
<head>
<script type="text/javascript">
function initMap() {
let map;
var address = encodeURIComponent("8G5QVGFV+P9");
var req = new XMLHttpRequest();
req.open("GET","https://plus.codes/api?address=CCQCW%2B2F Gafsa&key=<myKEY>",false);
req.send(null);
var json_rep = JSON.parse(req.responseText);
const chicago = { lat: json_rep.plus_code.geometry.location.lat , lng: json_rep.plus_code.geometry.location.lng };
class CenterControl {
map_;
center_;
constructor(controlDiv, map, center) {
this.map_ = map;
goCenterUI.addEventListener("click", () => {
const currentCenter = this.center_;
this.map_.setCenter(currentCenter);
});
setCenterUI.addEventListener("click", () => {
const newCenter = this.map_.getCenter();
if (newCenter) {
this.center_ = newCenter;
}
});
}
}
map = new google.maps.Map(document.getElementById("map"), {
zoom: 12,
center: chicago,
});
map.controls[google.maps.ControlPosition.TOP_CENTER].push(centerControlDiv);
}
</script>
</head>
<body>
<div id="map" style="width: 100%; min-height: 100vh;"></div>
<script
src="https://maps.googleapis.com/maps/api/js?key=<myKEY>&callback=initMap&v=weekly"
defer
></script>
</body>
I have tried to load an html file without the script it works, the method I used is simple and is not working because the HTML is getting executed and shoen on the ChromiumBrowser But my JavaScript is not so it return black.
public void mapTest() {
var html = File.ReadAllText(@"C:\Users\Administrator\Desktop\newMap\theMap.html");
chromeBrowser.LoadHtml(html);
this.Controls.Add(chromeBrowser);
chromeBrowser.Dock = DockStyle.Left;
}
I took a look at this also but I could not manage to make it work:
2)https://github.com/cefsharp/CefSharp/wiki/General-Usage#when-can-i-start-executing-javascript
Thank you.