Używanie formatu PNG lub JPEG dla mapy z otwartymi panelami (problem z skalowaniem/powiększaniem)

Question

Używam obrazu, aby wyświetlić moją mapę za pomocą OpenLayers. Mój kod JS wygląda następująco:

map = new OpenLayers.Map('map'); 

var options = {numZoomLevels: 7, 
       isBaseLayer: true, 
       }; 

var globe = new OpenLayers.Layer.Image(
    'Globe ESA', 
    'http://upload.wikimedia.org/wikipedia/commons/0/07/World_map_blank_black_lines_4500px.gif', 
    new OpenLayers.Bounds(-180, -90, 180, 90), 
    new OpenLayers.Size(4500, 2234), 
    options); 

map.addLayers(globe); 

markers = new OpenLayers.Layer.Markers("markers"); 
map.addLayer(markers); 

map.addControl(new OpenLayers.Control.LayerSwitcher()); 
map.zoomToMaxExtent(); 
map.addControl(new OpenLayers.Control.MousePosition()); 

mój CSS:

#map { 
    width: 640px; 
    height: 480px; 
    border: 1px solid black; 
} 

Ale nie mogę uzyskać OpenLayers skalowanie w dół duży obraz. Jest zawsze wyświetlany w pełnej rozdzielczości i nie mogę pomniejszyć widoku, aby wyświetlić cały globus. Prosimy o pomoc.

Answer 1

Należy ustawić rozmiar obrazu, który powinien zostać wyświetlony po całkowitym zmniejszeniu.

var globe = new OpenLayers.Layer.Image(
    'Globe ESA', 
    'http://upload.wikimedia.org/wikipedia/commonS/0/07/World_map_blank_black_lines_4500px.gif', 
    new OpenLayers.Bounds(-180, -90, 180, 90), 
    new OpenLayers.Size(1125,558), 
    options); 

Zmieniłem rozmiar na jedną czwartą rozmiaru oryginału. Możesz zmniejszyć tę wartość, jeśli chcesz ją pomniejszyć.