如何在铯树脂中从外部加载KML/KMZ数据文件



我正在做一个react项目,我使用了resium库,它是铯库的react版本。在那里,我需要加载运行时从服务器下载的kml文件。这意味着我需要在运行时加载kml文件。

例如,客户端应用程序通过API调用从服务器接收一些kml数据文件,然后我需要将kml/KMZ文件数据显示到resium世界地图中。所以我需要从外部加载kml文件。我尝试了一些代码,但不起作用。你能检查一下我的代码,让我知道如何在标签外加载KML或KMZ文件吗。我可以成功地在标签中加载kml文件。但我需要加载标记之外的kml文件。请参考我的代码。

import './App.css';
import { hot } from "react-hot-loader/root";
import React, { createRef } from "react";
import { Viewer, KmlDataSource} from "resium";

class App extends React.Component {
constructor(props) {
super(props);
this.ref = createRef();
}
loadKmlFileExternal() {
if (this.ref.current && this.ref.current.cesiumElement) {
//I tried two code syntax but no lucky. 
<this.ref.current.cesiumElement>
<KmlDataSource data={process.env.PUBLIC_URL + "/kml/gdpPerCapita2008.kmz"} />;
</this.ref.current.cesiumElement>
//or
this.ref.current.cesiumElement.dataSources.add(KmlDataSource.load(process.env.PUBLIC_URL + "/kml/gdpPerCapita2008.kmz"));
}
}

render() {
let content = null;
content = (
<Viewer full ref={this.ref} >
<KmlDataSource data={process.env.PUBLIC_URL + "/kml/facilities/facilities.kml"} /> // This works, but I need to load outside from Viewer
</Viewer>
);
return (      
<div>
{content}
{this.loadKmlFileExternal()}
</div>
);
}
}
export default `hot(App);

实际上,您的API返回了什么?我认为你不需要API。你所需要的只是将你的KML文件上传到你的服务器并使用它的URL。

最新更新