flex 多个站点弹出层 (替代infowindow)-CSDN博客

本文链接：https://blog.csdn.net/big1989wmf/article/details/84737555

效果图：

[img]http://dl2.iteye.com/upload/attachment/0110/9664/798ff954-ed51-331c-bd49-878f71e29ba3.png[/img]

<!--弹出层-->
		<esri:InfoSymbol id="infoSymbol1">
			<esri:infoRenderer>
				<fx:Component>
					<s:DataRenderer>
						<s:layout>
							<s:VerticalLayout/>
						</s:layout>
						<s:Group>
							<s:Label text="{data.stnm}" left="0"/>
							<s:Image source="assets/symbol/warn.png" left="120" toolTip="闸门故障" visible="{!data.workable}"/>
						</s:Group>
						<s:HGroup verticalAlign="middle">
							<s:Label text="{data.stnm.toString().indexOf('闸')==-1?'开闸':'泵机'}："/>
							<s:Image source="assets/icon/dong2.png"/>
							<s:Image source="assets/symbol/{data.stnm.toString().indexOf('闸')==-1?'闸门':'泵站'}{data.devNum.toString().substr(1,1)=='1'?'关闭':'开启'}.png"/>
							<s:Image source="assets/symbol/{data.stnm.toString().indexOf('闸')==-1?'闸门':'泵站'}{data.devNum.toString().substr(2,1)=='1'?'关闭':'开启'}.png"/>
							<s:Image source="assets/symbol/{data.stnm.toString().indexOf('闸')==-1?'闸门':'泵站'}{data.devNum.toString().substr(3,1)=='1'?'关闭':'开启'}.png"/>
							<s:Image source="assets/symbol/{data.stnm.toString().indexOf('闸')==-1?'闸门':'泵站'}{data.devNum.toString().substr(4,1)=='1'?'开启':'关闭'}.png"/>
							<s:Image source="assets/symbol/{data.stnm.toString().indexOf('闸')==-1?'闸门':'泵站'}{data.devNum.toString().substr(5,1)=='1'?'开启':'关闭'}.png"/>
						</s:HGroup>
						<s:Label text="{data.q}"/>
						<s:Label text="{data.up}"/>
						<s:Label text="{data.down}"/>
					</s:DataRenderer>
				</fx:Component>
			</esri:infoRenderer>
		</esri:InfoSymbol>

		<esri:InfoSymbol id="infoSymbol2" containerStyleName="infostyle" infoPlacement="upperLeft">
			<esri:infoRenderer>
				<fx:Component>
					<s:DataRenderer>
						<s:layout>
							<s:VerticalLayout/>
						</s:layout>
						<s:Label text="{data.stnm}"/>
						<s:HGroup verticalAlign="middle">
							<s:Label text="{data.stnm.toString().indexOf('闸')==-1?'开闸':'泵机'}："/>
							<s:Image source="assets/icon/dong.png"/>
							<s:Image source="assets/symbol/{data.stnm.toString().indexOf('闸')==-1?'闸门':'泵站'}{data.devNum.toString().substr(1,1)=='1'?'开启':'关闭'}.png"/>
							<s:Image source="assets/symbol/{data.stnm.toString().indexOf('闸')==-1?'闸门':'泵站'}{data.devNum.toString().substr(2,1)=='1'?'开启':'关闭'}.png"/>
							<s:Image source="assets/symbol/{data.stnm.toString().indexOf('闸')==-1?'闸门':'泵站'}{data.devNum.toString().substr(3,1)=='1'?'开启':'关闭'}.png"/>
							<s:Image source="assets/symbol/{data.stnm.toString().indexOf('闸')==-1?'闸门':'泵站'}{data.devNum.toString().substr(4,1)=='1'?'开启':'关闭'}.png"/>
							<s:Image source="assets/symbol/{data.stnm.toString().indexOf('闸')==-1?'闸门':'泵站'}{data.devNum.toString().substr(5,1)=='1'?'开启':'关闭'}.png"/>
						</s:HGroup>
						<s:Label text="{data.q}"/>
						<s:Label text="{data.up}"/>
						<s:Label text="{data.down}"/>
					</s:DataRenderer>
				</fx:Component>
			</esri:infoRenderer>
		</esri:InfoSymbol>

		<esri:InfoSymbol id="infoSymbol3" containerStyleName="infostyle" infoPlacement="lowerLeft">
			<esri:infoRenderer>
				<fx:Component>
					<s:DataRenderer>
						<s:layout>
							<s:VerticalLayout/>
						</s:layout>
						<s:Label text="{data.stnm}"/>
						<s:HGroup verticalAlign="middle">
							<s:Label text="{data.stnm.toString().indexOf('闸')==-1?'开闸':'泵机'}："/>
							<s:Image source="assets/icon/dong.png"/>
							<s:Image source="assets/symbol/{data.stnm.toString().indexOf('闸')==-1?'闸门':'泵站'}{data.devNum.toString().substr(1,1)=='1'?'关闭':'开启'}.png"/>
							<s:Image source="assets/symbol/{data.stnm.toString().indexOf('闸')==-1?'闸门':'泵站'}{data.devNum.toString().substr(2,1)=='1'?'关闭':'开启'}.png"/>
							<s:Image source="assets/symbol/{data.stnm.toString().indexOf('闸')==-1?'闸门':'泵站'}{data.devNum.toString().substr(3,1)=='1'?'关闭':'开启'}.png"/>
							<s:Image source="assets/symbol/{data.stnm.toString().indexOf('闸')==-1?'闸门':'泵站'}{data.devNum.toString().substr(4,1)=='1'?'开启':'关闭'}.png"/>
							<s:Image source="assets/symbol/{data.stnm.toString().indexOf('闸')==-1?'闸门':'泵站'}{data.devNum.toString().substr(5,1)=='1'?'开启':'关闭'}.png"/>
						</s:HGroup>
						<s:Label text="{data.q}"/>
						<s:Label text="{data.up}"/>
						<s:Label text="{data.down}"/>
					</s:DataRenderer>
				</fx:Component>
			</esri:infoRenderer>
		</esri:InfoSymbol>

		<esri:InfoSymbol id="infoSymbol4" containerStyleName="infostyle" infoPlacement="bottom">
			<esri:infoRenderer>
				<fx:Component>
					<s:DataRenderer>
						<s:layout>
							<s:VerticalLayout/>
						</s:layout>
						<s:Label text="{data.stnm}"/>
						<s:HGroup verticalAlign="middle">
							<s:Label text="{data.stnm.toString().indexOf('闸')==-1?'开闸':'泵机'}："/>
							<s:Image source="assets/icon/dong.png"/>
							<s:Image source="assets/symbol/{data.stnm.toString().indexOf('闸')==-1?'闸门':'泵站'}{data.devNum.toString().substr(1,1)=='1'?'开启':'关闭'}.png"/>
							<s:Image source="assets/symbol/{data.stnm.toString().indexOf('闸')==-1?'闸门':'泵站'}{data.devNum.toString().substr(2,1)=='1'?'开启':'关闭'}.png"/>
							<s:Image source="assets/symbol/{data.stnm.toString().indexOf('闸')==-1?'闸门':'泵站'}{data.devNum.toString().substr(3,1)=='1'?'开启':'关闭'}.png"/>
							<s:Image source="assets/symbol/{data.stnm.toString().indexOf('闸')==-1?'闸门':'泵站'}{data.devNum.toString().substr(4,1)=='1'?'开启':'关闭'}.png"/>
							<s:Image source="assets/symbol/{data.stnm.toString().indexOf('闸')==-1?'闸门':'泵站'}{data.devNum.toString().substr(5,1)=='1'?'开启':'关闭'}.png"/>
						</s:HGroup>
						<s:Label text="{data.q}"/>
						<s:Label text="{data.up}"/>
						<s:Label text="{data.down}"/>
					</s:DataRenderer>
				</fx:Component>
			</esri:infoRenderer>
		</esri:InfoSymbol>

