Unsolved Qt Webengine Crash and shows white screen
-
I am developing a Google map application in Qt that tracks user position and plots markers and connects the markers with polylines. After sometimes the page shows a white screen. I am using Qt 5.12.11 and Windows 10.
Observations:
- When the markers were added to the map, the web engine memory keeps increasing.
- Crash: When the white screen shows, the web engine is not running.
Here is the sample code.
QT += quick webengine CONFIG += c++11 qml_debug DEFINES += QT_DEPRECATED_WARNINGS SOURCES += \ main.cpp RESOURCES += qml.qrc
main.cpp
#include <QGuiApplication> #include <QQmlApplicationEngine> #include <QtWebEngine/QtWebEngine> int main(int argc, char *argv[]) { QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling); QCoreApplication::setAttribute(Qt::AA_ShareOpenGLContexts); QGuiApplication app(argc, argv); QtWebEngine::initialize(); QQmlApplicationEngine engine; const QUrl url(QStringLiteral("qrc:/res/main.qml")); QObject::connect(&engine, &QQmlApplicationEngine::objectCreated, &app, [url](QObject *obj, const QUrl &objUrl) { if (!obj && url == objUrl) QCoreApplication::exit(-1); }, Qt::QueuedConnection); engine.load(url); return app.exec(); }
main.qml
import QtQuick 2.5 import QtQuick.Window 2.2 import QtWebEngine 1.0 import QtWebChannel 1.0 Window { visible: true width: 640 height: 480 title: qsTr("Google Map") WebEngineView { id: view anchors.fill: parent url: "googleMaps.html" } }
googleMaps.html
<!-- Make sure to enter a valid Google Key in the Google Script at the bottom of this page --> <!-- Visit https://developers.google.com/maps/documentation/javascript/get-api-key --> <html> <head> <style type="text/css"> html, body { height: 100%; margin: 0; padding: 0; } #map { height: 100%; width:100%; margin:0; padding:0; } </style> </head> <body> <button onclick="findLocation(-22.834418, 14.862920)">click</button> <div id="map"></div> <script> var markersArray = []; setTimeout(() => { let mapUrl = document.createElement("script"); let url = "https://maps.googleapis.com/maps/api/js?key=<YOUR_API_KEY>&v=3&callback=initMap" mapUrl.setAttribute("src", url); mapUrl.setAttribute("async","true"); mapUrl.setAttribute("defer", "defer"); document.body.appendChild(mapUrl); }, 50); function initMap() { myPosition = new google.maps.LatLng(0,0) map = new google.maps.Map(document.getElementById('map'), { center:myPosition, streetViewControl: false, draggable: true, scrollwheel: true, panControl: true, zoom: 17, mapTypeId: 'satellite', disableDefaultUI: true, zoomControl:true, mapTypeControl:true, rotateControl: true, tilt:0 }) dotIcon = { type:'Symbol', path: google.maps.SymbolPath.CIRCLE, scale: 3, fillColor: '#196ffa', strokeColor: '#196ffa', fillOpacity: 1.0, strokeWeight: 0.5, zIndex:99, } latestDotIcon = { type:'Symbol', path: google.maps.SymbolPath.CIRCLE, scale: 3, fillColor: '#10ff03', strokeColor: '#10ff03', fillOpacity: 1.0, strokeWeight: 2 } addLine(); currentMarker = new google.maps.Marker({ position:new google.maps.LatLng(0,0), icon:latestDotIcon, zIndex:99, map: map }); } function addLine() { poly = new google.maps.Polyline({ strokeColor: "#000dff", strokeOpacity: 1.0, strokeWeight: 1, zIndex:99, }); poly.setMap(map); } function findLocation(latitude,longitude){ let latLngVal = new google.maps.LatLng(latitude,longitude); marker = new google.maps.Marker({ position: latLngVal, icon:dotIcon, map: map }); marker.setMap(map); map.setCenter(marker.getPosition()); path = poly.getPath(); path.push(latLngVal); changeLocation(latitude,longitude); currentMarker.setPosition(latLngVal); delete latLngVal; delete marker; } function changeLocation(latitude,longitude){ var lat = latitude+.01 var lon = longitude+.01 if(lat>=90) { lat=-90 } if(lon>=180) { lon=-180 } setTimeout(() => { findLocation(lat,lon); }, 200); } </script> </body> </html>
Note:- Replace your Google maps API key in "<YOUR_API_KEY>" in googleMaps.html to run the code.
Did I miss anything to configure?
How do avoid the crash and memory leak in the Qt Web engine? -
Can you enable QWebengine log and see what's hapening when white screen occurs.