ȸ¿ø°¡ÀԡžÆÀ̵ð/ºñ¹øã±â
ȨÀ¸·Î


¾ßÈÄ ¼¼°è Áöµµ È°¿ëÇϱâ, ¾ßÈÄ °Å±â Áöµµ ¿ÀÇ API ¸Å½Ã¾÷
13³â Àü
¾ßÈÄ ¼¼°è Áöµµ API ¸¦ È°¿ëÇؼ­ Áöµµ¸¦ ¸¸µå´Â ºñ±³Àû °£´ÜÇÑ »ùÇÃÀÔ´Ï´Ù. ¾Æ·¡ ¼Ò°³µÈ ¼Ò½º Äڵ带 ½ÇÇàÇϸé 100°³ÀÇ ¸¶Ä¿°¡ »Ñ·ÁÁö°í ÇØ´ç ¸¶Ä¿¸¦ Ŭ¸¯Çϸé À̹ÌÁö¸¦ º¸¿©ÁÖ´Â ´ÙÀ½°ú °°Àº ½ÇÇà È­¸éÀ» È®ÀÎÇÒ ¼ö ÀÖ½À´Ï´Ù. ÀÚ½ÅÀÇ È¨ÆäÀÌÁö¿¡¼­ Å×½ºÆ® Çϱâ À§Çؼ­´Â ¾ßÈÄ °Å±â Áöµµ ¿ÀÇ API Å°¸¦ ÇØ´ç ȨÆäÀÌÁö (http://kr.open.gugi.yahoo.com/Regist/regist.php) ¿¡¼­ ¾òÀ» ¼ö ÀÖÀ¸¸ç Å° °ª($yahoo_map_api_key)À» ¾òÀº API Å°·Î ±³Ã¼ÇØ¾ß ÇÕ´Ï´Ù. Âü°í·Î ±¸±Û Áöµµ API¿¡µµ °ü½ÉÀÌ ÀÖ´Â ºÐÀº ¾Õ¼­ ¼Ò°³ÇÑ "ÀÚ¹Ù½ºÅ©¸³Æ®·Î Áöµµ ¸¸µé±â, ±¸±Û Áöµµ API ¸Å½Ã¾÷(Mashup)" Æ÷½ºÆ®µµ Âü°íÇϼ¼¿ä.

[½ÇÇà È­¸é] http://www.hompydesign.com/map/yahoo.html


[¼Ò½º ÄÚµå]

<HTML>
<HEAD>
<TITLE><?=$hompy_title?></TITLE>
<script type="text/javascript" src="/js/jquery.js"></script>
<script type="text/javascript" src="http://kr.open.gugi.yahoo.com/Client/AjaxMap.php?v=3.7&appid=$yahoo_map_api_key"></script>
<style type="text/css">

#map_box {position:relative;}
#map_canvas { width: 578px; height: 460px; margin: 0; padding: 0; border: 0; }

#map_box {width:578px; border: 4px solid #cccccc; padding:2px;}
#display_loading_box {width:578px; height:460px; position:absolute; background-color:#000000; z-index:1000; opacity: 0.5; filter: alpha(opacity = 50);}
#display_loading_box_icon {margin: 214px 273px; width:32px; height:32px;}

body,td,tr { font-size:12px; font-family:µ¸¿ò,verdana,arial,sans serif;}

.window_image {border:1px solid #cccccc; width:140px; height:100px; margin:6px;}

</style>
<script type='text/javascript'>
<!--

var map = null;
var current_lon = 127.046;
var current_lat = 37.5066;
var current_zoom = 14;
var person_list = [];

$(document).ready(function(){
      display_loading();
      map = new YMap($("#map_canvas")[0]);

      map.addTypeControl();
      map.addZoomLong();
      map.addPanControl();
      //map.drawZoomAndCenter(encodeURIComponent("°­³²¿ª"), 4);
      map.drawZoomAndCenter(new YGeoPoint(current_lat,current_lon), 4);
      map.setMapType(YAHOO_MAP_REG);

      display_marker({user:0,lat:current_lat,lon:current_lon});
      for (record in person_list) {
            display_marker(person_list[record]);
      }
      setTimeout(display_loaded, 1000);
});

function display_loading(){
      var html = "<div id='display_loading_box'><img src='images/loading.gif' id='display_loading_box_icon' /></div>";
      $('#map_canvas').before(html);
}

function display_loaded(){
      $('#display_loading_box').remove();
}

function display_marker(record){
      with (record) {
            var point = new YGeoPoint(Number(lat),Number(lon));
            var marker = create_marker(point, user);
      }
      map.addOverlay(marker);
      //map.setCenter(point, current_zoom, G_NORMAL_MAP);
}

function create_marker(point, person) {
      var icon = new YImage();
      icon.src = 'images/pot.png';;
      icon.size = new YSize(36, 36);
      icon.offset.x = -18; icon.offset.y = 0;      

      var marker= new YMarker(point, icon);
      //marker.addAutoExpand("pos:"+person);
      var html = '<a href="http://hompy.info/583"><img src="/hompydesign.com?seq='+person+'" class="window_image"></a>';
      YEvent.Capture(marker, EventsList.MouseClick, function(){
            marker.openSmartWindow(html);
      });
      return marker;
}

person_list =
[{user:1,lon:127.034,lat:37.5059},{user:2,lon:127.029,lat:37.5125},{user:3,lon:127.032,lat:37.5306},{user:4,lon:127.034,lat:37.4994},{user:5,lon:127.036,lat:37.5169}];

-->
</script>
</HEAD>

<BODY>
<div id="map_box">
<div class="map" id="map_canvas"></div>
</div>
</BODY>
</HTML>
ÃßõÃßõ : 324 Ãßõ ¸ñ·Ï
¹øÈ£ Á¦¸ñ
65
IIS¿¡¼­ JSP or Java Servlet µ¹¸®´Â ¹æ¹ý 1
64
ÅèĹ(Tomcat)ÀÇ ±â´É °³¿ä ¹× ¼³Ä¡ ¹æ¹ý
63
³»¿ëº¹»ç½Ã Ãâó ÀÚµ¿³Ö±â
62
Flash¿Í PHP¸¦ È°¿ëÇÏ¿© ¸ÖƼ ÆÄÀÏ ¾÷·Îµå ±¸ÇöÇÏ´Â ¹æ¹ý
61
linux ½Ã°£ ¸ÂÃß±â
¾ßÈÄ ¼¼°è Áöµµ È°¿ëÇϱâ, ¾ßÈÄ °Å±â Áöµµ ¿ÀÇ API ¸Å½Ã¾÷
59
´ÙÀ½ Áöµµ¸¦ ³» °ÍÀ¸·Î ¸¸µé±â, ´ÙÀ½ Áöµµ API ¸Å½¬¾÷
58
³ª¸¸ÀÇ ³×À̹ö Áöµµ ¸¸µé±â, Áöµµ API ¸Å½¬¾÷(Mashup)
57
ÀÚ¹Ù½ºÅ©¸³Æ®·Î Áöµµ ¸¸µé±â, ±¸±Û Áöµµ API ¸Å½Ã¾÷(Mashup)
56
jQuery ·Î ÅؽºÆ® ÀÔ·Â ¹Ú½º(TextArea)¿¡ Å©±â Á¶Àý ¸·´ë Ãß°¡Çϱâ.
55
Á¢±Ù¼ºÀ» ÇØÄ¡Áö ¾Ê´Â ÀÚ¹Ù½ºÅ©¸³Æ®ÀÇ »ç¿ë
54
display: [inline, block, none]
53
CSS line-height ¼Ó¼º, vertical-align ¼Ó¼º
52
CSS float ¼Ó¼º, clear ¼Ó¼º, z-index ¼Ó¼º
51
CSS display ¼Ó¼º, position ¼Ó¼º
50
CSS ¸¶Áø(margin) ¼Ó¼º, Æеù(padding) ¼Ó¼º
49
CSS overflow ¼Ó¼º, clip ¼Ó¼º, visibility ¼Ó¼º
48
IE6 ¿¡¼­ CSS¸¸À¸·Î(ÇپȾ²°í) position:fixed Çϱâ
47
IE 7 ¿¡¼­ dt, dd ÁÂÃø¿©¹éÀÌ »ý±â´Â ¹®Á¦
46
CSS visibility vs display
45
ÆÄÀ̾îÆø½º ¿¡¼­ ÇÚµå Ä¿¼­ ¾ÈµÉ¶§. cursor:hand -> cursor:pointer
44
CSS Æ÷Áö¼Å´×(Positioning)
43
CSS¿¡¼­ ºê¶ó¿ìÀú ±¸º° (IE6, IE7, FIREFOX)
42
CSS3 ¼Ò°³
41
Useful CSS Tips For Beginners
40
ÀÚÁÖ ¾²´Â ³»ÀåÇÔ¼ö (VisualBasic6)
39
ºê¶ó¿ìÀú ¹öÀüüũ - IE Conditional Comments ÇÊÅ͸µ
38
ºê¶ó¿ìÀú ¹öÀü(IE7 vs IE6)¿¡ µû¶ó Layer Y ÁÂÇ¥ À§Ä¡ º¯µ¿
37
·¹À̾î Àý´ëÁÂÇ¥/ »ó´ëÁÂÇ¥
36
À¥Ç¥ÁØ DTD¼±¾ð¹®
¸ñ·Ï
¹ÂÁ÷Æ®·ÎÆ® ºÎ»ê±¤¿ª½Ã ºÎ»êÁø±¸ °¡¾ßµ¿ ¤Ó °³ÀÎÁ¤º¸Ãë±Þ¹æħ
Copyright ¨Ï musictrot All rights reserved.