View Full Version : Yahoo! map w/ Satellite mode
rcyeager
06-04-2006, 09:32 AM
All -
Togawa @ Laszlo's Japan office was so kind to respond with my change request for his Flash Yahoo! map integration with OpenLaslzo: Satellite mode support.
See the demo here:
http://laszlo.jp/lps/samples/yahoomaps/yahoomapssample.lzx
Source code here:
http://laszlo.jp/lps/samples/yahoomaps/
Enjoy! Thanks, Togawa!!!!
Robert
mrtrosen
12-28-2006, 10:02 AM
when I try using the yahoo map example on my server, I get the following error in the debug console:
Error: yahoomaps/yMapMap.lzx:19 call to undefined method 'addListener'
Is there something I need to do to get the code to work on my own install other than copy the code into the appropriate directory?
Thanks!
Michael
rcyeager
12-28-2006, 11:28 AM
I just copied the code...it worked for me as-is.
mrtrosen
12-28-2006, 05:14 PM
Can you tell me what steps you did to run it? I simply took the zip file, extracted the contents to the laszlo server directory:
C:\Program Files\OpenLaszlo Server 4.0b1rc1\Server\lps-4.0b1rc1\yahoomap
Then, I go to the webpage on my local server:
http://127.0.0.1:8080/lps-4.0b1rc1/yahoomaps/
I click on the file:
yahoomapssample.lzx
which brings up the map correctly, with the buttons, however, none of the buttons have any affect.
The URL that I get when I click on the .lzx file is:
http://127.0.0.1:8080/lps-4.0b1rc1/yahoomaps/yahoomapssample.lzx?debug=true&lzr=swf8
Then I turn debug on, and I get the aforementioned error, and similar errors when I click on any of the buttons.
If, however, I click on the yahoomapssample.lzx.swf file, it works correctly.
Is there something I need to do to get the code so I can alter and run on my local server?
Thanks for your help!
Michael
rcyeager
12-28-2006, 05:38 PM
It looks like you are using OL4.
You must use OL3, especially with community code developed on OL3.
All of my existing OL3 code still does not run on the latest OL4 beta 1 release. Looks like you found another example of OL3 code that won't work with OL4.
I hope someone at OL is paying attention...lots of people are going to be confused/concerned by code that doesn't work in OL4. If expectations are not managed, OL4 will be crucified by the AJAX community and other ill-wishers.
Robert
mrtrosen
12-28-2006, 05:46 PM
Thank you! :) I'll install version 3.3 right now and test it out.. no reason for me to use version 4, just like to always be using the latest stuff guess :)
Michael
mrtrosen
12-28-2006, 06:44 PM
Robert,
Indeed, once I downloaded the nightly trunk of the 3.4.x version of openlaszlo, the yahoomaps demo works perfectly. Thank you again for your help!
Michael
rcyeager
12-28-2006, 06:47 PM
Sure.
I'm afraid this will be a common occurrence as people start to explore OL4.
mrtrosen
12-28-2006, 08:45 PM
one more question on the yahoo maps example...
I've tried to set the map so the pan tool is enabled by default.. I've tried putting a call in the oninit method in the ymapMap class:
<method event="oninit" args="invoker">
this.__LZmovieClipRef.addListener(invoker);
this.__LZmovieClipRef.addPanTool();
</method>
I've tried:
<method event="oninit" args="invoker">
this.__LZmovieClipRef.addListener(invoker);
this.addPanTool();
</method>
Neither of these work, I get an error in the debug window:
call to undefined method addPanTool (I also get an error on the addListener)
I've also tried adding a handler for oninit for the canvas in the main yahoomapssample.lzx file, but get also get the undefined method error in the debug window.
The clicking of the button to add the pan tool after the window is up works.
I will have similar issues for wanting to create markers on page load (ie, I'll have a bunch of locations that I want to prepopulate on the map..)
Any clues you can send me?
Thanks!
Michael
rcyeager
12-29-2006, 06:38 AM
You need to wait for the map to load and initialize. Here is my modified ymapMap.lzx contents (from an earlier version w/o Satellite Mode!!)...the important part is the modified oninit handler:
<library>
<class name="ymapMap" extends="view">
<attribute name="appid" type="string" />
<attribute name="latitude" type="number"/>
<attribute name="longitude" type="number" />
<attribute name="zoom" type="number" />
<attribute name="initDone" value="false" type="boolean"/>
<handler name="oninit" args="invoker">
this.__LZmovieClipRef.lmc.addListener(invoker);
this.waitDelegate = new LzDelegate(this, "wait");
LzTimer.addTimer(this.waitDelegate, 1000);
</handler>
<method name="wait">
<![CDATA[
if (this.__LZmovieClipRef.lmc.addNavigatorWidget == null)
{
LzTimer.resetTimer(this.waitDelegate, 500);
}
else
{
this.setSize(parent.width, parent.height);
this.addNavigatorWidget();
this.addPanTool();
this.centerMapOnCountry();
this.initDone = true;
this.setVisible(true);
}
]]>
</method>
<animator name="anim_hide" attribute="opacity" to="0" duration="300" start="false">
<handler name="onstop">
parent.setAttribute("visible", false);
</handler>
</animator>
<animator name="anim_show" attribute="opacity" to="1" duration="300" start="false">
<handler name="onstop">
if (parent.initDone) parent.setAttribute("visible", true);
</handler>
</animator>
<method name="onInitMap">
</method>
<method name="setAppID" args="id">
this.__LZmovieClipRef.lmc.setAppid(id);
</method>
<method name="addEventListener" args="listener, method">
this.__LZmovieClipRef.lmc.basemap.addEventListener (com.yahoo.maps.api.flash.YahooMap.EVENT_INITIALIZ E, method); </method>
<method name="setSize" args="width, height">
this.__LZmovieClipRef.lmc.basemap.setSize(width, height);
</method>
<method name="setZoomLevel" args="value">
this.__LZmovieClipRef.lmc.basemap.setZoomLevel(val ue);
</method>
<method name="setLocation" args="location">
if( typeof(location) == "string")
setCenterByAddress(location, 0);
else
setCenterByLatLon(location);
</method>
<method name="setCenterByAddress" args="address,duration">
this.__LZmovieClipRef.lmc.basemap.setCenterByAddre ss(address,duration);
</method>
<method name="setCenterByLatLon" args="latlon, duration">
this.__LZmovieClipRef.lmc.basemap.setCenterByLatLo n(latlon, duration);
</method>
<method name="setCenterByLatLonAndZoom" args="latlon, zoom">
this.__LZmovieClipRef.lmc.basemap.setCenterByLatLo nAndZoom(latlon, zoom);
</method>
<method name="addMarkerByAddress" args="marker, address">
this.__LZmovieClipRef.lmc.basemap.addMarkerByAddre ss(marker.getobj(), address, marker.getdata());
</method>
<method name="addMarkerByLatLon" args="marker, latlon">
this.__LZmovieClipRef.lmc.basemap.addMarkerByLatLo n(marker.getobj(), latlon, marker.getdata());
</method>
<method name="addPanTool">
this.__LZmovieClipRef.lmc.addPanTool();
</method>
<method name="addNavigatorWidget">
this.__LZmovieClipRef.lmc.addNavigatorWidget();
</method>
<method name="addToolBarWidget">
this.__LZmovieClipRef.lmc.addToolBarWidget();
</method>
<method name="enableKeyboardShortcuts" args="bool">
this.__LZmovieClipRef.lmc.basemap.enableKeyboardSh ortcuts(bool);
</method>
<method name="getBounds">
return this.__LZmovieClipRef.lmc.basemap.getBounds();
</method>
<method name="getCenter">
return this.__LZmovieClipRef.lmc.basemap.getCenter();
</method>
<method name="getHeight">
return this.__LZmovieClipRef.lmc.basemap.getHeight();
</method>
<method name="getWidth">
return this.__LZmovieClipRef.lmc.basemap.getWidth();
</method>
<method name="getZoomLevel">
return this.__LZmovieClipRef.lmc.basemap.getZoomLevel();
</method>
<method name="removeAllMarkers">
this.__LZmovieClipRef.lmc.basemap.removeAllMarkers ();
</method>
<!--
<method name="setheight" args="h">
this.setAttribute('height', h);
this.__LZmovieClipRef.lmc.basemap.setheight(h);
</method>
<method name="setwidth" args="w">
this.setAttribute('width', w);
this.__LZmovieClipRef.lmc.basemap.setwidth(w);
</method>
-->
<method name="centerMapOnCountry">
<![CDATA[
if (maincanvas.siteName == "US")
{
ll = new com.yahoo.maps.LatLon(39, -95);
this.setCenterByLatLonAndZoom(ll, 14);
}
else if (maincanvas.siteName == "AU")
{
ll = new com.yahoo.maps.LatLon(-60, 140);
this.setCenterByLatLonAndZoom(ll, 14);
}
else if (maincanvas.siteName == "CA")
{
ll = new com.yahoo.maps.LatLon(49, -97);
this.setCenterByLatLonAndZoom(ll, 14);
}
else if (maincanvas.siteName == "GB")
{
ll = new com.yahoo.maps.LatLon(54, .1);
this.setCenterByLatLonAndZoom(ll, 12);
}
else if (maincanvas.siteName == "IN")
{
ll = new com.yahoo.maps.LatLon(23.3, 80);
this.setCenterByLatLonAndZoom(ll, 14);
}
]]>
</method>
<method name="addMarker" args="dp, ndx, zoom">
<![CDATA[
<removed code to create marker desc>
var marker = new ymapCustomPOIMarker(canvas,{index: ndx, title: dp.xpathQuery("T/text()"),
description: desc,
markerColor:0xCC3333, strokeColor:0xFFFFFF});
var ll = new com.yahoo.maps.LatLon(parseFloat(dp.xpathQuery('LA T/text()')), parseFloat(dp.xpathQuery('LONG/text()')));
this.addMarkerByLatLon(marker, ll);
]]>
</method>
</class>
</library>
medhavi
02-19-2007, 02:11 AM
Hi rcyeager,
I took the updated ymapMap.lzx and replaced the old one. When I run the application, I can only see the map now. The buttons stopped working. Add navigator pane and add pan etc. do not work anymore! Not even add marker.
Can you please help?
Thanks
rcyeager
02-19-2007, 05:25 AM
What version of LPS are you using?
If using LPS v4, don't. v3.3 should work...that's what I use with the map.
Robert
medhavi
02-19-2007, 05:56 AM
I'm using OL 3.3 (spent almost 3 days integrating with Eclipse 3.1.2.
When I had the original ymapMap.lzx, everything worked fine. Using the updated file doesn't seem to work. I see couple of changes and I guess just changing the ymapMap.lzx won't work. Either the fla file also needs to be replaced or the yahoomapsample.lzx should undergo some changes as well.
I see these changes in the latest ymapMap.lzx:
Earlier: <class name="ymapMap" extends="view" resource="yahoomaps.swf">
Now: <class name="ymapMap" extends="view">
Earlier: All methods were called on "this.__LZmovieClipRef"
Now: this.__LZmovieClipRef.lmc
What is this "lmc"?
Also, in the last method of the updated file, <method name="addMarker" args="dp, ndx, zoom"> - there is a text <removed code to create marker desc>. This causes an error. I guess this was supposed to be in comments.
rcyeager
02-19-2007, 07:29 AM
My code snippet above contains changes you don't want to use...my application loads the map's SWF file dynamically instead of compiling it into the application as a resource.
My code above was intended to only show the changes needed in the oninit handler to reliably add the Pan tool...via the "wait" delegate that keeps checking for the map to finish loading.
So, take your original file and just modify the oninit handler and add the "wait" method.
Robert
medhavi
02-19-2007, 08:05 AM
Hi Robert,
I'm attaching my modified ymapMap.lzx. I've also attached the debug log. The methods (addNavigatorWidget and addPanTool) are indeed getting called - still I don't see it working in the application!
I want to start Yahoo! map with some other location. Ex. India. I made the required changes in centerMapOnCountry to accept the country abbreviation. I don't see any errors/warnings from LPS. Somehow it is not working.
I can see Yahoo! map. Buttons are working - I can add navigator and pan using buttons. But I want these tools to be added by default, which seems to have issues.
Will appreciate if you can give some clue!
Thanks
rcyeager
02-19-2007, 08:41 AM
Your code worked fine for me w/ LPS v3.3...the pan and nav tools appear when the map initializes.
Sorry, but I don't currently have time to troubleshoot your problem in-depth...I'm dealing with 4 active OpenLaszlo projects for clients.
Robert
Zanzamar
03-11-2007, 11:33 PM
It is my assumption (Insert jokes about an ass of you and me...) that the included yahoomaps.swf file has all of the wrappers in it that provide the yahoo api functionality.
Yahoo has added a lot of cool functionality (Yahoo Reference (http://developer.yahoo.com/maps/flash/V3.5/flashReference.html)) and I would like to extend the program to include some of these function calls.
Unfortunately I cannot edit the yahoomaps.fla file. My flash version doesn't seem to support it. And clearly adding the method calls does not add any functions. Ie:
<method name="setCenterByAddressAndZoom" args="address, zoom, duration">
this.__LZmovieClipRef.basemap.setCenterByAddressAn dZoom(address, zoom, duration);
</method>
Does anyone have any other suggestions for extending the program (either the .lzx files or another way to edit the .fla file?)
Regards,
Zanzamar
Zanzamar
03-11-2007, 11:51 PM
I played around a little more and found I could add things in the .lzx utilizing some explicit calls to the js style functionality built into the yahoo api.
<method name="loadCenterMap">
<![CDATA[
latlon = new com.yahoo.maps.LatLon(39.747058, -104.984322);
this.setCenterByLatLonAndZoom(latlon, 10);
]]>
</method>
<method name="setCenterByLatLonAndZoom" args="latlon, zoom">
this.__LZmovieClipRef.basemap.setCenterByLatLonAnd Zoom(latlon, zoom);
</method>
vBulletin® v3.8.4, Copyright ©2000-2012, Jelsoft Enterprises Ltd.