Печать страницы - Qml + JavaScript[РЕШЕНО]

Добрый день, форумчане.
Возникла очередная проблема. Есть html-файл для вывода карты Google maps:

Код:

<!DOCTYPE html>
<html>
    <head>
        <title>Asynchronous Loading</title>
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
        <meta charset="utf-8">
        <style>
            html, body, #map-canvas
            {
                height: 100%;
                margin: 0px;
                padding: 0px;
            }
        </style>
        <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
        <script type="text/javascript" src="mapControl.js"></script>
    </head>
    <body>
        <div id="map-canvas"></div>
        <script>
            initMap();
        </script>
    </body>
</html>

Функция initMap определена в файле "mapControl.js" и все нормально, т.е. инициализация проходит и карта отображается. В файле js также есть функция setMarker которая устанавливает маркер по координатам latitude и longitude. И если вызов идет из html или же из функции initMap(), то маркер устанавливается, но если вызов происходит из файла main.qml, то пишет:

Код:

RefferenceError: google is not defined

Вот mapControl.js:

Код:

var map;
//----------------
function initMap()
{
    var latlng = new google.maps.LatLng(48.145938, 33.591423);

    var mapOptions =
    {
        center: latlng,
        zoom: 18,
        mapTypeId: google.maps.MapTypeId.SATELLITE,
        panControl: true,
        zoomControl: true,
        scaleControl: true
    };

    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
}
//--------------------------
function setMarker(lat, lng)
{
    var latlng = new google.maps.LatLng(lat, lng);

    var marker = new google.maps.Marker({
        position: latlng,
        map: map
    });
}

Вот main.qml:

Код:

import QtQuick 2.4
import QtQuick.Controls 1.3
import QtWebKit 3.0
import QtQuick.Layouts 1.1
import QtLocation 5.3
import QtPositioning 5.3
import "mapControl.js" as MAP
//---------------
ApplicationWindow
{
    id: applicationWindow1
    title: qsTr("Google Map")

    width: 640
    height: 480

    visible: true

    color: "white"

    WebView
    {
        id: mapview

        anchors.bottomMargin: 150
        anchors.fill: parent

        url: "index.html"
    }

    TextInput
    {
        id: textLatitude

        width: 80
        height: 20

        text: "Широта"

        font.family: "Arial"
        horizontalAlignment: Text.AlignHCenter
        anchors.left: layoutControlPanel.left
        anchors.leftMargin: 25
        anchors.top: layoutControlPanel.top
        anchors.topMargin: 25
        font.pixelSize: 14
    }

    TextInput
    {
        id: textLongitude

        y: 419
        width: 80
        height: 20

        text: "Долгота"
        horizontalAlignment: Text.AlignHCenter
        anchors.bottom: layoutControlPanel.bottom
        anchors.bottomMargin: 25
        anchors.left: layoutControlPanel.left
        anchors.leftMargin: 25
        font.pixelSize: 12
    }

    Button
    {
        id: buttonSetMarker

        y: 410

        text: qsTr("Установить маркер")
        anchors.verticalCenterOffset: 0
        anchors.verticalCenter: textLongitude.verticalCenter
        anchors.left: textLatitude.right
        anchors.leftMargin: 25

        onClicked:
        {
            MAP.setMarker(textLatitude.text, textLongitude.text);
        }
    }
}

Подскажите пожалуйста, как можно настроить взаимодействие между html-js-qml. Спасибо.

Решил данную проблему использованием QtWebKit.experimental 1.0, сделал так:

Код:

Button
    {
        id: buttonSetMarker

        y: 410

        text: qsTr("Установить маркер")
        anchors.verticalCenterOffset: 0
        anchors.verticalCenter: textLongitude.verticalCenter
        anchors.left: textLatitude.right
        anchors.leftMargin: 25

        onClicked:
        {
            mapview.experimental.evaluateJavaScript("var latlng = new google.maps.LatLng(" + textLatitude.text  + ", " + textLongitude.text + ");

            var marker = new google.maps.Marker({
                position: latlng,
                map: map
            });");
        }
    }

Это работает, только при использовании в консоль выводится, что это фича экспериментальная и может быть изменена или даже удалена.

Цитировать

WARNING: This project is using the experimental QML API extensions for QtWebKit and is therefore tied to a specific QtWebKit release.
WARNING: The experimental API will change from version to version, or even be removed. You have been warned!

Russian Qt Forum

Qt => Qt Quick => Тема начата: Larry от Август 16, 2015, 10:30