Posted on 2010-11-24 10:03
帥子 閱讀(3980)
評論(0) 編輯 收藏 所屬分類:
J2EE技術專區
1，視口坐標的原點在左上角，水平向右為x軸正向，垂直向下為y 軸正向；
2，地圖坐標原點為初始圖層的中心點，水平向右為x軸正向，垂直向上為y軸正向；
3，視口中心點永遠與地圖中心點重合，不一定與瓦片中心點重合；
4，拖動圖層的邏輯描述：地圖是不動的，視口移動從而展示不同的地圖區域；?
Resolution：解析度 = 地圖尺寸/視口尺寸好比攝像機，鏡頭拉得越近解析度越小，地圖看得越清晰。?
map.calculateBounds()：地圖當前被查看區域邊界
map.centerLayerContainer():設置圖層的左和上邊距，保證圖層中心點與地圖中心點重合
map.getCenter()：地圖中心點坐標（地圖坐標，經緯度）
map.getCurrentSize()：取視口尺寸
map.getExtent()：地圖當前欲被查看區域；地圖中心所在區域（經緯度）、視口尺寸乘以解析度
map.getLonLatFromViewPortPx()：視口坐標轉地圖坐標
map.getMaxExtent()：地圖最大可被查看區域（經緯度），視口中心點不可以移出該區域
map.getResolution()：地圖當前解析度
map.getSize()：視口尺寸
map.getViewPortPxFromLonLat()：地圖坐標轉成視口坐標
map.getZoom()：當前縮放級別
map.pan(x軸方向, y軸方向, options)：移動地圖map.setCenter(新的地圖中心點, 縮放級別, 拖動, 強制縮放級別改變)：重新設置地圖中心、縮放比例??
openlayers加載過程
map = new OpenLayers.Map('map');
1，?? 創建map對象，參數為展示地圖的Dom元素的id
a)??????? 定義tileSize（默認256*256）
b)??????? 定義maxExtent（默認-180, -90, 180, 90）
c)??????? 定義paddingForPopups（15, 15, 15, 15）
d)??????? 定義theme（默認theme/default/style.css）
e)??????? 定義id："OpenLayers.Map_"+序號
f)??????? 定義div：為展示地圖的Dom元素
g)??????? 定義viewPortDiv：視口Dom元素（id："OpenLayers.Map_"+ 序號 + "_OpenLayers_ViewPort；OVERFLOW： hidden； POSITION： relative；width："100%"；height："100%"；className： "olMapViewport"；），作為div的子元素
h)??????? 定義layerContainerDiv：存放圖層的Dom元素（id："OpenLayers.Map_"+ 序號 + " _OpenLayers_Container"；zIndex：this.Z_INDEX_BASE['Popup']-1;），作為 viewPortDiv的子元素。
Z_INDEX_BASE: { BaseLayer: 100, Overlay: 325, Popup: 750, Control: 1000 }定義events：object：map；element：div；
EVENT_TYPES： [ "preaddlayer", "addlayer", "removelayer", "changelayer", "movestart","move", "moveend", "zoomend", "popupopen", "popupclose", "addmarker", "removemarker", "clearmarkers", "mouseover", "mouseout", "mousemove", "dragstart", "drag", "dragend", "changebaselayer"]
i)??????? 定義events：object： map；element：div； eventTypes：EVENT_TYPES；fallThrough：true
???????????????????? i.????????????? 定義object：事件對應的js腳本對象
?????????????????? ii.????????????? 定義element：響應瀏覽器事件的Dom元素
??????????????? iii.????????????? 定義eventTypes：事件類型
?????????????????? iv.????????????? 定義fallThrough：是否穿透（停止事件傳播）
????????????????????? v.????????????? 定義listeners：事件監聽者
?????????????????? vi.????????????? 定義eventHandler：定義事件處理者：handleBrowserEvent
??????????????? vii.????????????? 向listeners中注冊EVENT_TYPES
???????????? viii.????????????? 將BROWSER_EVENTS注冊到EVENT_TYPES，在Dom元素element上注冊BROWSER_EVENTS瀏覽器監聽事件執行 eventHandler，在Dom元素element上注冊"dragstart"事件執行OpenLayers.Event.stop。
BROWSER_EVENTS: ["mouseover", "mouseout","mousedown", "mouseup", "mousemove","click","dblclick","resize", "focus", "blur"]j)??????? updateSize響應"movestart"事件；updateSize響應"resize"事件；
k)??????? 確保加載theme主題css樣式；
l)??????? 定義layers：圖層；
m)??????? 定義controls：（默認：Navigation、PanZoom、ArgParser、Attribution），設置control內部的 map對象，將controls添加到map中
????????????????????? i.????????????? Navigation：displayClass：olControlNavigation；events：active/deactive；
id：OpenLayers.Control.Navigation_ 序號；
map：地圖對象；handlers.click：dblclick；dragPan、 zoomBox；handlers.wheel：MouseWheel；將要監聽的事件添加到map的listeners中；
?????????????????? ii.????????????? PanZoom：position：（4，4）；displayClass：olControlPanZoom；events：active/deactive；id：OpenLayers.Control.PanZoom_ 序號；…；添加到viewPortDiv中；
??????????????? iii.????????????? ArgParser：displayClass：olControlArgParser；events：active/deactive；id：OpenLayers.Control.ArgParser_ 序號；…；添加到viewPortDiv中；
?????????????????? iv.????????????? Attribution：displayClass：olControlAttribution；events：active/deactive；id：OpenLayers.Control.Attribution_ 序號；…；添加到viewPortDiv中；
n)??????? unloadDestroy：響應瀏覽器卸載事件 var ol_wms = new OpenLayers.Layer.WMS( "OpenLayers WMS",??????????????? "
2，?? 創建圖層對象
a)??????? newArguments：name："OpenLayers WMS", url："b)??????? OpenLayers.Layer.Grid.prototype.initialize： map.addLayers([ol_wms])
3，?? 將圖層加入到地圖中
a)??????? layer.div添加到layerContainerDiv
圖例一
|
window
|
|
DOMMouseScroll
|
Handler.MouseWheel.wheelListener
|
|
mousewheel
|
Handler.MouseWheel.wheelListener
|
|
unload
|
Map.unloadDestroy
|
?
|
document
|
|
mousewheel
|
Handler.MouseWheel.wheelListener
|
?
?
|
Div:
map
Div:
Layer.WMS
|
|
blur
|
Map.handleBrowserEvent
?
|
|
click
|
Map.handleBrowserEvent
?
|
|
dblclick
|
Map.handleBrowserEvent
?
|
|
dragstart
|
OpenLayers.Event.stop
?
|
|
focus
|
Map.handleBrowserEvent
?
|
|
mousedown
|
Map.handleBrowserEvent
?
|
|
mousemove
|
Map.handleBrowserEvent
?
|
|
mouseout
|
Map.handleBrowserEvent
?
|
|
mouseover
|
Map.handleBrowserEvent
?
|
|
mouseup
|
Map.handleBrowserEvent
?
|
|
resize
|
Map.handleBrowserEvent
?
|
?
?
?
|
Div:
OpenLayers_Control_PanZoom_panup
Div:
OpenLayers_Control_PanZoom_panleft
Div:
OpenLayers_Control_PanZoom_panright
Div:
OpenLayers_Control_PanZoom_pandown
Div:
OpenLayers_Control_PanZoom_zoomin
Div:
OpenLayers_Control_PanZoom_zoomworld
Div:
OpenLayers_Control_PanZoom_zoomout
|
|
click
|
Control.PanZoom.doubleClick
|
|
dblclick
|
Control.PanZoom.doubleClick
|
|
mousedown
|
Control.PanZoom.buttonDown
|
?
?
?
圖例
|
Map.events.listeners
|
|
Addlayer
|
Control.Attribution, Control.Attribution.updateAttribution
|
|
addmarker
|
?
|
|
Blur
|
?
|
|
changebaselayer
|
Control.Attribution, Control.Attribution.updateAttribution
|
|
changelayer
|
Control.Attribution, Control.Attribution.updateAttribution
|
|
clearmarkers
|
?
|
|
Click
|
Handler.Drag, handler.Drag.setEvent
Handler.Drag, handler.Drag.click
Handler.Drag, handler.Drag.setEvent
Handler.Drag, handler.Drag.click
?
|
|
Dblclick
|
?
|
|
Drag
|
?
|
|
Dragend
|
?
|
|
dragstart
|
?
|
|
Focus
|
?
|
|
mousedown
|
Handler.Drag, handler.Drag.setEvent
Handler.Drag, handler.Drag.
mousedown
Handler.Click, handler.Click.setEvent
Handler.Click, handler.Click.dblclick
Handler.Click, handler.Click.setEvent
Handler.Click, handler.Click.click
Handler.Click, handler.Click.setEvent
Handler.Click, handler.Click.
mousedown
Handler.Drag, handler.Drag.setEvent
Handler.Drag, handler.Drag.
mousedown
?
|
|
mousemove
|
Handler.Drag, handler.Drag.setEvent
Handler.Drag, handler.Drag.mousemove
Handler.MouseWheel, Handler.MouseWheel.setEven
Handler.MouseWheel, Handler.MouseWheel.mousemove
Handler.Drag, handler.Drag.setEvent
Handler.Drag, handler.Drag.mousemove
?
|
|
Mouseout
|
Handler.Drag, handler.Drag.setEvent
Handler.Drag, handler.Drag.mouseout
Handler.Drag, handler.Drag.setEvent
Handler.Drag, handler.Drag.mouseout
?
|
|
mouseover
|
?
|
|
Mouseup
|
Handler.Drag, handler.Drag.setEvent
Handler.Drag, handler.Drag.mouseup
Handler.Drag, handler.Drag.setEvent
Handler.Drag, handler.Drag.mouseup
?
|
|
Move
|
?
|
|
Moveend
|
?
|
|
movestart
|
Map
,
map.
updateSize
?
|
|
popupclose
|
?
|
|
popupopen
|
?
|
|
preaddlayer
|
?
|
|
removelayer
|
Control.Attribution, Control.Attribution.updateAttribution
|
|
removemarker
|
?
|
|
resize
|
Map
,
map.
updateSize
?
|
|
Zoomend
|
?
|
?
|
Layer.WMS.events.listeners
|
|
blur
|
?
|
|
click
|
?
|
|
dblclick
|
?
|
|
focus
|
?
|
|
loadcancel
|
?
|
|
loadend
|
?
|
|
loadstart
|
?
|
|
mousedown
|
?
|
|
mousemove
|
?
|
|
mouseout
|
?
|
|
mouseover
|
?
|
|
mouseup
|
?
|
|
resize
|
?
|
|
tileloaded
|
?
|
|
visibilitychanged
|
?
|
?
?
?
圖例
|
Control.Navigation.events.listeners
|
|
active
|
?
|
|
deactive
|
?
|
?
|
Control.PanZoom.events.listeners
|
|
active
|
?
|
|
deactive
|
?
|
?
|
Control.ArgParser.events.listeners
|
|
active
|
?
|
|
deactive
|
?
|
?
|
Control.Attribution.events.listeners
|
|
active
|
?
|
|
deactive
|
?
|
?
圖例二
44f2fa42-4b6b-4bba-94ae-b821651e3c3a|0|.0
?