Here Maps - 防止地图在地图外显示灰色区域

Question

所以，我在 Here Maps 上找不到任何地方 API 防止地图显示在地图外部呈现的灰色区域的选项。

You can visualize the grey area by dragging, or by zooming out.

至少可以说，这让地图感觉有点业余。

到目前为止，我查看了整个文档，但找不到任何内容，我也尝试使用限制平移行为 map.getViewModel().addEventListener('sync', ... 来阻止它，但它没有像预期。

Answer 1

快速缩小期间看到的灰色区域是因为从服务器通过互联网连接访问平铺图像需要时间。但是，可以通过将地图视图限制在由其左上角和右下角的地理坐标定义的特定矩形地理区域来管理在最大缩小时看到的灰色图像。

方法名称：

new H.geo.Rect (top, left, bottom, right)

API参考： https://developer.here.com/documentation/maps/3.1.26.0/api_reference/H.geo.Rect.html

代码片段：

function restrictMap(map){

  var bounds = new H.geo.Rect(37.829, -122.426, 37.824, -122.42);
  var prevGoodBounds;

  map.getViewModel().addEventListener('sync', function(e) {
            var curZoom = e.newValue.zoom,
                newZoom = false,
                mapViewBounds = map.getViewModel().getLookAtData().bounds.getBoundingBox(),
                topMap = mapViewBounds.getTop(),
                bottomMap = mapViewBounds.getBottom();
        //console.log("prevGoodBounds:", prevGoodBounds);
                
            
            //if(curZoom > this.opt.maxZoom || curZoom < this.opt.minZoom){
                //console.log("sync curZoom > this.opt.maxZoom || curZoom < this.opt.minZoom", this.opt);
                //if(curZoom > this.opt.maxZoom) newZoom = this.opt.maxZoom;
                //if(curZoom < this.opt.minZoom) newZoom = this.opt.minZoom;

                //var runLater = function(newZoom){
                    //map.setZoom(newZoom);
                //};
                //runLater.delay(50, this, newZoom);
            //}
            
            
            if(topMap > 85 || bottomMap < -85) {
                //console.log("sync topMap > 83 || bottomMap < -83", topMap, bottomMap, this.opt);
                
                if(prevGoodBounds){
                    //var runLater = function(){
                        map.setZoom(prevGoodBounds.zoom);
                        map.setCenter(prevGoodBounds.center);
                    //};
                    //runLater.delay(0, this);
                }
            }
            
            if(topMap <= 85 && bottomMap >= -85) {
                prevGoodBounds = {center: map.getCenter(), zoom: map.getZoom()};
            }
        });

  //Debug code to visualize where your restriction is
  /*map.addObject(new H.map.Rect(bounds, {
    style: {
        fillColor: 'rgba(55, 85, 170, 0.1)',
        strokeColor: 'rgba(55, 85, 170, 0.6)',
        lineWidth: 8
      }
    }
  ));*/
}

完整示例：https://jsfiddle.net/raj0665/8oLyfent/

Here Maps - 防止地图在地图外显示灰色区域

Here Maps - Prevent map from showing grey area outside of map

javascript

here-api

heremaps