World Wind Web 系列(一):简单的案列

本教程是World Wind Web系列的第一篇,主要介绍World Wind Web的简单应用。后期随着项目的进展,会陆续更新。

步骤

1、引入worldwind.js
新建一个HTML页面,引入worldwind.js库

<script src="https://files.worldwind.arc.nasa.gov/artifactory/web/0.9.0/worldwind.min.js" type="text/javascript"></script>

2、在页面中加入一个 <canvas> 画布区域,并设置其区域的大小

<canvas id="canvasOne" width="1024" height="768">
    Your browser does not support HTML5 Canvas.
</canvas>

3、在JavaScript中渲染图层和控制层

window.onload = function () {
    // 为canvas 创建一个 WorldWindow
    var wwd = new WorldWind.WorldWindow("canvasOne");

    // 在WorldWindow的地球上添加一些图像层
    wwd.addLayer(new WorldWind.BMNGOneImageLayer());
    wwd.addLayer(new WorldWind.BMNGLandsatLayer());

    // 在WorldWindow 上添加一个指南针,一个坐标显示和一些视图控制器
    wwd.addLayer(new WorldWind.CompassLayer());
    wwd.addLayer(new WorldWind.CoordinatesDisplayLayer(wwd));
    wwd.addLayer(new WorldWind.ViewControlsLayer(wwd));
}

4、显示效果图
这里写图片描述

猜你喜欢

转载自blog.csdn.net/u012832088/article/details/79760270