[英]How to use JavaScript libraries on QML
我在5.12.2上使用了一些帶有QML的javascript庫。 其中一些像Proj4JS一樣工作。 但是當使用帶有QML的geographiclib.js庫時,我會遇到錯誤。 如何將JavaScript庫導入QML?
main.qml:
import QtQuick 2.12
import QtQuick.Window 2.12
import "geographiclib.js" as MyGeo
Window {
visible: true
width: 640
height: 480
Component.onCompleted: {
var Geodesic = MyGeo.GeographicLib.Geodesic,
DMS = MyGeo.GeographicLib.DMS,
geod = Geodesic.WGS84;
var r = geod.Inverse(23, 22, 44, 29);
console.log("distance is: ", r.s12.toFixed(3) + " m")
}
}
錯誤:
qrc:/geographiclib.js:3081: ReferenceError: window is not defined
qrc:/main.qml:9: TypeError: Cannot read property 'Geodesic' of undefined
最簡單的方法是使GeographicLib
在全球范圍內可用:
在geographiclib.js文件的末尾,進行更改
window.GeographicLib = geo;
至
this.GeographicLib = geo;
然后你可以使用:
main.qml:
import QtQuick 2.12
import QtQuick.Window 2.12
import "geographiclib.js" as ThenItWillBeAvailableGlobally
Window {
visible: true
width: 640
height: 480
Component.onCompleted: {
var Geodesic = GeographicLib.Geodesic,
DMS = GeographicLib.DMS,
geod = Geodesic.WGS84;
var r = geod.Inverse(23, 22, 44, 29);
console.log("distance is: ", JSON.stringify(r))
}
}
導致:
qml: distance is: {"lat1":23,"lat2":44,"lon1":22,"lon2":29,"a12":21.754466225665134,"s12":2416081.7576307985,"azi1":13.736139413215236,"azi2":17.669059640534535}
您根本不想更改geographiclib.js文件,您可以使用添加全局窗口對象,例如:
window.js:
this.window = this;
然后使用:
import QtQuick 2.12
import QtQuick.Window 2.12
import "window.js" as ThenWindowWillBeAvailableGlobally
import "geographiclib.js" as ThenGeographicLibWillBeAvailableGlobally
Window {
visible: true
width: 640
height: 480
Component.onCompleted: {
var Geodesic = GeographicLib.Geodesic,
DMS = GeographicLib.DMS,
geod = Geodesic.WGS84;
var r = geod.Inverse(23, 22, 44, 29);
console.log("distance is: ", JSON.stringify(r))
}
}
如果您不想添加任何全局變量但是您很樂意編輯geographiclib.js文件,那么您可以將第68行移到文件的頂部:
var GeographicLib = {};
/*
* Geodesic routines from GeographicLib translated to JavaScript. See
* https://geographiclib.sourceforge.io/html/js/
並在文件結束時更改
} else {
/******** otherwise just pollute our global namespace ********/
window.GeographicLib = geo;
}
});
至
} else if (typeof window === 'object') {
/******** otherwise just pollute our global namespace ********/
window.GeographicLib = geo;
}
});
然后你的main.qml將正常工作。
您正在正確導入javascript文件。
來自doc :
QML提供了一個專為編寫QML應用程序而定制的JavaScript主機環境。 此環境與瀏覽器或服務器端JavaScript環境(如Node.js)提供的主機環境不同。 例如, QML不提供瀏覽器環境中常見的窗口對象或DOM API。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.