Ok one more question for the group... Now that I have the issue of getting the markers out of database working and displaying the custom markers on the map I wanted to leverage a bit more code from another demo which is the "toggle categories" demos which changes the markers visibility using a checkbox.
The specific demo is located at http://gmaps-samples-flash.googlecode.com/svn/trunk/demos/MarkerCategoriesDemo/MarkerCategoriesDemo.html What I'm finding is that the demo isn't using custom "image" markers but markers that use "fillStyle" in the createMarker function (although it still has embedded images in the code, but I don't think they are being used). I attempted to simply change the property of categories[type] to customIcon[type] in a new toggleCategory function but had a few errors. Any ideas? Code as follows: (from Demo) public function createMarker(latlng:LatLng, name:String, address:String, type:String):void { var markerOptions:MarkerOptions = new MarkerOptions({}); var fillStyle:FillStyle = new FillStyle({color: categories [type].color}); markerOptions.fillStyle = fillStyle; var marker:Marker = new Marker(latlng, markerOptions); var html:String = "<b>" + name + "</b> <br/>" + address; marker.addEventListener(MapMouseEvent.CLICK, function (e:MapMouseEvent):void { marker.openInfoWindow(new InfoWindowOptions ({contentHTML:html})); }); categories[type].markers.push(marker); map.addOverlay(marker); } (categories variable from the demo) private var categories:Object = { "restaurant": { "color": 0xFF0000, "markers": []}, "bar": { "color": 0x0000FF, "markers": []} }; and the toggleCategory function from the demo: private function toggleCategory(type:String):void { for (var i:Number = 0; i < categories[type].markers.length; i+ +) { var marker:Marker = categories[type].markers[i]; if (!marker.visible) { marker.visible = true; } else { marker.visible = false; } } } So the big question is, is it possible to toggle the customImage markers in the same manner? If so how would I go about doing so? The following is my createMarker function (I'm sure you remember this from the last help you guys provided) and my modified toggleCategory function. public function createMarker(latlng:LatLng, name:String, storeInfo:String, type:String): Marker { // var marker:Marker = new Marker(latlng, new MarkerOptions ({iconOffset: new Point(-16, -32)})); var marker:Marker = new Marker(latlng, new MarkerOptions ({icon: new customIcons[type], iconOffset: new Point(-16, -32)})); //var storeInfo:String = "<b>" + name + "</b> <br/>" + address; marker.addEventListener(MapMouseEvent.CLICK, function (e:MapMouseEvent):void { marker.openInfoWindow(new InfoWindowOptions ({contentHTML:storeInfo})); }); return marker; } CustomIcons variable private var customIcons:Object = {"restaurant": blueIcon, "bar": greenIcon}; Modified toggleCategory function (Threw Errors). private function toggleCategory(type:String):void { for (var i:Number = 0; i < customIcons[type].markers.length; i+ +) { var marker:Marker = customIcons[type].markers[i]; if (!marker.visible) { marker.visible = true; } else { marker.visible = false; } } } On Jan 12, 11:20 am, Jonathan Wagner <[email protected]> wrote: > Glad we could help, just make sure that you handle whatever type > you're processing including blanks. If you pass a type that doesn't > have an icon, you will probably get an error as well. > > cheers, > > Jonathan > Scribblemaps.com > > On Jan 12, 1:56 pm, David Green <[email protected]> wrote: > > > You know what.. you both were correct.. > > > You were right about missing images... I had the path correct but... > > I did a dumb thing.. I introduced a new item in the database that > > weren't of the type "restuarant" or "bar" so I think it threw the > > error trying because I didn't have an icon for the new entry... so it > > considered it blank (I think... ). When i removed the entry from the > > database, I no longer had the error and the customIcons loaded up just > > fine. "Woo Hoo"!! > > > Now with the code you just sent, i think it will handle blanks and > > continue to process. > > > I can't thank you guys enough for all of the support that you have > > provided. Now i can move forward with my development.. > > > You guys are great!! > > > David G. > > > On Jan 12, 10:36 am, Jonathan Wagner <[email protected]> wrote: > > > > Pamela is right, you can declare objects that way (learned something > > > new). > > > > I loaded up the project with the images and I am pretty sure I > > > actually found the problem. The problem is that blank strings were > > > getting passed to the type parameter of createMarker, this was causing > > > the icon to be null, what I did was just made it skip any marker that > > > did not have a type declared. > > > > public function readXml(event:Event):void{ > > > var markersXML:XML= newXML(event.target.data); > > > > var markers:XMLList = markersXML..marker; > > > var markersCount:int = markers.length(); > > > var i:Number; > > > for (i=0; i < markersCount; i++) { > > > var markerXml:XML= markers[i]; > > > var name:String = markerx...@name; > > > var address:String = markerx...@address; > > > var type:String = markerx...@type; > > > var latlng:LatLng = new LatLng(markerx...@lat, > > > markerx...@lng); > > > > if(type == "") { continue }; > > > var marker:Marker = createMarker(latlng, name, > > > address, type); > > > map.addOverlay(marker); > > > } > > > } > > > > Hopefully this finally fixes your problem. > > > > Jonathan > > > Scribblemaps.com > > > > On Jan 12, 7:43 am, "pamela (Google Employee)" <[email protected]> > > > wrote: > > > > > Hmm. I'm testing this demo in my Flex now, and it is working with the > > > > properties in quotes. (I do see the AS3 object reference shows without > > > > quotes). Is there a reason it would work for me? > > > > > That code looks like it should work with the customIcon property > > > > commented back in, if the images are actually there. > > > > > You might find it easier to use something like pastebin.com to paste > > > > code, if you can't put it with view-source enabled on a public server, > > > > by the way. > > > > > - pamela > > > > > On Tue, Jan 12, 2010 at 8:51 PM, Jonathan Wagner > > > > <[email protected]> wrote: > > > > > wow, I just figured out the problem, it's the way they are declaring > > > > > the object > > > > > > private var customIcons:Object = { "restaurant": blueIcon, "bar": > > > > > greenIcon} > > > > > > it SHOULD be > > > > > private var customIcons:Object = { restaurant: blueIcon, bar: > > > > > greenIcon} > > > > > > When declaring properties of an object you don't use quotes, sorry I > > > > > wish I would of caught that earlier. > > > > > > Jonathan > > > > > > On Jan 11, 10:19 pm, David Green <[email protected]> wrote: > > > > >> Jonathan, > > > > > >> That's exactly what I did. I have the references correct in embed > > > > >> statement because in Flex it throws an error when the path is > > > > >> incorrect. Now the only thing that I see that is different in the > > > > >> code you sent me is that the customIcon was removed from the new > > > > >> MarkerOptions. > > > > > >> Perhaps you will be able to see something in my code, which I'll > > > > >> paste > > > > >> below. I've combined the Store Finder demo and thexmlparsing > > > > >> demo.. works perfectly except for the customIcons. I'm pulling the > > > > >> data from a mysql database I have set up locally. > > > > > >> Here is my code: > > > > > >> <?xmlversion="1.0" encoding="utf-8"?> > > > > >> <!-- > > > > >> Copyright 2008 Google Inc. > > > > >> Licensed under the Apache License, Version 2.0: > > > > >> http://www.apache.org/licenses/LICENSE-2.0 > > > > >> --> > > > > >> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"; > > > > >> xmlns:maps="com.google.maps.*" layout="absolute" width="100%" > > > > >> height="100%" viewSourceURL="srcview/index.html" > > > > >> xmlns:comp="components.*"> > > > > >> <mx:Panel title="Google Maps API for Flash Demo" width="100%" > > > > >> height="100%"> > > > > >> <mx:HDividedBox width="100%" height="100%"> > > > > >> <mx:VBox width="100%" height="100%"> > > > > >> <mx:HBox> > > > > >> <mx:Label > > > > >> text="Address: " width="70"/> > > > > >> <mx:TextInput id="address" text="Seattle WA" width="100%" /> > > > > >> </mx:HBox> > > > > >> <mx:HBox> > > > > >> <mx:Label > > > > >> text="Radius: " > > > > >> width="70"/> > > > > >> <mx:ComboBox > > > > >> id="radius"> > > > > >> <mx:dataProvider> > > > > >> <mx:Array> > > > > >> <mx:String>25</mx:String> > > > > >> <mx:String>100</mx:String> > > > > >> <mx:String>200</mx:String> > > > > >> </mx:Array> > > > > >> </mx:dataProvider> > > > > >> </mx:ComboBox> > > > > >> </mx:HBox> > > > > >> <mx:Button > > > > >> id="submitButton" label="Search Locations" > > > > >> click="searchLocations(event);" > > > > >> /> > > > > >> <mx:HRule > > > > >> width="100%" > > > > >> strokeColor="0xC4CCCC" > > > > >> shadowColor="0xEEEEEE" > > > > >> strokeWidth="2" > > > > >> /> > > > > >> <mx:DataGrid id="storeLocationsGrid" > > > > >> dataProvider="{storeLocations}" > > > > >> width="100%" height="100%" sortableColumns="true" > > > > >> itemClick="showStore > > > > >> (event)"> > > > > >> <mx:columns> > > > > >> <mx:Array> > > > > >> <mx:DataGridColumn dataField="StoreInfo"> > > > > >> <mx:itemRenderer> > > > > >> <mx:Component> > > > > >> <mx:Text width="100%" selectable="false" > > > > >> htmlText="{data.StoreInfo}"/> > > > > >> </mx:Component> > > > > >> </mx:itemRenderer> > > > > >> </mx:DataGridColumn> > > > > >> <mx:DataGridColumn dataField="Distance" width="70"/> > > > > >> </mx:Array> > > > > >> </mx:columns> > > > > >> </mx:DataGrid> > > > > >> </mx:VBox> > > > > >> <maps:Map > > > > >> id="map" > > > > >> key="ABQIAAAA7QUChpcnvnmXxsjC7s1fCxQGj0PqsCtxKvarsoS- > > > > >> iqLdqZSKfxTd7Xf-2rEc_PC9o8IsJde80Wnj4g" > > > > >> mapevent_mapready="onMapReady(event)" > > > > >> width="100%" height="100%"/> > > > > >> </mx:HDividedBox> > > > > >> </mx:Panel> > > > > >> <mx:Script> > > > > >> <![CDATA[ > > > > >> import com.google.maps.LatLng; > > > > >> import com.google.maps.LatLngBounds; > > > > >> import com.google.maps.Map; > > > > >> import com.google.maps.MapEvent; > > > > >> import com.google.maps.MapMouseEvent; > > > > >> import com.google.maps.MapType; > > > > >> import com.google.maps.overlays.Marker; > > > > >> import com.google.maps.overlays.MarkerOptions; > > > > >> import com.google.maps.InfoWindowOptions; > > > > >> import com.google.maps.services.ClientGeocoder; > > > > >> import com.google.maps.services.GeocodingEvent; > > > > >> import mx.controls.Alert; > > > > >> import mx.collections.ArrayCollection; > > > > >> import com.google.maps.controls.ZoomControl; > > > > > >> [Bindable] private var storeLocations:ArrayCollection = new > > > > >> ArrayCollection(); > > > > > >> private function onMapReady(event:Event):void { > > > > >> map.enableScrollWheelZoom(); > > > > >> map.enableContinuousZoom(); > > > > >> map.setCenter(new LatLng(40, -100), 4); > > > > >> map.addControl(new ZoomControl()); > > > > >> } > > > > > >> [Embed(source="../assets/images/blue-dot.png")] private var > > > > >> blueIcon:Class; > > > > > >> [Embed(source="../assets/images/green-dot.png")] private var > > > > >> greenIcon:Class; > > > > > >> [Bindable] > > > > >> private var customIcons:Object = > > > > >> {"restaurant": blueIcon, "bar": greenIcon}; > > > > > >> private function searchLocations(event:Event):void { > > > > >> var geocoder:ClientGeocoder = new ClientGeocoder(); > > > > >> geocoder.addEventListener( > > > > >> GeocodingEvent.GEOCODING_SUCCESS, > > > > >> function(event:GeocodingEvent):void { > > > > >> var placemarks:Array = event.response.placemarks; > > > > >> if (placemarks.length > 0) { > > > > >> searchLocationsNear(placemarks[0].point); > > > > >> } > > > > >> }); > > > > >> geocoder.addEventListener( > > > > >> GeocodingEvent.GEOCODING_FAILURE, > > > > >> function(event:GeocodingEvent):void { > > > > >> Alert.show("Geocoding failed"); > > > > >> }); > > > > >> geocoder.geocode(address.text); > > > > >> } > > ... > > read more »
-- You received this message because you are subscribed to the Google Groups "Google Maps API For Flash" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/google-maps-api-for-flash?hl=en.
