Flash和Google地图 - 仅显示最后一个图标

时间:2010-05-20 03:34:39

标签: flash google-maps google-maps-markers geocode

我使用CS4在Flash中有一个简单的地图和地理编码样本

问题很简单 - 我可以从谷歌搜索API中检索一个短列表,但是当我尝试使用循环在地图上生成图标时,只显示最后一个图标。 (忽略房子图标,它是先前生成的)

我觉得我错过了一些东西或者犯了一个愚蠢的AS3错误(就像把它视为c#一样) - 甚至是一个愚蠢的木头换树错误。问题出在代码的最后一行。

我已经添加了所有代码,以防其他人可以找到它的用处 - 上帝知道我花了很长时间来弄明白这一点:)

它运行here

(另外,如果有人知道为什么图标在渲染时位置错误,但如果你移动地图就会更正 - 请告诉我)

任何帮助都会很棒。

感谢。 P

import com.google.maps.services.ClientGeocoder;
import com.google.maps.services.GeocodingEvent;
import com.google.maps.LatLng;
import com.google.maps.Map;
import com.google.maps.MapEvent;
import com.google.maps.MapType;
import com.google.maps.overlays.Marker;
import com.google.maps.overlays.MarkerOptions;
import com.google.maps.styles.FillStyle;
import com.google.maps.styles.StrokeStyle;
import com.google.maps.controls.*
import com.google.maps.overlays.*
import flash.display.Bitmap;
import flash.display.BitmapData;

import com.adobe.utils.StringUtil;
import be.boulevart.google.ajaxapi.search.GoogleSearchResult;
import be.boulevart.google.events.GoogleApiEvent;
import be.boulevart.google.ajaxapi.search.local.GoogleLocalSearch;
import be.boulevart.google.ajaxapi.search.local.data.GoogleLocalSearchItem;


var strZip:String = new String();
strZip="60661"; 

var strAddress:String = new String();
strAddress ="100 W. Jackson Blvd, chicago, IL 60661";


var IconArray:Array = new Array;
var SearchArray:Array = new Array;

/*--------------------------------------------------------------
// The returned search data gets placed into this array
---------------------------------------------------------------*/

var LocalInfo:Array = new Array();
var intCount:int = new int;

var intMapReady:int=0;

/*===================================================================================
  We load the map first and then get the search criteria - this will keep the order of
  operation clean.  The 
====================================================================================*/

var map:Map = new Map();

map.key = "ABQIAAAAHwSPp7Lhew456ffD6qa2WmxT_VwdLJEfmcCgytxKjcH1jLKkiihQtfC-  TbcwryvBQYhRwHWa8F_Gp9Q";

map.setSize(new Point(600, 550));
map.addEventListener(MapEvent.MAP_READY, onMapReady);

//Places the map on the page
this.addChild(map);
map.x=5;
map.y=5;


function onMapReady(event:Event):void 
{  
 //Center the map and place the house marker
 doGeocode();
}

/*==========================================================================
 Goecode to return the LAT and LONG for the specific address, center
 the map and add the house icon
===========================================================================*/

function doGeocode()
{
    var geocoder:ClientGeocoder = new ClientGeocoder();

    geocoder.addEventListener(GeocodingEvent.GEOCODING_SUCCESS,
    function(event:GeocodingEvent):void {

    var objPlacemarks:Array = event.response.placemarks;

    if (objPlacemarks.length > 0) 
    {
        map.setCenter(objPlacemarks[0].point, 14, MapType.NORMAL_MAP_TYPE);

        var request:URLRequest = new URLRequest("house.png"); 
        var imageLoader:Loader = new Loader(); 
        imageLoader.load(request); 

        var objMarkerOptions:MarkerOptions = new MarkerOptions();
        objMarkerOptions.icon=imageLoader;
        objMarkerOptions.icon.scaleX=.15;
        objMarkerOptions.icon.scaleY=.15;
        objMarkerOptions.iconAlignment = MarkerOptions.ALIGN_HORIZONTAL_CENTER + MarkerOptions.ALIGN_VERTICAL_CENTER;
        var objMarker:Marker = new Marker(objPlacemarks[0].point, objMarkerOptions); 
        map.addOverlay(objMarker);

        doLoadSearch()
    }
});

//Failure code - good practice, really
geocoder.addEventListener(GeocodingEvent.GEOCODING_FAILURE,
    function(event:GeocodingEvent):void {
    txtResult.appendText("Geocoding failed");
    });

    // generate geocode
    geocoder.geocode(strAddress);
}

/*===============================================================
   XML Loader - loads icon file and search text pair from xml file
=================================================================*/

