}
marker層，擴展vector層，通過point和style達到marker的效果
??1?$package("com.bct.map");
??2?$import("com.bct.map.EncoderMarkerStyle");
??3?com.bct.map.MarkerVectorLayer?=?OpenLayers.Class(OpenLayers.Layer.Vector,{
??4?????/**
??5??????*?parameters
??6??????*?attribute?filer對象
??7??????*/
??8?????getFeatureByAttribute?:function(attributes){
??9?????????var?feature?=?null;
?10?????????for(var?i=0;i<this.features.length;?++i){
?11?????????????var?attri?=?this.features[i].attributes;
?12?????????????var?find?=?false;
?13?????????????for(var?j?in?attributes){
?14?????????????????if(attributes[j]?==?attri[j]){
?15?????????????????????find?=?true;
?16?????????????????}
?17?????????????}
?18?????????????if(find){
?19?????????????????return?this.features[i];?
?20?????????????}????????????
?21?????????}
?22?????
?23?????},
?24?????addEncorderFeature:function(encNode,location){
?25?????????if(encNode&&this.repetitiveCheck(encNode.id)){
?26?????????????return;
?27?????????}
?28?????????var?attributes?=?OpenLayers.Util.extend({},?encNode.attributes);
?29?????????var?enc_point?=?new?OpenLayers.Geometry.Point(location.lon,location.lat);
?30?????????var?enc_Feature?=?new?OpenLayers.Feature.Vector(enc_point,attributes,com.bct.map.EncoderMarkerStyle['smallEncoder']);
?31?????????this.addFeatures([enc_Feature]);
?32?????????if(encNode.attributes['lon']&&encNode.attributes['lat']&&encNode.attributes['lon'].length>0){
?33?????????????return;
?34?????????}
?35?????????this.updateChannel(encNode.id,location.lon,location.lat);
?36?????},
?37?????addDeptFeature:function(deptNode,location){
?38?????????if(deptNode&&this.repetitiveCheck(deptNode.id)){
?39?????????????return;
?40?????????}
?41?????????var?attributes?=?OpenLayers.Util.extend({},?deptNode.attributes);
?42?????????var?enc_point?=?new?OpenLayers.Geometry.Point(location.lon,location.lat);
?43?????????var?enc_Feature?=?new?OpenLayers.Feature.Vector(enc_point,attributes,com.bct.map.EncoderMarkerStyle['smallEncoder']);
?44?????????
?45?????????this.addFeatures([enc_Feature]);
?46?????????
?47?????},
?48?????repetitiveCheck:function(entity_id){
?49?????????if(this.getFeatureByAttribute({id:entity_id})){
?50?????????????return?true;
?51?????????}
?52?????????return?false;
?53?????},
?54?????updateChannel:function(channel_id,lon,lat){
?55?????????Ext.Ajax.request({
?56????????????????url:?'deviceVideoEncoder.do?method=updateLonlat&id='+channel_id+"&lon="+lon+"&lat="+lat
?57?????????});
?58?????},
?59?????channelMarkerClick:function()?{
?60?????????var?features?=?this.selectedFeatures;
?61?????????if(features.length?>=0&&features[0])?{
?62?????????????feature?=?features[0];????????????
?63?????????????var?treeNodeAttribute?=?feature.attributes;
?64?????????????var?vedioPopForm?=?new?Ext.FormPanel({
?65????????????????????????????????????frame:true,
?66?????????????????????????????????labelAlign:?'top',
?67?????????????????????????????????bodyStyle:'padding:5px',
?68?????????????????????????????????width:?400,
?69?????????????????????????????????height:200,
?70?????????????????????????????????layout:?'fit',
?71?????????????????????????????????items:[{
?72?????????????????????????????????????????????xtype:'fieldset',
?73?????????????????????????????????????????????title:?'攝像頭信息',
?74?????????????????????????????????????????????autoHeight:true,
?75?????????????????????????????????????????????autoWidth:true,
?76?????????????????????????????????????????????html:"<p><font?color='red'?size='2'>名稱:"+treeNodeAttribute['text']
?77?????????????????????????????????????????????+"</font></p><p><font?color='red'?size='2'>通道號:"+treeNodeAttribute['channelNumber']
?78?????????????????????????????????????????????+"</font></p><p><font?color='red'?size='2'>設備名稱:"+treeNodeAttribute['deviceunitName']
?79?????????????????????????????????????????????+"</font></p><p><font?color='red'?size='2'>所屬部門:"+treeNodeAttribute['deptName']
?80?????????????????????????????????????????????+"</font></p><p><font?color='red'?size='2'>經緯度:"+treeNodeAttribute['lon']+","+treeNodeAttribute['lat']
?81?????????????????????????????????????}]
?82?????????????});
?83?????????????var?win?=?new?Ext.Window({
?84?????????????????width?:?420,
?85?????????????????height:?220,
?86?????????????????items?:?vedioPopForm
?87?????????????});
?88?????????????win.show();????????????
?89?????????}
?90?????},
?91?????cartoonFeature?:function(feature){
?92?????????this.drawFeature(feature,com.bct.map.EncoderMarkerStyle['bigEncoder']);
?93?????????var?runner?=?new?Ext.util.TaskRunner(1000);
?94?????????var?task?=?{
?95?????????????run:this.drawFeature,
?96?????????????scope:this,
?97?????????????args:[feature,com.bct.map.EncoderMarkerStyle['smallEncoder']],
?98?????????????interval:?1000
?99?????????}
100?????????runner.start(task);
101?????},
102?????removeSelectFeature:function(){
103?????????var?features?=?this.selectedFeatures;
104?????????for(var?i=features.length-1;?i>=0;?i--)?{
105?????????????feature?=?features[i];
106?????????????this.updateChannel(feature.attributes['id'],"","");
107?????????}
108?????????this.destroyFeatures(this.selectedFeatures);
109?????},
110?????monitorSelectFeature:function(){????????
111?????????var?features?=?this.selectedFeatures;
112?????????if(features.length?>=0&&features[0])?{
113?????????????feature?=?features[0];????????????
114?????????????var?treeNodeAttribute?=?feature.attributes;
115?????????????var?objId="mapAVShow"+treeNodeAttribute['id'];
116?????????????var?win?=?new?Ext.Window({
117?????????????????width?:?420,
118?????????????????height:?420,
119?????????????????html:"<div?id='mapEncoder'?width='100%'?height='100%'><object?width='100%'?height='100%'?id='"+objId+"'?classid='clsid:574B47E8-A366-4AB9-B2EA-57F145CA3780'></object></div>"
120?????????????});????????????
121?????????????win.show();
122?????????????Ext.lib.Ajax.request('GET','channel.do?method=getSiteId&accept=json&id='+treeNodeAttribute['id'],
123???????????????????????????????{success:?function(o){
124?????????????????????????????????????????var?encoderObj;
125?????????????????????????????????????????encoderObj=Ext.util.JSON.decode(o.responseText);
126?????????????????????????????????????????$import("com.bct.monitor.mapAVShow");
127?????????????????????????????????????????var?avshowObj=document.getElementById(objId);
128?????????????????????????????????????????var?avshow=new?com.bct.monitor.mapAVShow(avshowObj,
129?????????????????????????????????????????encoderObj[0].siteId,encoderObj[0].enCoderId,encoderObj[0].diveceUnitTypeId,'');
130?????????????????????????????????????????avshow.startVideo();
131?????????????????????????????????????????win.on("destroy",function?del(){
132??????????????????????????????????????????????????????????avshow.stopVideo();
133?????????????????????????????????????????});
134?????????????????????????????????}
135???????????????????????????????});?????????????
136?????????}
137?????}
138?});