封装的google地图几个常用方法

包含地图初始化,添加标记,画线,取点的坐标等方法

<script src="http://maps.googleapis.com/maps/api/js?key=[you register key]&sensor=false"></script>
<div class="map"></div>
<script type="text/javascript">
    $(function () {
        var myMap;
        var cars = {};
        var ico = '/img/car.ico';
        var minZoom = 8;
        var maxZoom = 16;
        function init() {
            //初始化地图
            var mapOptions = {
                zoom: 10,
                center: new google.maps.LatLng(29.872885, 121.552809),//中心点
                mapTypeId: google.maps.MapTypeId.ROADMAP,
            }
            myMap = new google.maps.Map(document.getElementById("map"), mapOptions);
            //控制缩放级别
            google.maps.event.addListener(myMap, 'zoom_changed', function () {
                if (myMap.getZoom() < minZoom) {
                    myMap.setZoom(minZoom);
                }
                if (myMap.getZoom() > maxZoom) {
                    myMap.setZoom(maxZoom);
                }
            });
        }
        function addMarkers(points) {
            for (var i = 0; i < points.length; i++) {
                addMarker(points[i]);
            }
        }
        function addMarker(p) {
            var o = cars[p.id];
            o && o.setMap(null);
            cars[p.id] = new google.maps.Marker({
                map: myMap,
                icon: ico,
                title: p.name,
                status: 'active',
                position: new google.maps.LatLng(p.x, p.y)
            });
        }
        init();

        //画线
        var linePoints = [
            new google.maps.LatLng(29.83092, 121.55923),
            new google.maps.LatLng(29.83020, 121.55923),
            new google.maps.LatLng(29.83015, 121.56059),
            new google.maps.LatLng(29.82929, 121.56423),
            new google.maps.LatLng(29.82276, 121.56407),
            new google.maps.LatLng(29.82273, 121.56652),
            new google.maps.LatLng(29.82234, 121.56652),
            new google.maps.LatLng(29.82209, 121.56695),
        ];
        var trackPath = new google.maps.Polyline({
            path: linePoints,
            strokeColor: "#FF0000", // 线条颜色
            strokeOpacity: 1.0,     // 线条透明度
            strokeWeight: 2         // 线条粗细
        });
        trackPath.setMap(myMap);    //画线

        //右键取当前点的坐标
        google.maps.event.addListener(myMap, "rightclick", function(event) {
            var lat = event.latLng.lat();
            var lng = event.latLng.lng();
            // 经纬度
            alert("Lat=" + lat + "; Lng=" + lng);
        });

        //添加标记
        var list = [
            { id: 1, x: 29.761246, y: 121.546600, name: 'driver 1' },
            { id: 2, x: 29.891246, y: 121.566600, name: 'driver 1' },
        ];
        addMarkers(list);
    });
</script>


  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
一个老外(西班牙)编写的控件,封装了全部google maps api ,使用在DELPHI中使用谷歌地图变得非常简单 GMLib - Google Maps Library Send suggestions to gmlib@cadetill.com Supported Delphi version: Delphi 6, 7, 2007, 2010, XE2, XE3 Tested Windows Versions: XP, 2003, Vista, 7 Change History january 14, 2013 - Google Maps Library v0.1.9 - Improvement: Compatible with FMX framework. - Improvement: About all Geometry Library coded. - bug fixed: Some bugs fixes. - Attempt to do compatible with DCEF components. October 05, 2012 - Google Maps Library v0.1.8 - Improvement: Compiled under XE3 - Improvement: new component added, the TGMElevation. - bug fixed: General -> fixed all memory leaks found - bug fixed: TGMDirection -> the OnDirectionsChanged event was not triggered - Improvement: TBasePolyline -> class TLinePoints and TLinePoint is disassociated from TPolyline and they are transferred to GMClasses - Improvement: TBasePolyline -> implements ILinePoint interface September 11, 2012 - Google Maps Library v0.1.7 - bug fixed: some memory leaks fixed (there is still some) (thanks Donovan) - Improvement: TGMCircle -> modified all Set and ShowElements methods to use the new method ChangeProperties inherited from TLinkedComponent - Improvement: GMFunctions -> added new functions of transformation types - Improvement: TGMGeoCode-> added boolean property PaintMarkerFound. To true, all markers are automatically generated (if a TGMMarker is linked) (by Luis Joaquin Sencion) - Improvement: TGMGeoCode-> generated URL is encoded in UTF8 to avoid problems with special characters (? accents, ....) - Improvement: TGMMap.TNonVisualProp -> added MapMarker property. True if Map Maker tiles should be used instead of regular tiles. - Improvement: TLatLngEvent -> the events of this type now have a new parametre, X and Y, of Real type, with information of point (X,Y) - Improvement: TLinkedComponent -> added ShowInfoWinMouseOver boolean property. If true, show the InfoWindows when mouse is over the object. Now

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值