<?xml version="1.0" encoding="UTF-8" ?>
<rss version="2.0">
  <channel>
    <title>kebo</title>
    <description>@@[kebo</description>
    <link>http://kebo.javaeye.com</link>
    <language>UTF-8</language>
    <copyright>Copyright 2003-2008, JavaEye.com</copyright>
    <docs>http://blogs.law.harvard.edu/tech/rss</docs>
    <generator>JavaEye - 做最棒的软件开发交流社区</generator>
          <item>
        <title>openlayers中利用vector实现marker的方式</title>
        <author>kebo</author>
        <description>
          <![CDATA[
          <br/>
          作者: <a href="http://kebo.javaeye.com">kebo</a>&nbsp;
                    链接：<a href="http://kebo.javaeye.com/blog/236912" style="color:red;">http://kebo.javaeye.com/blog/236912</a>&nbsp;
          发表时间: 2008年09月04日
          <br/><br/>
          声明：本文系JavaEye网站发布的原创博客文章，未经作者书面许可，严禁任何网站转载本文，否则必将追究法律责任！
          <br/><br/>
          项目需要一个小型的gis。openlayers，geoserver，postgres组合是比较好的选择。<br />openlayers的marker层好像不支持拖动操作。通过研究api发现，可以利用vector层<br />达到这个目的，作出标注的效果。可以定位，搜索，拖动等效果，选中的时候可以<br />通过修改style达到动画效果。<br />基本做法如下：<br />1：定义marker显示的样式<br />2：扩展vector层，利用在扩展层上添加point与style，图片显示point就出现标注的<br />&nbsp;&nbsp; 效果<br />基本代码如下:<br />定义样式：<br /><pre name="code" class="java">
$package("com.bct.map");
com.bct.map.EncoderMarkerStyle = {
	'bigEncoder':{
    	graphicWidth:24,
        graphicHeight : 24,
        graphicXOffset : -12,
        graphicYOffset : -24,
        externalGraphic : "scripts/map/img/channel2.png"
    },
    'smallEncoder':{
        graphicWidth:16,
        graphicHeight : 16,
        graphicXOffset : -8,
        graphicYOffset : -16,
        externalGraphic : "scripts/map/img/channel.gif"
    },
    'selectStyle':{
        pointerEvents: "visiblePainted",
        border:"border:25 outset #ff88ff",
        cursor: "pointer",
        graphicWidth:24,
        graphicHeight : 24,
        graphicXOffset : -12,
        graphicYOffset : -24,
        externalGraphic : "scripts/map/img/channel2.png"    
    },
    styleMap: new OpenLayers.StyleMap({
                    "select": new OpenLayers.Style({pointRadius: 24})
    })
}</pre><br />2:扩展向量层<br /><pre name="code" class="java">
$package("com.bct.map");
$import("com.bct.map.EncoderMarkerStyle");
com.bct.map.MarkerVectorLayer = OpenLayers.Class(OpenLayers.Layer.Vector,{
    /**
	 * parameters
	 * attribute filer对象
	 */
	getFeatureByAttribute :function(attributes){
		var feature = null;
		for(var i=0;i&lt;this.features.length; ++i){
			var attri = this.features[i].attributes;
			var find = false;
			for(var j in attributes){
				if(attributes[j] == attri[j]){
					find = true;
				}
			}
			if(find){
				return this.features[i]; 
			}			
		}
	
	},
	//添加Feature，是point显示为图片
	addEncorderFeature:function(encNode,location){
		if(encNode&amp;&amp;this.repetitiveCheck(encNode.id)){
			return;
		}
        var attributes = OpenLayers.Util.extend({}, encNode.attributes);
        var enc_point = new OpenLayers.Geometry.Point(location.lon,location.lat);
        var enc_Feature = new OpenLayers.Feature.Vector(enc_point,attributes,com.bct.map.EncoderMarkerStyle['smallEncoder']);
        this.addFeatures([enc_Feature]);
        if(encNode.attributes['lon']&amp;&amp;encNode.attributes['lat']&amp;&amp;encNode.attributes['lon'].length>0){
        	return;
        }
        this.updateChannel(encNode.id,location.lon,location.lat);
	},
	repetitiveCheck:function(entity_id){
	    if(this.getFeatureByAttribute({id:entity_id})){
	    	return true;
	    }
		return false;
	},
	updateChannel:function(channel_id,lon,lat){
		Ext.Ajax.request({
  			 url: 'deviceVideoEncoder.do?method=updateLonlat&amp;id='+channel_id+"&amp;lon="+lon+"&amp;lat="+lat
		});
	},
	channelMarkerClick:function() {
	    var features = this.selectedFeatures;
    	if(features.length >=0&amp;&amp;features[0]) {
    		feature = features[0];            
            var treeNodeAttribute = feature.attributes;
			//显示信息   	
    	}
    },
    cartoonFeature :function(feature){
    	this.drawFeature(feature,com.bct.map.EncoderMarkerStyle['bigEncoder']);
        var runner = new Ext.util.TaskRunner(1000);
        var task = {
	    	run:this.drawFeature,
	    	scope:this,
	    	args:[feature,com.bct.map.EncoderMarkerStyle['smallEncoder']],
	    	interval: 1000
		}
    	runner.start(task);
    },
    removeSelectFeature:function(){
    	var features = this.selectedFeatures;
    	for(var i=features.length-1; i>=0; i--) {
            feature = features[i];
            this.updateChannel(feature.attributes['id'],"","");
        }
        this.destroyFeatures(this.selectedFeatures);
    },
    monitorSelectFeature:function(){		
    	var features = this.selectedFeatures;
    	if(features.length >=0&amp;&amp;features[0]) {
            feature = features[0];            
            var treeNodeAttribute = feature.attributes;
			var objId="mapAVShow"+treeNodeAttribute['id'];
			//弹出窗口
        }
    }
});</pre><br />addEncorderFeature是添加一个标注的地方。<br />利用这种方式，比原有的marker层拥有更多的功能
          <br/><br/>
          <span style="color:red;">
            <a href="http://kebo.javaeye.com/blog/236912#comments" style="color:red;">已有 <strong>0</strong> 人发表留言，猛击-&gt;&gt;<strong>这里</strong>&lt;&lt;-参与讨论</a>
          </span>
          <br/><br/><br/>
          <span style="color:#E28822;">JavaEye推荐</span>
          <br/>
          <ul class='adverts'><li><a href='/adverts/42' target='_blank'><span style="color:red;font-weight:bold;">搜狐网站诚聘Java、PHP和C++工程师</span></a></li><li><a href='/adverts/41' target='_blank'><span style="color:red;font-weight:bold;">Windows7在微软WinHEC 2008上揭开神秘面纱</span></a></li></ul>
          <br/><br/><br/>
          ]]>
        </description>
        <pubDate>Thu, 04 Sep 2008 16:27:26 +0800</pubDate>
        <link>http://kebo.javaeye.com/blog/236912</link>
        <guid>http://kebo.javaeye.com/blog/236912</guid>
      </item>
          <item>
        <title>classloader</title>
        <author>kebo</author>
        <description>
          <![CDATA[
          <br/>
          作者: <a href="http://kebo.javaeye.com">kebo</a>&nbsp;
                    链接：<a href="http://kebo.javaeye.com/blog/171351" style="color:red;">http://kebo.javaeye.com/blog/171351</a>&nbsp;
          发表时间: 2008年03月14日
          <br/><br/>
          声明：本文系JavaEye网站发布的原创博客文章，未经作者书面许可，严禁任何网站转载本文，否则必将追究法律责任！
          <br/><br/>
          <a href="http://blog.csdn.net/teamlet/archive/2008/03/13/21" target="_blank">http://blog.csdn.net/teamlet/archive/2008/03/13/21</a>
          <br/><br/>
          <span style="color:red;">
            <a href="http://kebo.javaeye.com/blog/171351#comments" style="color:red;">已有 <strong>0</strong> 人发表留言，猛击-&gt;&gt;<strong>这里</strong>&lt;&lt;-参与讨论</a>
          </span>
          <br/><br/><br/>
          <span style="color:#E28822;">JavaEye推荐</span>
          <br/>
          <ul class='adverts'><li><a href='/adverts/41' target='_blank'><span style="color:red;font-weight:bold;">Windows7在微软WinHEC 2008上揭开神秘面纱</span></a></li><li><a href='/adverts/42' target='_blank'><span style="color:red;font-weight:bold;">搜狐网站诚聘Java、PHP和C++工程师</span></a></li></ul>
          <br/><br/><br/>
          ]]>
        </description>
        <pubDate>Fri, 14 Mar 2008 12:28:52 +0800</pubDate>
        <link>http://kebo.javaeye.com/blog/171351</link>
        <guid>http://kebo.javaeye.com/blog/171351</guid>
      </item>
      </channel>
</rss>