openlayer 阴影查看

 

 

      在这种情况下,单个平铺的高程数据源用作输入。阴影浮雕在单个“图像”操作中计算。通过设置  operationType: 'image' 栅格源,使用 ImageData 每个输入源的对象调用操作。还使用通用 data 对象调用操作。在此示例中,来自上述输入的太阳高程和方位角数据将分配给此 data 对象,并在着色操作中访问。着色操作返回一个 ImageData  对象数组。当光栅源由图像层使用时, ImageData 管道中最后一个操作返回的第一个 对象用于渲染。此示例使用a  ol/source/Raster 生成基于其他源的数据。栅格源接受任意数量的输入源(基于图块或图像),并对输入数据运行操作管道。最终操作的返回用作输出源的数据。

<!DOCTYPE html><html>

  <head>

    <title>Shaded Relief</title>

    <link rel="stylesheet" href="https://openlayers.org/en/v5.1.3/css/ol.css" type="text/css">

    <!-- The line below is only needed for old environments like Internet Explorer and Android 4.x -->

    <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL"></script>

 

    <style>

      table.controls td {

        text-align: center;

        padding: 2px 5px;

      }

    </style>

  </head>

  <body>

    <div id="map" class="map"></div>

    <table class="controls">

      <tr>

        <td>vertical exaggeration: <span id="vertOut"></span>x</td>

        <td><input id="vert" type="range" min="1" max="5" value="1"/></td>

      </tr>

      <tr>

        <td>sun elevation: <span id="sunElOut"></span>°</td>

        <td><input id="sunEl" type="range" min="0" max="90" value="45"/></td>

      </tr>

      <tr>

        <td>sun azimuth: <span id="sunAzOut"></span>°</td>

        <td><input id="sunAz" type="range" min="0" max="360" value="45"/></td>

      </tr>

    </table>

    <script>

      import

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值