public function drawGraphic():void
			{
				waterTRLayer.clear();
				var graphic:Graphic;
				var data:Object;
				for(var i:int=0;i<waterTRArr.length;i++)
				{
					var point:MapPoint=new MapPoint(waterTRArr[i].lgtd,waterTRArr[i].lttd);
					var graphic2:Graphic=new Graphic(point,null,new Object());
					//var graphicStnm:Graphic=new Graphic(point,null,new Object());
					//var symbol:WaterSymbol=new WaterSymbol(11,0x000099);//蓝色三角形

					graphic2.attributes.name=waterTRArr[i].stnm;
					graphic2.symbol=reservoirSourceSymbol;

					//graphicStnm.attributes.stnm_z=waterTRArr[i].stnm_z;
					//graphicStnm.symbol=csWater;

					waterTRLayer.add(graphic2);
					//waterTRLayer.add(graphicStnm);
					if(btn1Flag){
						if(i==0){
							data={
								stnm:waterTRArr[i].stnm,
									workable:true,
									q:"出库流量：0.000m³/s",
									up:"坝上水位：90.62m",
									down:"坝下水位：0.00m",
									devNum:"011100"
							};
							graphic=new Graphic(point,infoSymbol1,data);
						}else if(i==1){
							data={
								stnm:waterTRArr[i].stnm,
									workable:true,
									q:"出库流量：95.204m³/s",
									up:"坝上水位：94.81m",
									down:"坝下水位：32.33m",
									devNum:"110000"
							};
							graphic=new Graphic(point,infoSymbol2,data);
						}else if(i==2){
							data={
								stnm:waterTRArr[i].stnm,
									workable:false,
									q:"出库流量：128.339 m³/s",
									up:"坝上水位：125.62m",
									down:"坝下水位：89.49m",
									devNum:"000000"
							};
							graphic=new Graphic(point,infoSymbol3,data);
						}else if(i==3){
							data={
								stnm:waterTRArr[i].stnm,
									workable:true,
									q:"出库流量：140.346m³/s",
									up:"坝上水位：134.32m",
									down:"坝上水位：92.35m",
									devNum:"111110"
							};
							graphic=new Graphic(point,infoSymbol4,data);
						}
						waterTRLayer.add(graphic);
					}else if(btn2Flag){
						if(i==0){
							data={
								stnm:waterTRArr[i].stnm,
									workable:true,
									q:"出库流量：0.000m³/s",
									up:"坝上水位：90.00m",
									down:"坝下水位：0.00m",
									devNum:"011100"
							};
							graphic=new Graphic(point,infoSymbol1,data);
						}else if(i==1){
							data={
								stnm:waterTRArr[i].stnm,
									workable:true,
									q:"出库流量：95.000m³/s",
									up:"坝上水位：94.00m",
									down:"坝下水位：32.00m",
									devNum:"110000"
							};
							graphic=new Graphic(point,infoSymbol2,data);
						}else if(i==2){
							data={
								stnm:waterTRArr[i].stnm,
									workable:false,
									q:"出库流量：128.00 m³/s",
									up:"坝上水位：125.00m",
									down:"坝下水位：89.00m",
									devNum:"000000"
							};
							graphic=new Graphic(point,infoSymbol3,data);
						}else if(i==3){
							data={
								stnm:waterTRArr[i].stnm,
									workable:true,
									q:"出库流量：150.000m³/s",
									up:"坝上水位：130.00m",
									down:"坝上水位：90.00m",
									devNum:"111110"
							};
							graphic=new Graphic(point,infoSymbol4,data);
						}
						waterTRLayer.add(graphic);
					}
				}
				map.addLayer(waterTRLayer);

			}