1
2
VICS G***** 3
4
5
http://****.yahooapis.jp/****?query=*** WebAPI HTTP 6
7
8
9
10
11
12
13
14
15
16
17
18
19
YOLP AppID hacku_test 20
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script charset="utf-8" src="http://js.api.olp.yahooapis.jp/openlocalplatform/v1/jsapi?appid=[ appid]"></script> <script> window.onload = function() { // }; </script> </head> <body> </body> </html> AppID http://developer.yahoo.co.jp/weba pi/map/openlocalplatform/v1/js/ URL yjdn jsapi <div id="map" style="width:800px; height:500px;"></div> URL http://u.yhacks.jp/common/tutorial/yolp/template.html https://github.com/yahoojpyolp/yolp-jsapi-samples/tree/master/webapp-template-2014-hacku 21
window.onload = function() { var latlng = new Y.LatLng(35,135); // var map = new Y.Map("map"); map.drawmap(latlng); }; div id 22
window.onload = function() { var latlng = new Y.LatLng(35.0297536,135.7607545); // var map = new Y.Map("map"); map.drawmap(latlng,15); // map.setconfigure('scrollwheelzoom', true); }; Tips 1. Y! 2. 3. URL http://maps.loco.yahoo.co.jp/maps?p= &lat=35.0297536&lon=135.7607545& API API 23
window.onload = function() { var latlng = new Y.LatLng(35.0297536,135.7607545); // var map = new Y.Map("map"); map.drawmap(latlng,15); // map.setconfigure('scrollwheelzoom', true); // map.addcontrol(new Y.LayerSetControl()); map.addcontrol(new Y.SliderZoomControlVertical()); map.addcontrol(new Y.ScaleControl()); map.addcontrol(new Y.CenterMarkControl()); }; 24
window.onload = function() { var latlng = new Y.LatLng(35.0297536,135.7607545); // var map = new Y.Map("map"); map.drawmap(latlng,15); // var marker = new Y.Marker(new Y.LatLng(35.02986144707795,135.75935694118283)); // marker.bindinfowindow( <u> </u><br /> 2 "); // map.addfeature(marker); }; 25
window.onload = function() { var latlng = new Y.LatLng(35.0297536,135.7607545); // var map = new Y.Map("map"); map.drawmap(latlng,15); // var style = new Y.Style("ff0000", 15, 0.75, null, "arrow"); var latlngs = [ new Y.LatLng(35.0297536,135.7607545), new Y.LatLng(35.02986144707795,135.75935694118283) ]; // var line = new Y.Polyline(latlngs,{"strokeStyle":style}); // map.addfeature(line); }; 26
window.onload = function() { var latlng = new Y.LatLng(35.0297536,135.7607545); // var map = new Y.Map("map"); map.drawmap(latlng,15); // map.bind("click",function(p) { alert(" "+p.tostring()); }); map.bind("moveend",function() { var center = map.getcenter(); alert(" "+center.tostring()); }); }; 27
window.onload = function() { var latlng = new Y.LatLng(35.0297536,135.7607545); var map = new Y.Map("map"); map.drawmap(latlng,15); map.bind("moveend",function() { var center = map.getcenter(); var cid = "d115e2a62c8f28cb03a493dc407fa03f,8cfa8ed3d825ba896fa8d 7cffd28cd67"; var searchoption = { "lat": center.lat(), "lon": center.lng(), "dist": 5, "sort": "dist" }; var localsearch = new Y.LocalSearch(); localsearch.search("", cid, searchoption, function(ydf) { map.clearfeatures(); map.addfeatures(ydf.features); } ); }); }; 1. API 2. ID cid 3. ID API http://olp.yahoo.co.jp/cassette.html https://github.com/yahoojapan/yolp-jsapisamples/blob/master/webapp-cassettesearch/cassette.html 28
window.onload = function() { var latlng = new Y.LatLng(35.0297536,135.7607545); var map = new Y.Map("map"); map.drawmap(latlng,15); // var rlayer = new Y.RouteSearchLayer(); map.addlayer(rlayer); map.bind("moveend",function() { var center = map.getcenter(); var cid = "d115e2a62c8f28cb03a493dc407fa03f,8cfa8ed3d825ba896fa8d7cffd28cd67"; var searchoption = { "lat": center.lat(), "lon": center.lng(), "dist": 5, "sort": "dist" }; var localsearch = new Y.LocalSearch(); localsearch.search("", cid, searchoption, function(ydf) { map.clearfeatures(); map.addfeatures(ydf.features); // var nearestfeature = ydf.features[0]; rlayer.execute( [center,nearestfeature.getlatlng()], //, {"usecar":false} ); }); }); }; 29
CodeZine YOLP - THE END - 30
VICS G***** 32