c# winform 应用timer传参数方式实现在谷歌地图上实时位置

最新推荐文章于 2019-08-04 18:42:46 发布

自豪的爬山虎

最新推荐文章于 2019-08-04 18:42:46 发布

阅读量1.9k

点赞数

分类专栏：晓声长谈c# 文章标签： C# 实时监控谷歌地图

本文链接：https://blog.csdn.net/as304915083/article/details/10176773

版权

晓声长谈c# 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

HTML前端脚本

需要调用谷歌地图脚本

    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>

Html Body内部写入HTML元素DIV 用于地图容器全副显示

<body style="margin: 0 0;" οnlοad="javascript:initialize();">
    <div id="map_canvas" style="width: 100%; height: 100%">
    </div>
</body>

JS脚本实现

<script type="text/javascript">


        var map = null;
        var mapOptions = null;
        var marker = null;


        var m1 = ""; m2 = 0; m3 = 0; var markersArray = [];


        function shishi1(m) {
            
            deleteOverlays();
            
            if (map.getZoom() < 10 || map.getZoom() > 13) {
                map.setZoom(10);
            }
            var lat = 0, lon = 0; m1 = ""; time = "";
            var point = m.split("|");
            var myLatlng;
            var infowindow;


            var ltlng = []; man = []; times = [];
            for (var i = 0; i < point.length; i++) {


                lat = point[i].split(",")[0];
                lon = point[i].split(",")[1];
                m1 = point[i].split(",")[2];
                time = point[i].split(",")[3];


                myLatlng = new google.maps.LatLng(lat, lon);
                ltlng.push(new google.maps.LatLng(lat, lon));
                man.push(m1);
                times.push(time);
            }


            for (var i = 0; i <= ltlng.length; i++) {
                var marker = new google.maps.Marker({
                    map: map,
                    position: ltlng[i],
                    title: man[i]
                });
                markersArray.push(marker);
                (function(i, marker) {
                    google.maps.event.addListener(marker, 'click', function() {
                        if (!infowindow) {
                            infowindow = new google.maps.InfoWindow();
                        }
                        infowindow.setContent("<span class='s1'>巡检员昵称</span>:" + man[i] + "<br/><span class='s1'>上次位置时间</span>:" + dateConvert(times[i]));
                        infowindow.open(map, marker);
                    });
                })(i, marker);
            }
            function deleteOverlays() {
                if (markersArray) {
                    for (i in markersArray) {
                        markersArray[i].setMap(null);
                    }
                    markersArray.length = 0;
                }
            }


        }
        function dateConvert(str) {
            var timestr = "20" + str.substr(0, 2) + "-" + str.substr(2, 2) + "-" + str.substr(4, 2) + " " + str.substr(6, 2) + ":" + str.substr(8, 2) + ":" + str.substr(10, 2);
            return str != "" ? jQuery.timeago(timestr) : "";
        }


        function SendSSPoint(m, p0, p1) {
            m1 = m;
            m2 = p0;
            m3 = p1;
            var infowindow;


            var parliament = new google.maps.LatLng(m2, m3);
            map.setZoom(18);
            marker.setPosition(parliament);
            if (OutofRect(parliament)) {
                map.setCenter(parliament);
            }
            google.maps.event.addListener(marker, 'click', function() {
                if (!infowindow) {
                    infowindow = new google.maps.InfoWindow();
                }
                infowindow.setContent("<span class='s1'>巡检员昵称</span>:<img src='Images/peopleHeader.png' width='35px' height='35px' />   " + m1 + "<br/><span class='s1'>当前经纬度</span>:" + m2 + "," + m3);
                infowindow.open(map, marker);
            });
        }
        function OutofRect(parliament) {
            if (map.getBounds().contains(parliament))
                return false;
            else
                return true;
        }
        function initialize() {


            mapOptions = {
                zoom: 18,
                center: new google.maps.LatLng(39.92, 116.46),
                mapTypeId: google.maps.MapTypeId.HYBRID
            };
            map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
            //var image = 'Images/MapMarker_Flag4_Left_Pink.png';  自定义头像图标 需要可以写入Marker ICON属性里
            marker = new google.maps.Marker({
                position: new google.maps.LatLng(39.92, 116.46),
                map: map,
                title: m1
            });
            markersArray.push(marker);
        }
    </script>

C# 后端实现

webBrowser1.Document.InvokeScript("shishi1", p);

p 为parmer[] 对象

自豪的爬山虎

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
c# winform 应用timer传参数方式实现在谷歌地图上实时位置

HTML前端脚本需要调用谷歌地图脚本 Html Body内部写入HTML元素DIV 用于地图容器全副显示 JS脚本实现 var map = null; var mapOptions = null; var marker = null; var m1 = ""; m2 =
复制链接

扫一扫