<html>
<head>
<script type="text/javascript"
src="http://api.maps.yahoo.com/ajaxymap?v=3.7&appid=YahooDemo"></script>
<style type="text/css">
#map{
height: 75%;
width: 100%;
}
</style>
</head>
<body>
<div id="map"></div>
<script type="text/javascript">
function StartYMap() {
var map = new YMap(document.getElementById('map'));
var cPT = new YGeoPoint(41.85,-87.65);
map.addZoomLong();
map.addTypeControl();
map.disableKeyControls();
map.drawZoomAndCenter(cPT,5);
var setupMarker = function(p,d) {
var m = new YMarker(p);
m.addAutoExpand(d);
return m;
};
// process returned traffic e object
var trafficF = function(e) {
var _p = [];
if (e.Data) {
for (var a in e.Data.ITEMS) {
var l = e.Data.ITEMS[a];
// YLog.print(l);
if (l.TITLE) {
var p = new YGeoPoint(l.LATITUDE,l.LONGITUDE);
_p.push(p);
var m = setupMarker(p,l.TITLE);
map.addOverlay(m);
}
}
}
//args: array of points, color, thickness, alpha
var pl = new YPolyline(_p,'blue',4,0.5);
map.addOverlay(pl);
};
//args: point, radius
map.searchTraffic(cPT,2);
// listen for completion of traffic info search
YEvent.Capture(map,EventsList.onEndTrafficSearch,trafficF);
}
window.onload = StartYMap
</script>
</body>
</html>