This being my first Flex app I've had a lot of fun tinkering with it, but I've been trying to implement the multiple categories functionality without much luck. I've done a bunch of reading on associative arrays and such, but it must not be setting in because I haven't been able to figure this part out.
Basically I want the user to be able to filter the results down by using any or all the categories. From what I was able to pull from the demos it'll filter off of 1 category fine, but the minute you use another category it ignores the filtered checkboxes from the other category completely. I've commented out the other toggle functions because I know that I'm going to have to rewrite it into a master toggle that handles all the categories, but first I have to get the data into the array! When I load it up it gives me the error "TypeError: Error #1010: A term is undefined and has no properties." Also any thoughts on how I can work with the markers with a date or multiple dates attached to them? Here's the source code for the app as it is now, any help would be great! <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"; layout="absolute" xmlns:maps="com.google.maps.*" width="100%" height="100%" creationComplete="amfService.getOperation('get').send ('amfphp_maps_ride_event','','','','','views2_service_feed_1');" backgroundGradientAlphas="[1.0, 1.0]" backgroundGradientColors="[#FFFFFF, #FFFFFF]" xmlns:ns1="com.arc90.flexlib.containers.*"> <mx:RemoteObject id="amfService" fault="faultHandler(event)" showBusyCursor="true" source="views2" destination="amfphp"> <mx:method name="get" result="resultHandler(event)" /> </mx:RemoteObject> <mx:Script> <![CDATA[ import mx.controls.Text; import com.google.maps.InfoWindowOptions; import com.google.maps.controls.MapTypeControl; import com.google.maps.controls.ZoomControl; import com.google.maps.MapEvent; import com.google.maps.overlays.MarkerOptions; import com.google.maps.LatLng; import com.google.maps.MapType; import com.google.maps.overlays.Marker; import com.google.maps.MapMouseEvent; import com.google.maps.InfoWindowOptions; import com.google.maps.services.ClientGeocoder; import com.google.maps.services.ClientGeocoderOptions; import com.google.maps.services.GeocodingEvent; import mx.collections.ArrayCollection; import mx.rpc.remoting.RemoteObject; import mx.rpc.events.ResultEvent; import mx.rpc.events.FaultEvent; import mx.controls.Alert; import mx.utils.ArrayUtil; import mx.controls.dataGridClasses.DataGridColumn; import com.arc90.flexlib.containers.CollapsiblePanel; [Bindable] public var resObject:Object; public var list:Array; private var RideTypeTerms:Object = { "Road": { "markers": []}, "Mountain": { "markers": []}, "Cross": { "markers": []}, "Family": { "markers": []}, "Fit": { "markers": []}, "Single Speed": { "markers": []}, "Spin Indoors": { "markers": []}, "Tandem": { "markers": []}, "Track": { "markers": []} }; private var LengthTerms:Object = { "Less 15": { "markers": []}, "15 - 30": { "markers": []}, "31 - 50": { "markers": []}, "51 - 85": { "markers": []}, "86 - 125": { "markers": []}, "126+": { "markers": []} }; private var TerrainTerms:Object = { "A - Flat": { "markers": []}, "B - Rolling": { "markers": []}, "C - Hilly": { "markers": []}, "D - Mountainous": { "markers": []} }; private var RideEventTerms:Object = { "Ride Type": { "Road": { "markers": []}, "Mountain": { "markers": []}, "Cross": { "markers": []}, "Family": { "markers": []}, "Fit": { "markers": []}, "Single Speed": { "markers": []}, "Spin Indoors": { "markers": []}, "Tandem": { "markers": []}, "Track": { "markers": []}}, "Length": { "Less 15": { "markers": []}, "15 - 30": { "markers": []}, "31 - 50": { "markers": []}, "51 - 85": { "markers": []}, "86 - 125": { "markers": []}, "126+": { "markers": []}}, "Terrain": { "A - Flat": { "markers": []}, "B - Rolling": { "markers": []}, "C - Hilly": { "markers": []}, "D - Mountainous": { "markers": []}} }; public function resultHandler(event:ResultEvent):void { list = ArrayUtil.toArray(event.result); for(var i:int=0; i<list.length; i++) { var nid:String = list[i].nid; var name:String = list[i].title; var rideType:String = list[i].tid; var rideLength:String = list[i].tid_1; var rideTerrain:String = list[i].tid_2; var rideDate:String = list[i].field_ride_date_value; var latlng:LatLng = new LatLng(list[i].latitude, list [i].longitude); createMarker(latlng, name, rideDate, rideType, rideLength, rideTerrain, nid); } } public function createMarker(latlng:LatLng, name:String, rideDate:String, rideType:String, rideLength:String, rideTerrain:String, nid:String):void { var markerOptions:MarkerOptions = new MarkerOptions({}); markerOptions.tooltip = name; var marker:Marker = new Marker(latlng, markerOptions); // Information to be displayed in the InfoWindow // TODO Change it to be customContent so it can be styled correctly var html:String = "Ride Date: " + rideDate + "<br/>Ride Characteristics<br/>" + "Ride Type: " + rideType + "<br/>Ride Length: " + rideLength + "<br/>Ride Terrain: " + rideTerrain; var v_titleHTML:String = "<b><u><a href=\"/node/" + nid + "\">" + name + "</a></u></b>"; marker.addEventListener(MapMouseEvent.CLICK, function (e:MapMouseEvent):void { marker.openInfoWindow(new InfoWindowOptions( { contentHTML:html, titleHTML:v_titleHTML, width:300, padding:10 })); }); //RideTypeTerms[rideType].markers.push(marker); //LengthTerms[rideLength].markers.push(marker); //TerrainTerms[rideTerrain].markers.push(marker); RideEventTerms[{"Ride Type":[rideType]},{"Length": [rideLength]},{"Terrain":[rideTerrain]}].markers.push(marker); map.addOverlay(marker); } public function faultHandler (event:FaultEvent):void { // Deal with event.faultstring, etc. Alert.show('failed', 'alert box',mx.controls.Alert.OK); } public function onMapReady(e:MapEvent):void { map.setCenter(new LatLng(38.8225909761771,-95.80078125), 4, MapType.NORMAL_MAP_TYPE); map.addControl(new ZoomControl()); map.addControl(new MapTypeControl()); map.enableScrollWheelZoom(); map.enableContinuousZoom(); } private function doGeocode(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) { map.setCenter(placemarks[0].point, 10); } }); geocoder.addEventListener (GeocodingEvent.GEOCODING_FAILURE, function(event:GeocodingEvent):void { Alert.show("Geocoding failed"); }); geocoder.geocode(txtGoToLocation.text); } // ####################################################################################################### // // // // DataGrid functions // private function displayCityState(item:Object, col:DataGridColumn):String { return item.city + ", " + item.province; } private function displayFormattedDate(item:Object, col:DataGridColumn):String { return DateDisplay.format(item.field_ride_date_value); } private function displayRideChar(item:Object, col:DataGridColumn):String { return item.tid + " | " + item.tid_1 + " | " + item.tid_2; } private function displayTitleLink(item:Object, col:DataGridColumn):String { return "<b><u><a href=\"/node/" + item.nid + "\">" + item.title + "</a></u></b>"; } // ######################################################################################################## // // // // Shared Functions // private function toggleRideType(type:String):void { // original // for (var i:Number = 0; i < RideTypeTerms [type].markers.length; i++) { // var marker:Marker = RideTypeTerms[type].markers[i]; // if (!marker.visible) // { // marker.visible = true; // } // else // { // marker.visible = false; // } // } } private function toggleLength(type:String):void { // original // for (var i:Number = 0; i < LengthTerms [type].markers.length; i++) { // var marker:Marker = LengthTerms[type].markers[i]; // if (!marker.visible) // { // marker.visible = true; // } // else // { // marker.visible = false; // } // } } private function toggleTerrain(type:String):void { // original // for (var i:Number = 0; i < TerrainTerms [type].markers.length; i++) { // var marker:Marker = TerrainTerms[type].markers[i]; // if (!marker.visible) // { // marker.visible = true; // } // else // { // marker.visible = false; // } // } } ]]> </mx:Script> <!-- DateFormatter and defined parameters.--> <mx:DateFormatter id="DateDisplay" formatString="MMMM D, YYYY"/> <mx:TabNavigator y="42" width="890" height="97%" x="5"> <mx:Canvas label="Map"> <maps:Map x="10" y="37" width="868" height="612" id="map" key="ABQIAAAAlmuF86SSX0J8nYuc18ml3xT2yXp_ZAY8_ufC3CFXhHIE1NvwkxSYBmDBflD_oa85B7vU7xxWUjqAvw" mapevent_mapready="onMapReady(event)"/> <mx:Button x="832" y="7" label="Go!" id="btnGoToLocation" themeColor="#059827" click="doGeocode(event);"/> <mx:Label x="544" y="9" text="Go to Location" id="lblGoToLocation" fontWeight="bold"/> <mx:TextInput x="637" y="7" width="187" id="txtGoToLocation" themeColor="#059827" enter="doGeocode(event);" /> </mx:Canvas> <mx:Canvas label="List"> <mx:DataGrid x="10" y="10" width="868" height="95%" dataProvider="{list}"> <mx:columns> <mx:DataGridColumn headerText="Ride Name" labelFunction="displayTitleLink" /> <mx:DataGridColumn headerText="Date" labelFunction="displayFormattedDate"/> <mx:DataGridColumn headerText="Ride Characteristics" labelFunction="displayRideChar"/> <mx:DataGridColumn headerText="Location" labelFunction="displayCityState"/> </mx:columns> </mx:DataGrid> </mx:Canvas> </mx:TabNavigator> <ns1:CollapsiblePanel width="233" height="333" title="Filters" id="drpFilters" x="662" y="10" collapsed="true"> <mx:Accordion width="212" height="292" id="filterAccordian"> <mx:Canvas label="Date" width="100%" height="100%"> <mx:DateChooser textAlign="center" horizontalCenter="-8" verticalCenter="-4" id="filterDate"/> </mx:Canvas> <mx:Canvas label="Ride Type" width="100%" height="100%"> <mx:CheckBox x="10" y="10" label="Road" id="chkRideTypeRoad" click="toggleRideType('Road')" selected="true"/> <mx:CheckBox x="10" y="40" label="Mountain" id="chkRideTypeMountain" click="toggleRideType('Mountain')" selected="true"/> <mx:CheckBox x="10" y="70" label="Cross" id="chkRideTypeCross" click="toggleRideType('Cross')" selected="true"/> <mx:CheckBox x="10" y="100" label="Family" id="chkRideTypeFamily" click="toggleRideType('Family')" selected="true"/> <mx:CheckBox x="109" y="10" label="Single Speed" id="chkRideTypeSingleSpeed" click="toggleRideType('Single Speed')" selected="true"/> <mx:CheckBox x="109" y="70" label="Tandem" id="chkRideTypeTandem" click="toggleRideType('Tandem')" selected="true"/> <mx:CheckBox x="109" y="100" label="Track" id="chkRideTypeTrack" click="toggleRideType('Track')" selected="true"/> <mx:CheckBox x="10" y="130" label="Fit" id="chkRideTypeFit" click="toggleRideType('Fit')" selected="true"/> <mx:CheckBox x="109" y="40" label="Spin Indoors" id="chkRideTypeSpinIndoors" click="toggleRideType('Spin Indoors')" selected="true"/> </mx:Canvas> <mx:Canvas label="Length" width="100%" height="100%"> <mx:CheckBox x="10" y="10" label="Less 15" id="chkLengthLess15" click="toggleLength('Less 15')" selected="true"/> <mx:CheckBox x="10" y="40" label="15 - 30" id="chkLength15_30" click="toggleLength('15 - 30')" selected="true"/> <mx:CheckBox x="10" y="70" label="31 - 50" id="chkLength31_50" click="toggleLength('31 - 50')" selected="true"/> <mx:CheckBox x="10" y="100" label="51 - 85" id="chkLength51_85" click="toggleLength('51 - 85')" selected="true"/> <mx:CheckBox x="10" y="130" label="86 - 125" id="chkLength86_125" click="toggleLength('86 - 125')" selected="true"/> <mx:CheckBox x="10" y="160" label="126+" id="chkLength126" click="toggleLength('126+')" selected="true"/> </mx:Canvas> <mx:Canvas label="Terrain" width="100%" height="100%"> <mx:CheckBox x="10" y="70" label="C - Hilly" id="chkTerrainC_Hilly" click="toggleTerrain('C - Hilly')" selected="true"/> <mx:CheckBox x="10" y="40" label="B - Rolling" id="chkTerrainB_Rolling" click="toggleTerrain('B - Rolling')" selected="true"/> <mx:CheckBox x="10" y="10" label="A - Flat" id="chkTerrainA_Flat" click="toggleTerrain('A - Flat')" selected="true"/> <mx:CheckBox x="10" y="100" label="D - Mountainous" id="chkTerrainD_Mountainous" click="toggleTerrain('D - Mountainous')" selected="true"/> </mx:Canvas> </mx:Accordion> </ns1:CollapsiblePanel> </mx:Application> On Jun 8, 6:07 pm, "pamela (Google Employee)" <[email protected]> wrote: > Yes. If you are having trouble with this, please post a link to your > SWF with view-source enabled, and describe the issue. > > - pamela > > > > On Sun, Jun 7, 2009 at 1:16 AM, Mathew Thomas<[email protected]> wrote: > > I'm sorry -- I have a set of markers that may each fall into multiple > >categories. > > Is it possible to add the same marker into multiple arrays? > > On Sat, Jun 6, 2009 at 11:02 AM, CAP 1999 <[email protected]> wrote: > > >> I have markers that fall into multiplecategories. Is it possible to > >> use the method outline in the demo section to do this? > > >> When I add a marker to an array -- what exactly am I doing? Can I add > >> it to another Array without a problem? > > >> - > >> Matt On Jun 8, 6:07 pm, "pamela (Google Employee)" <[email protected]> wrote: > Yes. If you are having trouble with this, please post a link to your > SWF with view-source enabled, and describe the issue. > > - pamela > > > > On Sun, Jun 7, 2009 at 1:16 AM, Mathew Thomas<[email protected]> wrote: > > I'm sorry -- I have a set of markers that may each fall intomultiple > >categories. > > Is it possible to add the same marker intomultiplearrays? > > On Sat, Jun 6, 2009 at 11:02 AM, CAP 1999 <[email protected]> wrote: > > >> I have markers that fall intomultiplecategories. Is it possible to > >> use the method outline in the demo section to do this? > > >> When I add a marker to an array -- what exactly am I doing? Can I add > >> it to another Array without a problem? > > >> - > >> Matt --~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
