May 25, 2015

Google Maps API 以某一经纬度为中心，以某一长度位半径画圆 Draw the radius of a circle

直接看代码：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title> - jsFiddle demo</title>
<script type='text/javascript' src="http://maps.google.com/maps/api/js?sensor=false&.js"></script>
<script type='text/javascript'>

    window.onload=function()
    {
        var map;
        var latlng = new google.maps.LatLng(-34.397, 150.644);
        
        function initialize() 
        {
            var mapOptions = {
                center: latlng,
                zoom: 9,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            var el=document.getElementById("map_canvas");
            map = new google.maps.Map(el, mapOptions);
        
            var marker = new google.maps.Marker({
                map: map,
                position: latlng
            });
            
            var sunCircle = {
                strokeColor: "#c3fc49",
                strokeOpacity: 0.8,
                strokeWeight: 2,
                fillColor: "#c3fc49",
                fillOpacity: 0.35,
                map: map,
                center: latlng,
                radius: 15000 // in meters
            };
            cityCircle = new google.maps.Circle(sunCircle);
            cityCircle.bindTo('center', marker, 'position');
        }
        initialize();    
    }

</script>

</head>

<body>
    <div id="map_canvas" style="width:400px;height:400px;"></div>
</body>
</html>

参考：http://stackoverflow.com/a/12232608/4484798

更对参考:

Google Maps V3: 导航到指定地址 Draw (Plot) route between User’s current location and Specified location

Google Maps V3: 通过经纬度获取地址信息 Get address from Latitude and Longitude

jQuery地图插件-jqvmap

谷歌地图查询两地开车路线 Google Maps API V3: DirectionsService (Driving Directions) example

谷歌地图添加点击事件 Google Maps API V3: Add click event listener to all (multiple) markers

Google Maps API v3: Remove Markers 移除标记

点击谷歌地图后获取经纬度 Get Latitude and Longitude (Location Coordinates) using Google Maps OnClick event

GMaps.js：让你快速集成 Google Maps 服务的 jQuery 插件

Google Maps API V3: 通过邮编获取经纬度 Get Location (Latitude and Longitude) from Zip Code (Pin Code) using JavaScript

Mysql: LBS实现查找附近的人（两经纬度之间的距离）

原文：Google Maps API 以某一经纬度为中心，以某一长度位半径画圆 Draw the radius of a circle

移动前端工作的那些事---前端制作篇之框架篇
为了更好的提升用户体验，移动端逐渐出了许多的移动端的框架，比如Sencha Touch、JQTouch、Jquery-moblie、jqMobi等等。这些框架都有优缺点，不同的框架应用在不同的项目中。现简单阐述一下各框架的优缺点：一、Sencha Touch框架是一个重量级的框架、它上手较难，代码复杂，并且需要较强的程序基础才能学习，最开始的时候因为一个项目，想使用Sencha Touch框架，后来工期实在太紧张，根本没时间学习它并使用。所以最后转投其他框架。这个框架兼容性很高，运行起来的速度一般，需要长时间的学习且需要水平较高的程序基础才行。所以不太适合前端制作人员的使用。我会在以后的机会单开一篇关于它的使用demo。二、JQTouch是一个轻量级框架、纯jquery写法，上手比较容易，代码容易理解，加载速度也很快，缺点是配合的移动端效果插件较少，需要很多外部的插件相结合，另外，个别插件还需要解决与框架之间的兼容问题。它的最大的一个弊端就是可利用和变通的布局较少。三、Jquery-moblie也是一个轻量级框架、纯jquery写法，上手容易，代码容易理解，但由于其绑定的前端效果插件过多，且代码结构有些臃肿，造成加载速度很慢。尤其是在android系统上测试，速度很慢。用户体验效果不太好，它比较适合开发IPAD或是IOS系统的高端机型。四、jqMobi也是一个轻量级框架、它的语言基于jquery语言。并对其进行了简化，更有利于在移动设备上进行应用，并且速度很流畅。上手也比较容…
【漫画详解】用iframe障眼法，骗取用户点击
做过Web开发的朋友曾经都有过这么个念头：在自己的页面里内嵌一个其他网站的网页，然后可以用脚本去获取他们页面里的信息，甚至可以。。。显然，有这么好的事也肯定轮不到你来尝了：）一个叫沙箱模型的东西被发明出来，就是防止有这种想法的人搞破坏。。。所以现在的我们只能远观，不可亵玩也。不过，这些规定只是针对脚本而已。假如让用户自己乖乖的去点，那当然是没问题的。但有多少人会去点呢！！所以，我们需要施一些特殊的障眼法，让用户在不经意间，就点了我们想让他点的东西：）就拿上面那个来说吧，如果直接把这个大页面赤果果的硬塞进网页，无论你怎么提示他点，或者说多少好话，大家见了就烦，就是不点：）所以说，我们必须得修饰修饰，不然人家见了就吓跑了。首先也是最关键的就是这身材问题，突然冒出个这么肥硕的一个页面，看的人眼花缭乱，不知道发送什么情况啦。我们要好好修剪一下，把没用的部分统统去掉，只留下我们想要的“精华”。这个简单，只要把框架先放到一个层里面，然后把层的尺寸固定好，…
jQuery实现的测试答题功能
有时在网页中要加入一个在线测试功能，例如在线调查，在线测试各类知识等应用，这类应用需要用到很多前后端技能。今天我给大家分享一个基于jQuery的前端应用——测试答题功能。查看演示下载源码 HTML 首先载入jquery库文件和quiz.js以及所需的CSS样式文件styles.css。 <script src="jquery.js"></script> <script src="quiz.js"></script>…

Just Code

Google Maps API 以某一经纬度为中心，以某一长度位半径画圆 Draw the radius of a circle

About Author

Gideon

Add a Comment

Related Posts

Related Posts

About Author

Gideon

Add a Comment