Problem with Google Maps in QT Widget

Hi,

I have currently compiled a QT app to display Google Maps inside QT widget but have issues with dragging across the map with the mouse as well as accessing the drawing tools displayed on the map. It seems like there is no interaction between the mouse buttons and the actual map inside the widget. The zoom button and the navigation control works but not the drawing tools (markers, circle, polygon etc.) and when I drag the mouse across, nothing happens.

Below is what the GUI looks like.

Attachment 7191

And here's the code.

________
GMap.cpp

Code:

#include <QtCore>
#include <QtGui>
 
#include "QGMap.h"
 
//------------------------------------------HTML FILE-------------------------------------------------
 
#define MAP_HTML "<html>    "\
                 "<head>    "\
                 "<script type=\"text/javascript\"    "\
                 "src=\"http://maps.googleapis.com/maps/api/js?sensor=false&libraries=drawing\"></script>    "\
                 "</script>    "\
                 "<script type=\"text/javascript\">    "\
                    "function initialize(lat, lng) {    "\
                        "var myOptions = {    "\
                            "zoom: 16,    "\
                            "center: new google.maps.LatLng(lat, lng),    "\
                            "mapTypeId: google.maps.MapTypeId.ROADMAP,    "\
                            "disableDefaultUI: false,    "\
                            "draggable: true,    "\
                            "panControl: true,    "\
                            "scaleControl: true,    "\
                            "zoomControl: true,    "\
                            "zoomControlOptions: {    "\
                                "style: google.maps.ZoomControlStyle.LARGE,    "\
                                "position: google.maps.ControlPosition.LEFT_CENTER    "\
                            "},    "\
                        "};    "\
                        "var map = new google.maps.Map(document.getElementById(\"map_canvas\"),    "\
                            "myOptions);     "\
                        "var drawingManager = new google.maps.drawing.DrawingManager({    "\
                            "drawingMode: google.maps.drawing.OverlayType.MARKER,    "\
                            "drawingControl: true,    "\
                            "drawingControlOptions: {    "\
                                "position: google.maps.ControlPosition.TOP_CENTER,    "\
                                "drawingModes: [google.maps.drawing.OverlayType.MARKER,    "\
                                    "google.maps.drawing.OverlayType.CIRCLE,    "\
                                    "google.maps.drawing.OverlayType.POLYGON,    "\
                                    "google.maps.drawing.OverlayType.POLYLINE,    "\
                                    "google.maps.drawing.OverlayType.RECTANGLE]    "\
                            "},    "\
                        "circleOptions: {    "\
                            "fillColor: '#FF000',    "\
                            "fillOpacity: 1,    "\
                            "strokeWeight: 5,    "\
                            "clickable: false,    "\
                            "zIndex: 1,    "\
                            "editable: true    "\
                        "}    "\
                        "});    "\
                        "drawingManager.setMap(map);    "\
                        "google.maps.event.addListener(map, 'click', function(event) {    "\
                            "placeMarker(event.latLng);    "\
                        "})    "\
                    "}    "\
                 "</script>    "\
                 "</head>    "\
                 "<body style=\"margin:0px; padding:0px;\">    "\
                 "<body onload=\"initialize()\">    "\
                    "<div id=\"map_canvas\" style=\"width:100%; height:100%\"></div>    "\
                 "</body>    "\
                 "</html>    "
 
//----------------------------------------END OF HTML FILE-------------------------------------------
 
 
 
GMaps::GMaps(QWidget *parent = 0): QWebView(parent)
{
        zoomPage = new QWebPage(this);
        connect(zoomPage, SIGNAL(repaintRequested(QRect)), SLOT(update()));
 
	QString content = MAP_HTML;
	QWebFrame *frame = page()->mainFrame();
	frame->setScrollBarPolicy(Qt::Vertical, Qt::ScrollBarAlwaysOff);
	frame->setScrollBarPolicy(Qt::Horizontal, Qt::ScrollBarAlwaysOff);
	frame->setHtml(content);
	QTimer::singleShot(1000, this, SLOT(triggerLoading()));
}
 
 
void GMaps::setCenter(qreal latitude, qreal longitude)
{
        QString code = "map.set_center(new google.maps.LatLng(%1, %2));";
        QWebFrame *frame = page()->mainFrame();
        frame->evaluateJavaScript(code.arg(latitude).arg(longitude));
        frame = zoomPage->mainFrame();
        frame->evaluateJavaScript(code.arg(latitude).arg(longitude));
}
 
void GMaps::triggerLoading() 
{
        QString code = "initialize(-27.5171, 152.8914)";
        QWebFrame *frame = page()->mainFrame();
        frame->evaluateJavaScript(code);
        frame = zoomPage->mainFrame();
        frame->evaluateJavaScript(code);
}
 
QGMap::QGMap(): QMainWindow(0)
{
        map = new GMaps(this);
        setCentralWidget(map);
}

______
GMap.h

Code:

#ifndef QGMap_H
#define QGMap_H
 
#include <QtWebKit>
#include <QMainWindow>
 
class GMaps: public QWebView
{
    Q_OBJECT
 
private:
    QWebPage *zoomPage;
//    QPointF CurrentPoint;
//    QPoint pressPos;
//    bool pressed;
 
public:
    GMaps(QWidget *parent);
    void setCenter(qreal latitude, qreal longitude);
 
private slots:
    void triggerLoading();
};
 
class QGMap: public QMainWindow
{
    Q_OBJECT
 
public:
    GMaps *map;
    QGMap();
}; 
 
 
#endif // QGMap_H

________
main.cpp

Code:

#include <QtGui/QApplication>
#include "QGMap.h"
 
int main(int argc, char **argv)
{
 
    QApplication app(argc, argv);
 
    QGMap MainWindow;
    MainWindow.setWindowTitle("Maps (powered by Google)");
    MainWindow.resize(800, 600);
    MainWindow.show();
 
    return app.exec();
}

Thanks.