config.xml文件的配置如下:

 <widget label="台风"  icon="assets/images/typhoon.png" config=""  url="widgets/ActualWeather/TyphoonWarningWidget.swf"/>

源代码目录如下:

界面效果:

大概的思路如下:从后台数据库获取台风的信息列表,展示在界面的表格里面;点击某条台风选项时候,会动态的在地图上展示台风的轨迹信息出来,点击某个时刻的台风轨迹时候,会弹出该时刻的台风详情气泡窗口来展示;

具体的技术:利用arcgis api的Geometry(Point、Polyline)、Graphic、infowindow等等,就是把台风点轨迹连成线,然后把点和线描绘出来展示在地图上。

TyphoonWarningWidget.mxml:

<?xml version="1.0" encoding="utf-8"?>
<viewer:BaseWidget xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:esri="http://www.esri.com/2008/ags"
xmlns:viewer="com.esri.viewer.*"
creationComplete="init()"
width="340" height="440"
>
<fx:Declarations>
</fx:Declarations>
<fx:Script>
<![CDATA[
import com.esri.ags.Graphic;
import com.esri.ags.SpatialReference;
import com.esri.ags.geometry.Geometry;
import com.esri.ags.geometry.MapPoint;
import com.esri.ags.geometry.Polyline;
import com.esri.ags.layers.GraphicsLayer;
import com.esri.ags.symbols.PictureMarkerSymbol;
import com.esri.ags.symbols.SimpleLineSymbol;
import com.esri.ags.symbols.SimpleMarkerSymbol;
import com.esri.ags.symbols.Symbol;
import com.esri.ags.symbols.TextSymbol;
import flash.globalization.NumberFormatter;
import flash.utils.clearInterval;
import flashx.textLayout.elements.BreakElement;
import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.controls.Text;
import mx.core.FlexGlobals;
import mx.events.CloseEvent;
import mx.events.ListEvent;
import mx.events.SliderEvent;
import mx.formatters.Formatter;
import mx.managers.PopUpManager;
import spark.events.DropDownEvent;
import spark.events.IndexChangeEvent;
import spark.events.TitleWindowBoundsEvent;
//台风10年年份集合
private var dt:Date = new Date();
private var yearnow:String=dt.fullYear.toString();
private var yearReduceOne:int=dt.fullYear-1;
private var yearReduceTwo:int=dt.fullYear-2;
private var yearReduceThree:int=dt.fullYear-3;
private var yearReduceFour:int=dt.fullYear-4;
private var yearReduceFive:int=dt.fullYear-5;
private var yearReduceSix:int=dt.fullYear-6;
private var yearReduceSeven:int=dt.fullYear-7;
private var yearReduceEight:int=dt.fullYear-8;
private var yearReduceNine:int=dt.fullYear-9;
/**
*@autor:hanhh
*@function: 台风功能
*@date:2015/3/8
*/
[Bindable]
private var tfData:ArrayCollection=new ArrayCollection
([
{formatTF_TIME :"2015-1-18 2时",tfLongitude:"113.92020120006099",tfLatitude:"22.58297969742287",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 3时",tfLongitude:"113.90973157163533",tfLatitude:"22.57488953000305",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 4时",tfLongitude:"113.88974409918636",tfLatitude:"22.572510068997218",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 6时",tfLongitude:"113.87023251893855",tfLatitude:"22.573937745600716",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 8时",tfLongitude:"113.84831768307485",tfLatitude:"22.57822077541121",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 12时",tfLongitude:"113.81357755238973",tfLatitude:"22.588214511635698",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 14时",tfLongitude:"113.79075852134382",tfLatitude:"22.599635924463684",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 16时",tfLongitude:"113.77315050990067",tfLatitude:"22.60867787628584",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 18时",tfLongitude:"113.7488800076412",tfLatitude:"22.620099289113824",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 20时",tfLongitude:"113.73317556500272",tfLatitude:"22.63009302533831",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 21时",tfLongitude:"113.72268214196701",tfLatitude:"22.631996594142976",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 23时",tfLongitude:"113.70367024853043",tfLatitude:"22.63247248634414",tfFs :"18",tfQy:"998"}
]);
private var tfDataNew:ArrayCollection=new ArrayCollection
([
{formatTF_TIME :"2015-1-18 4时",tfLongitude:"113.78552370713099",tfLatitude:"22.54586010573192",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 6时",tfLongitude:"113.77695764751",tfLatitude:"22.537769938312096",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 7时",tfLongitude:"113.76172909707269",tfLatitude:"22.53253512409927",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 9时",tfLongitude:"113.74647675202532",tfLatitude:"22.5349145851051",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 11时",tfLongitude:"113.74221751682488",tfLatitude:"22.543956536927254",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 13时",tfLongitude:"113.74124193781248",tfLatitude:"22.561088656169233",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 15时",tfLongitude:"113.7526395560304",tfLatitude:"22.57584131440538",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 17时",tfLongitude:"113.7445969778307",tfLatitude:"22.60249127767068",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 19时",tfLongitude:"113.70697769932852",tfLatitude:"22.60725019968234",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 21时",tfLongitude:"113.66655065683946",tfLatitude:"22.601539493268348",tfFs :"18",tfQy:"998"},
{formatTF_TIME :"2015-1-18 23时",tfLongitude:"113.62800338854501",tfLatitude:"22.576793098807713",tfFs :"18",tfQy:"998"}
]);
[Bindable]
// 是否播放了.0:未播放,1:播放了。以播放情况下才可以通过列表关联到气泡
private var isPlay:Number = 0;
// 判断是不是播放到最后一点
public var isPlayEndPoint:Boolean = false;
// 判断台风是否在播放中
public var isPlaying:Boolean = false;
// 保存单击双击事件的状态
public var tfxxTitle :String=null; //保存台风的中文名以便导出时使用
public var tfZWName:String=null;
// 保存单击双击事件的状态
private var interval :Number= 0;
private var tfInfoLayer:GraphicsLayer;//显示台风信息
private var showTfNameIndex:String="";
[Bindable]
private var tfHistoryList:ArrayCollection=new ArrayCollection
([
{id:"201501",happenTime:"2015-1-18",tfZhName:"",tfName :"MEaKKHLA",tfqd:"台风"},
{id:"201502",happenTime:"2015-2-18",tfZhName:"",tfName :"HIGOS",tfqd:"强台风"}
]);
private var typhoonSpeed:Number=0;
/**
* 初始化页面
* @autor:hanhh
*/
public function init():void{
this.isResizeable = false;
//取得当年台风列表
var tfHappendTime:String;
tfHappendTime=tfYear_DropDownList.selectedItem.tfHappendTime;
//add by gwli
graphicsLayer=new GraphicsLayer();
map.addLayer(graphicsLayer); //add hanhh
tfInfoLayer=new GraphicsLayer()
map.addLayer(tfInfoLayer);
}
/**
* 播放、停止
* @autor:hanhh
*/
public function button1_clickHandler(event:MouseEvent):void {
graphicsLayer.clear();
points =new Array();
//再次播放时定位到最上面
if(tfData.length>10){
this.dataGrid.selectedIndex = 0;
this.dataGrid.verticalScrollPosition=dataGrid.selectedIndex;
}
isPlaying = true;
isPlay = 0;
this.backButton.enabled = false;
this.playbutton.enabled = false;
recor=0;
intervaltime = setInterval(drawTrace, typhoonSpeed,tfData); //播放速度关联
}
private var points:Array;//保存表格数据集的经纬度点集合
private var polyline:Polyline;//线定义
private var lastDrawGraphic:Graphic; //保存绘制线graphic
private var GraphicMarker:Graphic;//保存绘制点轨迹graphic
private var GraphicPicture:Graphic;//保存图片picturegraphic
[Bindable]
private var graphicsLayer:GraphicsLayer;//显示绘制图的layer //private var picgraphicsLayer:GraphicsLayer;//显示swf图标的layer
//定时器
private var intervaltime:uint;
private var recor:int=0;//用来判断是否结束时间间隔函数的标识
/**
* 绘制轨迹函数
* data,表格数据集,含有经纬度信息,用来描绘用的
*/
public function drawTrace(data:ArrayCollection):void{
//判断是否删除台风动态swf图标,保证地图上只显示一个
if(GraphicPicture!=null && recor<data.length){
graphicsLayer.remove(GraphicPicture);
}
polyline = new Polyline();
lastDrawGraphic = new Graphic();
GraphicMarker = new Graphic();
GraphicPicture = new Graphic();
lastDrawGraphic.symbol = new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, 0xDD2222, 0.8, 2);//设置线符号
GraphicMarker.symbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 13, 0x0033DD);//设置点符号
GraphicPicture.symbol = pic;
if(recor<data.length){
this.dataGrid.selectedIndex = recor;//实现轨迹点和datagrid的联动效果
// 【台风改造】当台风的定位信息只有一页时,点击播放按钮,播放完毕后,整个数据会上移,而没有滚动条
// 当前选择行居中
if(recor>9){
this.dataGrid.verticalScrollPosition=dataGrid.selectedIndex-3;
}
var mp:MapPoint = new MapPoint(Number(data.getItemAt(recor).tfLongitude),Number(data.getItemAt(recor).tfLatitude),map.spatialReference);//获取经纬度信息, 转换为点
GraphicMarker.geometry = mp;
GraphicMarker.attributes = { tfLongitude: data.getItemAt(recor).tfLongitude,tfLatitude: data.getItemAt(recor).tfLatitude,formatTF_TIME: data.getItemAt(recor).formatTF_TIME,tfFs: data.getItemAt(recor).tfFs, tfQy: data.getItemAt(recor).tfQy };//台风时间,风速,气压
GraphicPicture.geometry =mp;
points.push(mp);
polyline.addPath(points);
lastDrawGraphic.geometry = polyline;
//GraphicMarker.addEventListener(MouseEvent.CLICK, onGraphicClick);//添加点单击graphic的监控事件
GraphicMarker.addEventListener(MouseEvent.MOUSE_OVER, onGraphicMouseOver);//添加鼠标overgraphic的监控事件
GraphicMarker.addEventListener(MouseEvent.MOUSE_OUT, onGraphicMouseOut);//添加鼠标outgraphic的监控事件
graphicsLayer.add(lastDrawGraphic);//添加线
graphicsLayer.add(GraphicPicture);//添加swf台风图标
graphicsLayer.add(GraphicMarker);//添加点
if(points.length>1)
map.zoomTo(polyline);
else
map.zoomTo(mp);
}
else{
if(intervaltime){
clearInterval(intervaltime);
}
this.backButton.enabled = true;
this.playbutton.enabled = true;
}
recor++;
}
/**
* graphic mouseover事件
* 获取各个时刻的点轨迹详细信息
* 气泡弹出框来显示详细的信息
*/
private function onGraphicMouseOver(event:MouseEvent):void
{
var graphic:Graphic=event.currentTarget as Graphic;
//Alert.show("经纬度:"+graphic.attributes.tfLongitude+","+graphic.attributes.tfLatitude+"\n"+"台风时间:"+graphic.attributes.formatTF_TIME+"\n"+"风速:"+graphic.attributes.tfFs+"\n"+"气压:"+graphic.attributes.tfQy);
var text:Text = new Text();
text.text="经纬度:"+graphic.attributes.tfLongitude+","+graphic.attributes.tfLatitude+"\n"+"台风时间:"+graphic.attributes.formatTF_TIME+"\n"+"风速:"+graphic.attributes.tfFs+"\n"+"气压:"+graphic.attributes.tfQy;
map.infoWindow.content =text;
map.infoWindow.closeButtonVisible=true;
map.infoWindow.show(graphic.geometry as MapPoint);
}
/**
* graphic mouseout事件
* 获取各个时刻的点轨迹详细信息
* 气泡弹出框来显示详细的信息
*/
private function onGraphicMouseOut(event:MouseEvent):void
{
map.infoWindow.hide();
}
/**
* 改变播放速度
* @autor:hanhh
*/
private function changeSpend(event:SliderEvent):void{
// 修改播放速度,在右端播放速度快
typhoonSpeed =(0.5-Number(this.timeSelect.value))*1000;
}
/**
*在年份下拉列表选择某一年取得台风列表
* @autor:hanhh
*/
protected function dropDownYearList_closeHandler(event:DropDownEvent):void{
//取得选取台风发生年份
var tfHappendTime:String=tfYear_DropDownList.selectedItem.tfHappendTime;
}
/**
* @autor:hanhh
*单击台风列表取得台风的详细信息
*/
private function tfitemClick(event:ListEvent):void{
tfInfoLayer.clear();
this.playbutton.enabled = true;
this.backButton.enabled = true;
isPlay = 0;
this.playbutton.enabled = true;
// 修改播放速度,在右端播放速度快
typhoonSpeed =Number(this.timeSelect.value)*1000;
//得到选择项目的objec
var selectedObj:*=this.tfDataGrid.selectedItem as Object;
//如果有数据则弹出详细台风数据窗口
if(selectedObj.tfZhName!="没有台风数据"){
this.title.text=selectedObj.tfZhName+"("+selectedObj.tfName+")定位信息";
this.tfDetail.visible=true;
this.backButton.visible = true;
this.tf.visible=false;
this.playbutton.visible = true;
tfxxTitle =selectedObj.tfZhName+"("+selectedObj.tfName+")";
tfZWName=selectedObj.tfZhName;
tfData=null;
tfData =tfDataNew;
} showTfNameIndex = "";
showTfNameIndex += selectedObj.happenTime.substring(0,4)+"年第"+String(selectedObj.id).substr(2,selectedObj.id.length)+"号台风 "+selectedObj.tfZhName+"("+selectedObj.tfName+")\n";
var textSymbol:TextSymbol=new TextSymbol(showTfNameIndex);
this.left= Capabilities.screenResolutionX/7-this.width/7;
this.top=Capabilities.screenResolutionY/7;
var point:MapPoint=map.toMapFromStage(Number(this.left),Number(this.top));
var graphic:Graphic=new Graphic(point);
var textFormat:TextFormat=new TextFormat("Arial", 16, 0xe10601, true);
textSymbol.textFormat=textFormat;
graphic.symbol=textSymbol;
tfInfoLayer.add(graphic);
}
/**
* 风列表修改
* @autor:hanhh
* */
public function openTfInfo(event:Event):void{
this.tfDetail.visible=false;
this.backButton.visible = false;
this.title.text="台风列表";
this.tf.visible=true;
}
//台风年份数据绑定
[Bindable]
private var arrYear:ArrayCollection=new ArrayCollection
([
{tfHappendTime:yearnow},{tfHappendTime:yearReduceOne},{tfHappendTime:yearReduceTwo},{tfHappendTime:yearReduceThree},{tfHappendTime:yearReduceFour},
{tfHappendTime:yearReduceFive},{tfHappendTime:yearReduceSix},{tfHappendTime:yearReduceSeven},{tfHappendTime:yearReduceEight},{tfHappendTime:yearReduceNine}
]);
/**
* 关闭事件
* @autor:hanhh
* */
private function widgetClosedHandler(event:Event):void
{
graphicsLayer.clear();
tfInfoLayer.clear();
} ]]>
</fx:Script>
<fx:Declarations>
<esri:PictureMarkerSymbol id="pic" source="@Embed(source='assets/images/tf.swf')"/>
</fx:Declarations>
<viewer:WidgetTemplate id="wTemplate" width="100%" height="100%" closed="widgetClosedHandler(event)">
<s:Label text="台风列表" id="title" height="20" paddingTop="5" paddingLeft="5"/>
<mx:LinkButton height="20" width="20" id="backButton" click="openTfInfo(event)" icon="@Embed('widgets/ActualWeather/images/BACK.png')" visible="false" right="5"/>
<s:VGroup id="tf" paddingBottom="5" paddingLeft="5" paddingRight="5" paddingTop="25" gap="5" horizontalAlign="center" width="98%" height="100%" visible="true" >
<s:HGroup verticalAlign="middle" width="100%">
<!--根据年份选择台风下拉列表-->
<s:Label text="选择查看的台风年份:" width="60%" fontFamily="宋体"/>
<s:DropDownList id="tfYear_DropDownList" dataProvider="{arrYear}" labelField="tfHappendTime" close="dropDownYearList_closeHandler(event)" prompt="请选择台风年份" selectedIndex="0" width="40%"></s:DropDownList>
</s:HGroup>
<mx:DataGrid id="tfDataGrid" itemClick="tfitemClick(event)" doubleClickEnabled="true" width="100%" rowCount="12" dataProvider="{tfHistoryList}">
<mx:columns >
<mx:DataGridColumn headerText="台风编号" minWidth="50" dataField="id"/>
<mx:DataGridColumn headerText="台风名" minWidth="70" dataField="tfZhName" />
<mx:DataGridColumn headerText="强度" minWidth="90" dataField="tfqd" />
</mx:columns>
</mx:DataGrid>
</s:VGroup>
<s:VGroup paddingBottom="5" paddingLeft="5" paddingRight="5" paddingTop="25" gap="5" horizontalAlign="center" id="tfDetail" visible="false" width="98%">
<s:HGroup width="100%">
<mx:DataGrid dataProvider="{tfData}" id="dataGrid" horizontalScrollPolicy="auto" verticalScrollPolicy="auto" rowCount="11" width="100%" >
<mx:columns>
<mx:DataGridColumn textAlign="center" headerText="台风时间" width="80" dataField="formatTF_TIME"/>
<mx:DataGridColumn textAlign="center" headerText="经度(°)" width="50" dataField="tfLongitude"/>
<mx:DataGridColumn textAlign="center" headerText="纬度(°)" width="50" dataField="tfLatitude"/>
<mx:DataGridColumn textAlign="center" headerText="风速(m/s)" dataField="tfFs" width="50"/>
<mx:DataGridColumn textAlign="center" headerText="气压(Pa)" dataField="tfQy" width="50"/>
</mx:columns>
</mx:DataGrid>
</s:HGroup>
<s:HGroup width="100%" paddingTop="5">
<mx:HRule width="100%" strokeWidth="2" alpha="0.5" id="qx" />
</s:HGroup>
<s:HGroup width="100%" verticalAlign="middle" paddingBottom="0" >
<s:Label text="播放速度:"/>
<mx:HSlider minimum="0.1" maximum="0.4" value="0.4" dataTipPlacement="top" change="changeSpend(event)"
tickColor="black"
snapInterval="0.1" tickInterval="0.1"
allowTrackClick="true"
liveDragging="true" id="timeSelect"
/>
<s:Button id="playbutton" label="播放" width="60" click="button1_clickHandler(event)"/>
</s:HGroup>
</s:VGroup>
</viewer:WidgetTemplate>
</viewer:BaseWidget>

