Ocean Breeze Controls

The OceanBreezeControls component consist of a set of visible map controls allowing panning, zooming, and map view changing. The TileMapComponent.swc contains Flex Builder 3 drag and drop versions of the controls contained in the OceanBreezeControls component.

Each of the Ocean Breeze Controls can be added to a tilemap by calling the map's addControl() method.

			//add an OBLargeZoomControl to a map
			this.map.addControl(new OBLargeZoomControl());

			OR

			//create an instance of an OBLargeZoomControl
			var oblzc:OBLargeZoomControl = new OBLargeZoomControl();

			//add the instance to the map
			this.map.addControl(this.oblzc);
			

Each of the Ocean Breeze Controls can be removed from a tilemap by calling the map's removeControl() method, and passing the instance of the control to be removed.

			//remove the instance of the OceanBreezeLargeZoomControl from the map
			this.map.removeControl(this.oblzc);
			

Each of the Ocean Breeze Controls allow developers the option of displaying drop shadows behind the controls, and displaying tooltips for each of the controls. By default, the drop shadows are disabled, and the tooltips are enabled. The constructors for each of the Ocean Breeze Controls are show below.

			OBLargeZoomControl(useShadow:Boolean=false,useTooltip:Boolean=true)

			OBMediumZoomControl(useShadow:Boolean=false,useTooltip:Boolean=true)

			OBZoomControl(useShadow:Boolean=false,useTooltip:Boolean=true)

			OBPanControl(useShadow:Boolean=false,useTooltip:Boolean=true)

			OBViewControl(useShadow:Boolean=false,useTooltip:Boolean=true)
			

The OBPanControl consists of four arrows marking geographical directions (N,S,E,W). When one of the arrows is clicked, the map associated with the control pans in that direction. In the image below, the OBPan Control is located at the bottom lefthand corner of the map.

The OBZoomControl consists of two buttons. The button displaying the + zooms the map in. The button displaying the - zooms the map out. In the image below, the OBZoomControl is located at the bottom righthand corner of the map.

The OBMediumZoomControl consists of an OBPanControl, and a vertically stacked OBZoomControl. In the image below, the OBMediumZoomControl is located in the center of the map, at the top.

The OBLargeZoomControl consists of an OBPanControl, a vertically stacked OBZoomControl, and a vertical slider bar which can be used to zoom the map in and out. The slider bar can also be clicked to jump to a specific zoom level. In the image below, the OBLargeZoomControl is located at the top lefthand corner of the map.

The OBViewControl consists of two buttons, Street Map and Aerial Map. When one of the buttons is clicked, its background turns white, while the other button's background turns blue. While clicking one of the buttons will change the map's view between the available map types, programatic changes to the map type will also cause the buttons on the control to change accordingly. When the Aerial Map button is selected, a checkbox appears allowing users to enable or disable labels on the aerial map (sat map type vs. hyb map type). In the image below, the OBViewControl is located at the top righthand corner of the map.