ラスタータイルの上のベクタータイルがopenLayersに表示されない

オープンレイヤーマップバージョン4.3.3のラスタータイルの上にベクタータイルをレンダリングしようとしています。両方のタイルがレンダリングされていますが、ベクタータイルはラスタータイル上に表示されません。たとえば、状態の1つに対してベクタータイルがあり、これをラスタータイルの上に半透明レイヤーとして表示します。 S3バケットにはベクタータイルを、S3バケットにはタイルロードファンクションをそれぞれ格納しています。私は投影を設定していません。私はtileLoadFunctionはいくつかのデフォルトの投影があると思います。続きラスタータイルの上のベクタータイルがopenLayersに表示されない

は、タイルの両方を表示するための私のコードです：

var map = new ol.Map({ 
    layers: [ 
     new ol.layer.Tile({ 
      name: 'Tile', 
      type: 'GeoJSON', 
      source: new ol.source.XYZ({ 
       url: 'https://api.tiles.mapbox.com/v4/mapbox.emerald/{z}/{x}/{y}.png?access_token=' + MAPBOX_KEY 
      }) 
     }), 

     new ol.layer.VectorTile({ 
      name: 'VectorTile', 
      type: 'MVT', 
      source: new ol.source.VectorTile({ 
       format: new ol.format.MVT(), 
       renderMode: 'vector', 
       tileGrid: ol.tilegrid.createXYZ({ maxZoom: 14 }), 
       url: 'data', 
       tileLoadFunction: tileLoadFunction      
      }),     
      style: new ol.style.Style({ 
       fill: new ol.style.Fill({ 
        color: 'rgba(0, 0, 0, 0.5)' 
       }), 
       stroke: new ol.style.Stroke({ 
        color: 'white', 
        width: 3 
       }) 
      }) 
     }) 
    ], 
    target: 'map', 
    view: new ol.View({ 
     center: [-7400327.330457623, 2062576.7712471967], 
     maxZoom: 20, 
     minzoom: 2, 
     zoom: 8  
    }) 
}); 

function tileLoadFunction(tile, url) { 
    getSignedUrl(url, function(s3Url) { 
    var loader = ol.featureloader.loadFeaturesXhr(s3Url, tile.getFormat(), 
          tile.onLoad.bind(tile),             
          tile.onError.bind(tile)); 
     tile.setLoader(loader); 
    }

誰もがラスタータイルの上に半透明の層として適切にベクトルタイルを表示するためにここに欠けているものを、導くことはできますか？

おかげで、

出典

2017-09-27 bhushan patil