사용자 정의지도로 확대 된 Openlayers

웹 응용 프로그램에 대해 OpenLayers를 사용하여 조사하고 있습니다. 기본적으로 OpenStreetMap 또는 Google지도는 충분히 확대되지 않으므로 최대 레벨로 확대 한 후 다시 확대/축소를 클릭하면 맞춤지도 이미지가로드됩니다.사용자 정의지도로 확대 된 Openlayers

그럴 수 없다면 최대 확대/축소 수준에서만 나타나는 오버레이를 수행하고 한 번 클릭하면 SVG 기반의 다른지도로 이동합니다.

이들 중 어느 것이 더 실현 가능합니까? 어떤 피드백 환영!

출처

2012-11-18 Dominik

나는 그것이 할 수 있다고 확신하지만, 구성하는 것은 까다 롭습니다.

Mapnik으로 자신 만의 openstreetmap 타일을 렌더링 할 수 있습니다. 벡터 소스를 기반으로하므로 더 확대 할 수 있습니다.

또는 벡터 레이어 (SVG 또는 VML이 될 것임) 또는 정적 이미지 레이어를 추가하여 충분히 높은 줌 레벨에서만 표시 할 수 있습니다. 그러나 기본 레이어가 OSM 또는 Google지도이기 때문에지도는 기본 레이어의 최대 줌 레벨보다 더 확대 할 수 없습니다.

기본 OpenLayers.Layer.OSM 레이어를 덮어 쓰고 최대 줌 레벨을 더 높게 설정하고 (although this is not good practice) OSM 타일 이미지를 더 높은 줌 레벨로 가져 오는 것을 중지하고 사용자 정의 비헤이비어를 추가하십시오 (직접 타일로드 서버 또는 벡터 레이어 옵션 사용). 당신은 클래스 계층 구조 어딘가에 적절한 메소드를 오버라이드 (override) 할 필요가

OpenLayers.Layer.MyOSMLayer = OpenLayers.Class(OpenLayers.Layer.OSM, { 
    initialize: function(name, options) { 
     options = OpenLayers.Util.extend({ 
      numZoomLevels: 19 + 4, 
     }, options); 
     var newArguments = [name, url, options]; 
     OpenLayers.Layer.OSM.prototype.initialize.apply(this, newArguments); 
    }, 

    // @override from XYZ 
    getURL: function (bounds) { 
     var xyz = this.getXYZ(bounds); 
     if (xyz.z > 19) { // override url on higher zoomlevel 
      return "http://myserver/white.png"; 
     } 
     // else default behaviour: super.getUrl() 
     return OpenLayers.Layer.OSM.prototype.getURL.apply(this, [bounds]); 
    }, 

    CLASS_NAME: "OpenLayers.Layer.MyOSMLayer" 
})

( OpenLayers.Layer.OSM는 ... OpenLayers.Layer.XYZ가 OpenLayers.Layer.Grid 등 확장 확장)

출처

2012-11-19 09:03:29 ivy

사용자 정의지도로 확대 된 Openlayers

답변

관련 문제