备注:

GIS技术交流QQ群:432512093

WebGIS二次开发培训入门群: 238339408

天津政府应急系统之GIS一张图(arcgis api for flex)讲解(十三)台风模块的更多相关文章

  1. 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(一)GIS一张图的系统开发环境以及flexviewer框架

    系统的GIS功能实现是基于arcgis api for flex,首先附上系统的主界面图,接下来的是对主界面的模块功能详细讲解: 一.GIS环境软件安装 (1)arcgis desktop的安装,要是 ...

  2. 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(十)态势标绘模块

    config.xml文件的配置如下: <widget label="态势标绘" icon="assets/images/impact_area_over.png&q ...

  3. 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(八)资源搜索模块

    config.xml文件的配置如下: <widget label="资源搜索" icon="assets/images/public_impact_over.png ...

  4. 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(二)鹰眼模块

    讲解GIS功能模块实现之前,先大概说一下flexviewer的核心配置文件config.xml,系统额GIS功能widget菜单布局.系统的样式.地图资源等等都是在这里配置的,这里对flexviewe ...

  5. 天津政府应急系统之GIS一张图(arcgis api for flex)解说(二)鹰眼模块

    解说GIS功能模块实现之前,先大概说一下flexviewer的核心配置文件config.xml,系统额GIS功能widget菜单布局.系统的样式.地图资源等等都是在这里配置的,这里对flexviewe ...

  6. 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(十一)路径导航模块

    config.xml文件的配置如下: <widget label="路径导航" icon="assets/images/lujingdaohang.png" ...

  7. 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(六)地图搜索模块

    config.xml文件的配置如下: <widget label="地图搜索" icon="assets/images/emergency_resource_ove ...

  8. 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(四)地图导航控件模块

    config.xml文件的配置如下: <widget left="10" top="50" config="widgets/Navigation ...

  9. 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(三)显示地图坐标系模块

    config.xml文件的配置如下: <widget left="3" bottom="3" config="widgets/Coordinat ...

