2007年12月21日星期五

搞定第一个Yahoo Map

费了半天工夫终于名副其实地Mash-up了一把,在主页上通过Yahoo Map的API得到成都的地图,并把自己的个人图片作为Marker绑定在地图上,还有点击事件弹出详细个人介绍的窗口,还是比较有成就感。

其实蛮简单的,主要的代码如下:

var map = new YMap(document.getElementById('mapContainer'));
map.drawZoomAndCenter("Chengdu", 10);

var imageMarker = new YImage();
imageMarker.src = "http://lh6.google.com/image/coolair.loveU2/RZyaWLYhxSI/AAAAAAAAABw/r6PMmZlOV8Q/s288/100_0102.jpg";
imageMarker.size = new YSize(125, 125);
imageMarker.offsetSmartWindow = new YCoordPoint(0, 0);
var latlon = map.getCenterLatLon()
var markerPoint = new YGeoPoint(30.15, 103.2);
var marker = new YMarker(markerPoint, imageMarker);
map.addOverlay(marker);
YEvent.Capture(marker, EventsList.MouseClick, onSmartWinEvent);
function onSmartWinEvent() {
var words = '

一个对生活,音乐和技术充满热情的人';
var words = words + 'see my Open Source toy
';
marker.openSmartWindow(words);
}

没有评论: