當前位置: 首頁>>代碼示例 >>用法及示例精選 >>正文


JavaScript ArcGIS BaseLayerView2D用法及代碼示例


基本信息

以下是所在類或對象的基本信息。

AMD: require(["esri/views/2d/layers/BaseLayerView2D"], (BaseLayerView2D) => { /* code goes here */ });

ESM: import BaseLayerView2D from "@arcgis/core/views/2d/layers/BaseLayerView2D";

類: esri/views/2d/layers/BaseLayerView2D

繼承: BaseLayerView2D > LayerView > Accessor

自從:用於 JavaScript 4.8 的 ArcGIS API

用法說明

表示 LayerLayerView 在被添加到帶有 MapViewMap 之後。

可以擴展此類以為層創建自定義LayerView。當將圖層添加到其Map的圖層列表時,MapView 會根據需要創建 LayerView

子類可以實現LayerView生命周期的多個函數。首先,當LayerView即將開始繪製圖層內容時,調用attach()方法。然後,在 LayerView 的生命周期中,render() 方法在 MapView 渲染階段被調用。 render() 方法可以訪問畫布 2d 上下文,在其中可以渲染可顯示的內容。最後,從Map中刪除圖層後,將調用 detach() 方法。它釋放所有分配的資源並停止on-going請求。

例子:

let TileBorderLayerView2D = BaseLayerView2D.createSubclass({
   // Example of a render implementation that draws tile boundaries
   render(renderParameters) {
     let tileSize = this.layer.tileInfo.size[0];
     let state = renderParameters.state;
     let pixelRatio = state.pixelRatio;
     let width = state.size[0];
     let height = state.size[1];
     let context = renderParameters.context;
     let coords = [0, 0];

     context.fillStyle = "rgba(0,0,0,0.25)";
     context.fillRect(0, 0, width * pixelRatio, height * pixelRatio);

     // apply rotation for everything that will be applied to the canvas
     if (state.rotation !== 0) {
       context.translate(width * pixelRatio * 0.5, height * pixelRatio * 0.5);
       context.rotate((state.rotation * Math.PI) / 180);
       context.translate(- width * pixelRatio * 0.5, -height * pixelRatio * 0.5);
     }

     // Set the style for all the text.
     context.font = "24px monospace";
     context.fillStyle = "black";
     context.shadowBlur = 1;

     for (const tile of this.tiles) {
       let screenScale = tile.resolution / state.resolution * pixelRatio;

       state.toScreenNoRotation(coords, tile.coords);

       // Draw the tile boundaries
       context.strokeRect(coords[0], coords[1], tileSize * screenScale, tileSize * screenScale);

       // Draw the tile information
       context.shadowColor = "white";
       context.fillText(
         tile.level + "/" + tile.row + "/" + tile.col + "/" + tile.world,
         coords[0] + 12,
         coords[1] + 24,
         tileSize * screenScale
       );
       context.shadowColor = "transparent";
     }
   }
 });

 let CustomTileLayer = Layer.createSubclass({
   tileInfo: TileInfo.create({ spatialReference: { wkid: 3857 }}),

   createLayerView(view) {
     if (view.type === "2d") {
       return new TileBorderLayerView2D({
         view: view,
         layer: this
       });
     }
   }
 });

相關用法


注:本文由純淨天空篩選整理自arcgis.com大神的英文原創作品 BaseLayerView2D。非經特殊聲明,原始代碼版權歸原作者所有,本譯文未經允許或授權,請勿轉載或複製。