随机推荐

  1. 让hammer完美支持Pixi.js - 2D webG库

    由于项目改造,采用2D webG的pixi库,那么基于canvas的结构上,事件就是最大的一个问题了 改造的原理很简单,把hammer里面的addEventListeners事件绑定给第三方库代替,事 ...

  2. 模拟ajax的 script请求

    /** * 模拟ajax的 script请求 * @param {[type]} options [description] * @return {[type]} [description] */ f ...

  3. 关于xcode导出设置中的一些概念

    Development Certificates:在电脑通过秘钥串生成一个私人秘钥,这就是:CertificateSigningRequest.certSigningRequest 简称CSR,团队中 ...

  4. OpenCascade Eigenvalues and Eigenvectors of Square Matrix

    OpenCascade Eigenvalues and Eigenvectors of Square Matrix eryar@163.com Abstract. OpenCascade use th ...

  5. 【原创】机器学习之PageRank算法应用与C#实现(2)球队排名应用与C#代码

    在上一篇文章:机器学习之PageRank算法应用与C#实现(1)算法介绍 中,对PageRank算法的原理和过程进行了详细的介绍,并通过一个很简单的例子对过程进行了讲解.从上一篇文章可以很快的了解Pa ...

  6. 浅谈async、await关键字 => 深谈async、await关键字

    前言 之前写过有关异步的文章,对这方面一直比较弱,感觉还是不太理解,于是会花点时间去好好学习这一块,我们由浅入深,文中若有叙述不稳妥之处,还请批评指正. 话题 (1)是不是将方法用async关键字标识 ...

  7. 如何远程备份MySQL binlog

    以前备份binlog时,都是先在本地进行备份压缩,然后发送到远程服务器中.但是这其中还是有一定风险的,因为日志的备份都是周期性的,如果在某个周期中,服务器宕机了,硬盘损坏了,就可能导致这段时间的bin ...

  8. jQuery中的Sizzle引擎分析

    我分析的jQuery版本是1.8.3.Sizzle代码从3669行开始到5358行,将近2000行的代码,这个引擎的版本还是比较旧,最新的版本已经到v2.2.2了,代码已经超过2000行了.并且还有个 ...

  9. (七)WebGIS中栅格、矢量图层设计之栅格、矢量图层的本质

    文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.何为栅格数据,何为矢量数据? 在GIS中,对于数据格式的分类,我们 ...

  10. 图片每天换及纯css3手风琴特效

    <a target="_blank" id="a"><img id="img" /></a> <s ...