Google Maps API dengan platform Qt

Sebelumnya, ini merupakan catatan pribadi saya. Jadi, kalau ada yang tidak suka, tidak boleh protes. Saya barus saja ngoprek bagaimana menggunakan Google API menggunakan QWebKit-nya Qt.

sumber awal dari : http://efforts.embedded.ufcg.edu.br/qt/?p=80

1. Setelah melakukan promosi QWebView ke Map. kita buat code Map.h dan Map.c seperti berikut ini.

//map.h

//

#ifndef HEADER_H

#define HEADER_H

#include <QWebView>

class QNetworkAccessManager;

class Map : public QWebView

{

Q_OBJECT

public:

Map(QWidget *parent=0);

public slots:

void replyFinished(QNetworkReply*);

void loadCoordinates();

void geoCode(QString);

void clearCoordinates();

signals:

void reloadMap();

private:

QNetworkAccessManager *manager;

QList coordinates;

int pendingRequests;

};

#endif

//
//map.c
//

#include "map.h"
#include "ui_showmap.h"
#include <QNetworkRequest>
#include <QNetworkAccessManager>
#include <QNetworkReply>
#include <QDomDocument>
#include <QDomElement>
#include <QWebFrame>
#include <QWebPage>
#include <QEventLoop>
#include <QApplication>
#include <math.h>

Map::Map(QWidget *parent) : QWebView(parent), pendingRequests(0)

{

manager = new QNetworkAccessManager(this);

connect(manager, SIGNAL(finished(QNetworkReply*)), this, SLOT(replyFinished(QNetworkReply*)));

connect(this,SIGNAL(reloadMap()), this,SLOT(loadCoordinates()));

// ternyata format ini tak bisa di windows

// harus http://www.blablas..../index.html yang mengandung script JS nya

// cara ini ternyata tidak bisa

this->load(QUrl("file:///index.html"));

}

void Map::geoCode(QString local)

{

clearCoordinates();

QString requestStr( tr("http://maps.google.com/maps/geo?q=%1&output=%2&key=%3")

.arg(local)

.arg("csv")

.arg("GOOGLE_MAPS_KEY") );

manager->get( QNetworkRequest(requestStr) );

++pendingRequests;

}

void Map::replyFinished(QNetworkReply *reply)

{

QString replyStr( reply->readAll() );

QStringList coordinateStrList = replyStr.split(",");

if( coordinateStrList.size() == 4)

{

QPointF coordinate( coordinateStrList[2].toFloat(),coordinateStrList[3].toFloat() );

coordinates << coordinate;

}

--pendingRequests;

if( pendingRequests<1 )

{

emit( reloadMap() );

}

}

void Map::loadCoordinates()

{

foreach(QPointF point ,coordinates)

{

this->page()->mainFrame()->evaluateJavaScript(

QString("Open(%1,%2)").arg(point.x()).arg(point.y()) );

}

}

void Map::clearCoordinates()

{

coordinates.clear();

}

2. isi dari file screen.h dan screen.c yang merupakan Widget utama

//
//screen.h
//

#ifndef SCREEN_H

#define SCREEN_H

#include "ui_showmap.h"

#include <QtGui>

#include <QWidget>

#include <QWebView>

#include <QStandardItemModel>

class MainScreen : public QWidget ,public Ui::Form

{

Q_OBJECT

public :

MainScreen(QWidget *parent=0);

public slots :

void on_button1_clicked();

void on_button2_clicked();

void on_button3_clicked();

void on_button4_clicked();

void on_button5_clicked();

};

#endif

//
// screen.c
//

#include "screen.h"
#include "ui_showmap.h"
#include <QVBoxLayout>
#include <QDir>
#include <QWebView>
#include <QHeaderView>
#include <QDebug>
#include <QWebFrame>
#include <QWebPage>
#include <QPointF>
#include <math.h>

MainScreen::MainScreen(QWidget *parent):QWidget(parent)

{

setupUi(this);

//map->load(QUrl("http://www.trolltech.com/"));

//sepertinya ini teknik jika load dilakukan tanpa dari server

// tapi dari lokal

// ...

// FIle index.html harus satu direktori dengan file executablenya

// => ternyata cara ini tidak bisa harus dari SERVER.

//map->load(QUrl("./index.html") ) ;

}

//BUTTONS

void MainScreen::on_button1_clicked()

{

map->clearCoordinates();

map->geoCode("Campina Grande");

}

void MainScreen::on_button2_clicked()

{

map->clearCoordinates();

map->geoCode("Recife");

}

void MainScreen::on_button3_clicked()

{

map->clearCoordinates();

map->geoCode("Manaus");

}

void MainScreen::on_button4_clicked()

{

map->clearCoordinates();

map->geoCode("Sao Paulo");

}

void MainScreen::on_button5_clicked()

{

map->clearCoordinates();

map->geoCode("Rio de Janeiro");

}

3. yang perlu diperhatikan disini adalah File Index.html atau file html apapun yang mengandung kode JS penyambung ke Google API nya harus diletakkan di Server tertentu punya kita.

misal, isi kode htmlnya...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>Google Maps JavaScript API Example</title>
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=GOOGLE_MAPS_KEY"
      type="text/javascript"></script>
   

    test doang
    <script type="text/javascript">

    var map;
 
    function initialize()
    {
          if (GBrowserIsCompatible())
          {
                map = new GMap2(document.getElementById("map"));
                map.setCenter( new GLatLng(0,0),1 );

          }
 
        }

   
    function Open(x,y)
    {
      map.setCenter( new GLatLng(x,y),13 );
    }

    </script>
     

  </head>
  <body onload="initialize()" onunload="GUnload()" topmargin="0" leftmargin="0">
    <div id="map" style="width: 341px; height: 271px"></div>
  </body>
</html>

file Html ini diletakkan di server http://www.alfanNLPIndonesia.org/googleAPI/index.html

lalu alamat ini digunakan untuk pengacuan di kode Qt seperti berikut:

this->load(QUrl("http://www.alfanNLPIndonesia.org/googleAPI/index.html"));

Insyaalloh, Kode diatas Jalan.....