Взаимодействие JavaScript + html +qml
Добрый день, форумчане.
Возникла очередная проблема. Есть 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 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. Спасибо. |
vanished
|
vanished
|
Часовой пояс GMT +3, время: 08:17. |