| 提交 | 用户 | 时间 | ||
| 1ac2bc | 1 | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" |
| 懒 | 2 | "http://www.w3.org/TR/html4/loose.dtd"> |
| 3 | <html> | |
| 4 | <head> | |
| 5 | <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> | |
| 6 | <title></title> | |
| 7 | <script type="text/javascript" src="../internal.js"></script> | |
| 8 | <style type="text/css"> | |
| 9 | .content{width:530px; height: 350px;margin: 10px auto;} | |
| 10 | .content table{width: 100%} | |
| 11 | .content table td{vertical-align: middle;} | |
| 12 | #address{width:220px;height:21px;background: #FFF;border:1px solid #d7d7d7; line-height: 21px;} | |
| 13 | </style> | |
| 14 | <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> | |
| 15 | </head> | |
| 16 | <body> | |
| 17 | <div class="content"> | |
| 18 | <table> | |
| 19 | <tr> | |
| 20 | <td><label for="address"><var id="lang_input_address"></var></label></td> | |
| 21 | <td><input id="address" type="text" /></td> | |
| 22 | <td><a id="doSearch" href="javascript:void(0)" class="button"><var id="lang_input_search"></var></a></td> | |
| 23 | </tr> | |
| 24 | </table> | |
| 25 | <div id="container" style="width: 100%; height: 340px;margin: 5px auto; border: 1px solid gray;"></div> | |
| 26 | </div> | |
| 27 | <script type="text/javascript"> | |
| 28 | domUtils.on(window,"load",function(){ | |
| 29 | var map = new google.maps.Map(document.getElementById('container'), { | |
| 30 | zoom: 3, | |
| 31 | streetViewControl: false, | |
| 32 | scaleControl: true, | |
| 33 | mapTypeId: google.maps.MapTypeId.ROADMAP | |
| 34 | }); | |
| 35 | var imgcss; | |
| 36 | var marker = new google.maps.Marker({ | |
| 37 | map: map, | |
| 38 | draggable: true | |
| 39 | }); | |
| 40 | function doSearch(){ | |
| 41 | var address = document.getElementById('address').value; | |
| 42 | var geocoder = new google.maps.Geocoder(); | |
| 43 | geocoder.geocode( { 'address': address}, function (results, status) { | |
| 44 | if (status == google.maps.GeocoderStatus.OK) { | |
| 45 | var bounds = results[0].geometry.viewport; | |
| 46 | map.fitBounds(bounds); | |
| 47 | marker.setPosition(results[0].geometry.location); | |
| 48 | marker.setTitle(address); | |
| 49 | } else alert(lang.searchError); | |
| 50 | }); | |
| 51 | } | |
| 52 | $G('address').onkeydown = function (evt){ | |
| 53 | evt = evt || event; | |
| 54 | if (evt.keyCode == 13) { | |
| 55 | doSearch(); | |
| 56 | } | |
| 57 | }; | |
| 58 | $G("doSearch").onclick = doSearch; | |
| 59 | dialog.onok = function (){ | |
| 60 | var center = map.getCenter(); | |
| 61 | var point = marker.getPosition(); | |
| 62 | var url = "http://maps.googleapis.com/maps/api/staticmap?center=" + center.lat() + ',' + center.lng() + "&zoom=" + map.zoom + "&size=520x340&maptype=" + map.getMapTypeId() + "&markers=" + point.lat() + ',' + point.lng() + "&sensor=false"; | |
| 63 | editor.execCommand('inserthtml', '<img width="520" height="340" src="' + url + '"' + (imgcss ? ' style="' + imgcss + '"' :'') + '/>'); | |
| 64 | }; | |
| 65 | ||
| 66 | function getPars(str,par){ | |
| 67 | var reg = new RegExp(par+"=((\\d+|[.,])*)","g"); | |
| 68 | return reg.exec(str)[1]; | |
| 69 | } | |
| 70 | var img = editor.selection.getRange().getClosedNode(); | |
| 71 | if(img && img.src.indexOf("http://maps.googleapis.com/maps/api/staticmap")!=-1){ | |
| 72 | var url = img.getAttribute("src"); | |
| 73 | var centers = getPars(url,"center").split(","); | |
| 74 | point = new google.maps.LatLng(Number(centers[0]),Number(centers[1])); | |
| 75 | map.setCenter(point); | |
| 76 | map.setZoom(Number(getPars(url,"zoom"))); | |
| 77 | centers = getPars(url,"markers").split(","); | |
| 78 | marker.setPosition(new google.maps.LatLng(Number(centers[0]),Number(centers[1]))); | |
| 79 | imgcss = img.style.cssText; | |
| 80 | }else{ | |
| 81 | setTimeout(function(){ | |
| 82 | doSearch(); | |
| 83 | },30) | |
| 84 | } | |
| 85 | }); | |
| 86 | ||
| 87 | </script> | |
| 88 | </body> | |
| 89 | </html> | |
