GIS地图
<h1>GIS地图</h1>
<p>下面是关于 GIS 地图的相关说明，包括 TileLayerConfig 和 TileLayer 类的构造、成员、方法以及不同地图服务提供者的使用示例。</p>
<h2>一、BCore.Extension.GIS.TileLayerConfig</h2>
<h3>构造</h3>
<pre><code class="language-javascript">let tileLayerConfig = new BCore.Extension.GIS.TileLayerConfig(mViewer);</code></pre>
<h3>成员</h3>
<ul>
<li><strong>成员变量</strong>
<ul>
<li><code>mViewer</code>: <code>BCore.Viewer.Viewer3D</code> - 视图对象</li>
</ul></li>
</ul>
<hr />
<h2>二、BCore.Extension.GIS.TileLayer</h2>
<p>TileLayer 支持地图切片服务（WM）加载，并支持 EPSG: 3857 伪墨卡托投影坐标系数据渲染。</p>
<h3>构造</h3>
<pre><code class="language-javascript">let tileLayer = new BCore.Extension.GIS.TileLayer(config);</code></pre>
<h3>参数</h3>
<ul>
<li><strong>config</strong>: <code>BCore.Extension.GIS.TileLayerConfig</code> - GIS地图配置参数对象</li>
</ul>
<h3>方法</h3>
<ul>
<li><code>setTileLayer(provider)</code>: 设置切片地图图层</li>
<li><code>clearTileLayer()</code>: 清空切片地图图层
<code>getTileLayerBox3()</code>: 获取切片图层视图范围</li>
<li><code>setTileLayerBox3(box)</code>: 设置切片图层视图范围</li>
<li><code>zoomToCenter(delay?)</code>: 聚焦切片图层</li>
<li><code>mercatorTolonlat(x, y)</code>: 投影坐标转经纬度</li>
<li><code>lonLat2Mercator(lon, lat)</code>: 经纬度转投影坐标</li>
</ul>
<hr />
<h2>三、地图服务</h2>
<ul>
<li>
<p><strong>构造</strong>：
<code>new BCore.Extension.GIS.TianDiTuProvider(token)</code> 天地图
<code>new BCore.Extension.GIS.AMapProvider()</code> 高德地图
<code>new BCore.Extension.GIS.GeoqProvider()</code> GeoQ地图</p>
</li>
<li>
<p><strong>参数</strong>：
<code>token</code> : <code>string</code> - 天地图官网申请token</p>
</li>
<li>
<p><strong>属性</strong>：
<code>enableLabels</code> : <code>boolean</code> - 影像地图是否启用标记图层
<code>maxZoom</code> : <code>number</code> - 最大缩放级别，高于该级别地图资源不再加载</p>
</li>
<li>
<p><strong>方法</strong>：
<code>setMapServerAddress(address)</code> - 设置切片地图服务地址</p>
<pre><code class="language-javascript">let tileLayerConfig = new BCore.Extension.GIS.TileLayerConfig(mViewer3D);
let tileLayer = new BCore.Extension.GIS.TileLayer(tileLayerConfig);
//天地图. token 在天地图官网申请 https://www.tianditu.gov.cn/
let mTdt = new BCore.Extension.GIS.TianDiProvider(token);
mTdt.maxZoom = 18;
//BCore.Extension.GIS.TianDiTuProvider.ServerAddress.Satellite 影像地图
//BCore.Extension.GIS.TianDiTuProvider.ServerAddress.Normal 矢量地图
mTdt.setMapServerAddress(BCore.Extension.GIS.TianDiTuProvider.ServerAddress.Satellite);
mTdt.enableLabels = false
//高德地图
let aMapProvider = new BCore.Extension.GIS.AMapProvider();
aMapProvider.setMapServerAddress(BCore.Extension.GIS.AMapProvider.ServerAddress.Satellite);
aMapProvider.enableLabels = false
//GeoQ地图
let mGeoqProvider = new BCore.Extension.GIS.GeoqProvider();
mGeoqProvider.maxZoom = 18;
//BCore.Extension.GIS.GeoqProvider.ServerAddress.ChinaOnlineStreetPurplishBlue
//BCore.Extension.GIS.GeoqProvider.ServerAddress.ChinaOnlineStreetGray
//BCore.Extension.GIS.GeoqProvider.ServerAddress.ChinaOnlineCommunity
mGeoqProvider.setMapServerAddress(BCore.Extension.GIS.GeoqProvider.ServerAddress.ChinaOnlineStreetPurplishBlue);
//使用天地图
tileLayer.setTileLayer(mTdt);
//tileLayer.setTileLayer(aMapProvider);
//tileLayer.setTileLayer(mGeoqProvider);</code></pre>
</li>
</ul>
<hr />
<h2>方法示例代码</h2>
<h3>1.设置切片地图图层</h3>
<ul>
<li><strong>接口</strong>：
<code>setTileLayer()</code></li>
</ul>
<pre><code class="language-javascript">let tileLayerConfig = new BCore.Extension.GIS.TileLayerConfig(mViewer3D);
let tileLayer = new BCore.Extension.GIS.TileLayer(tileLayerConfig);
tileLayer.setTileLayer(new BCore.Extension.GIS.GeoqProvider());</code></pre>
<h3>2.地图居中</h3>
<ul>
<li><strong>接口</strong>：
<code>zoomToCenter(delay?)</code></li>
<li><strong>描述</strong>:
未加载模型数据时，对地图进行居中的视图控制
<pre><code class="language-javascript">let box3 = tileLayer.getTileLayerBox3();
box3.min.x = 10053186;
box3.min.y = 4320865;
box3.max.x = 12736685;
box3.max.y = 4670478;
tileLayer.setTileLayerBox3(box3);
tileLayer.setTileLayer(new BCore.Extension.GIS.GeoqProvider());</code></pre></li>
</ul>
<h3>3.坐标投影转换</h3>
<ul>
<li><strong>接口</strong>：
<code>mercatorTolonlat(x,y)</code> 投影坐标转经纬度
<code>lonLat2Mercator(lon,lat)</code> 经纬度转投影坐标</li>
<li><strong>描述</strong>:
经纬度坐标 与 伪墨卡托投影坐标 相互转换</li>
<li><strong>参数</strong>：
<code>x</code>: <code>number</code> - 东坐标
<code>y</code> : <code>number</code> - 北坐标
<code>lon</code> : <code>number</code> - 经度
<code>lat</code> : <code>number</code> - 纬度</li>
</ul>
<pre><code class="language-javascript">let x = 12609568.870546078;
let y = 2623029.5285975216;
let lonlat = tileLayer.mercatorTolonlat(x, y);
console.log(lonlat); // 经度和纬度
let mercator = tileLayer.lonLat2Mercator(lonlat.lon, lonlat.lat);
console.log(mercator); // 投影坐标</code></pre>
<p>通过以上信息，可以了解如何进行地图切片、坐标转换以及调用地图服务提供者的配置。</p>