function doLoadSearch()
{
    var xmlLoader:URLLoader = new URLLoader();
    var xmlData:XML = new XML(); 
    xmlLoader.addEventListener(Event.COMPLETE, LoadXML);
    xmlLoader.load(new URLRequest("config.xml"));

    function LoadXML(e:Event):void
    {
        xmlData = new XML(e.target.data);
        RetrieveSearch();
    }

    function RetrieveSearch()
    {  
        //extract the MapData subset
        var xmlSearch = xmlData.MapData;

        // push this to an xml list object
        var xmlChildren:XMLList =  xmlSearch.children();

        //loop the list and extract the data into an
        //array of formatted search criteria

        for each (var Search:XML in xmlChildren) 
        {
            txtResult.appendText("Searching For: "+Search.Criteria+" Icon=" + Search.Icon+ "Zip=" + strZip +"\r\n\r\n");
            //retrieve search criteria
            loadLocalInfo(Search.Criteria,Search.Icon,strZip);

        }
    }
}

/*==================================================================================
Search Functionality - does a google API search and loads the lats and longs required 
to place the icons on the map  - THIS WILL NOT RUN LOCALLY
===================================================================================*/


function loadLocalInfo(strSearch,strIcon,strZip)
{
    var objLocal:GoogleLocalSearch=new GoogleLocalSearch()
    objLocal.search(strSearch+" "+strZip,0,"0,0","","")
    objLocal.addEventListener(GoogleApiEvent.LOCAL_SEARCH_RESULT,onSearchComplete)

    function onSearchComplete(e:GoogleApiEvent):void
    {

        var resulta:GoogleSearchResult=e.data as GoogleSearchResult;

        //------------------------------------------------
        // Load the icon for this particular search
        //------------------------------------------------

        var request:URLRequest = new URLRequest(strIcon); 
        var imageLoader:Loader = new Loader(); 
        imageLoader.load(request);         

        //-------------------------------------------------------------
        // For test purposes

        txtResult.appendText("Result Count for "+strSearch+" = "+e.data.results.length+"\r\n\r\n");

        for each (var result:GoogleLocalSearchItem in e.data.results as Array)
        {
            LocalInfo[intCount]=[String(result.title),strIcon,String(result.latitude),String(result.longitude)];

            //---------------------------------------
            // Pop the icon onto the map
            //---------------------------------------

            var objLatLng:LatLng = new LatLng(parseFloat(result.latitude), parseFloat(result.longitude)); 
            var objMarkerOptions:MarkerOptions = new MarkerOptions();
            objMarkerOptions.icon=imageLoader;   
            objMarkerOptions.hasShadow=false;
            objMarkerOptions.iconAlignment = MarkerOptions.ALIGN_HORIZONTAL_CENTER + MarkerOptions.ALIGN_VERTICAL_CENTER;
            var objMarker:Marker = new Marker(objLatLng, objMarkerOptions); 

            /**********************************************************
              *Everything* works to here - I have traced out execution 
              and all variables. It only works on the last item
              in the array :(
            ***********************************************************/

            map.addOverlay(objMarker);
        }

    }
}

1 个答案:

答案 0 :(得分:0)

嗯 - 经过几个小时的盯着屏幕后,我开始拿出属性,看看我得到了什么。

我开始从MarkerOptions中删除图标 - 瞧,在我的地图上弹出一堆通用标记 - 所以问题在于加载图标。

所以我在循环中移动了imageLoader功能,如下所示,它有效。很棒的夜晚睡觉和一桶茶会为你做什么。

关闭下一个问题 - 使用坐标集中搜索 - yay。

.....

    var request:URLRequest = new URLRequest(strIcon);  

    //------------------------------------------------------------- 
    // For test purposes 

    txtResult.appendText("Result Count for "+strSearch+" = "+e.data.results.length+"\r\n\r\n"); 

    for each (var result:GoogleLocalSearchItem in e.data.results as Array) 
    { 
        LocalInfo[intCount]=[String(result.title),strIcon,String(result.latitude),String(result.longitude)]; 


    var imageLoader:Loader = new Loader();  
    imageLoader.load(request);          

        //--------------------------------------- 
        // Pop the icon onto the map 
        //--------------------------------------- 

        var objLatLng:LatLng = new LatLng(parseFloat(result.latitude), parseFloat(result.longitude));  
        var objMarkerOptions:MarkerOptions = new MarkerOptions(); 
        objMarkerOptions.icon=imageLoader;    
        objMarkerOptions.hasShadow=false; 
        objMarkerOptions.iconAlignment = MarkerOptions.ALIGN_HORIZONTAL_CENTER + MarkerOptions.ALIGN_VERTICAL_CENTER; 
        var objMarker:Marker = new Marker(objLatLng, objMarkerOptions);  

        map.addOverlay(objMarker); 
    }