Search code examples
javascriptqtgoogle-mapsqtwebkit

Google Maps marker doesn't receive click events

I'm experimenting with QtWebkit and Google Maps. The problem I've run into is calling C++ slots from the QWebView. The page displayed in the QWebView is a modified Google Maps example:

<!DOCTYPE html>
<html>
<head>
<title>Google Maps JavaScript API v3 Example: Event Simple</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="UTF-8">
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=true"></script>
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }
#map_canvas { height: 100% }
</style>
<script type="text/javascript">
  function initialize() {
    var myOptions = {
      zoom: 4,
      center: new google.maps.LatLng(-25.363882, 131.044922),
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    var map = new google.maps.Map(document.getElementById('map_canvas'),
        myOptions);

    var marker = new google.maps.Marker({
      position: map.getCenter(),
      map: map,
      title: 'test'
    });

    google.maps.event.addListener(marker, 'click', function() {
     //if (map.getZoom() == 8) {
     //   map.setZoom(4);
     // } else {
     //   map.setZoom(8);
     // }

      window.maiWi.showList();
    });
  }

  google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map_canvas" style="width:100%; height:100%"></div>
</body>
</html>

maiWi is the QMainWindow object which contains the slot showList() I want to call and which has been added to the Javascript window object.

If I add another element to the web page with the attribute onclick="maiWi.showList()", then the slot gets called and everything is well. However, I want to call the slot when the Maps marker gets clicked. The marker, however doesn't seem to respond to click events in QWebView. Even the commented-out example code doesn't work.

In Chrome, the event listener gets called and does what it's supposed to, but in QWebView nothing happens.

Solution

  • It turns out that I should turn off optimized rendering for map markers. When adding optimized:false to the marker declaration, then things start to work:

        var marker = new google.maps.Marker({
      position: map.getCenter(),
      map: map,
      optimized: false,
      title: 'test'
    });