zoukankan      html  css  js  c++  java
  • 控经纬度显示地图与卫星

       <link href="css/jquery.ui.base.css" rel="stylesheet" type="text/css" />
        <link href="css/jquery.ui.theme.css" rel="stylesheet" type="text/css" />
        <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
        <script src="js/jquery-1.9.1.js" type="text/javascript"></script>
        <script src="js/jquery.mousewheel.js" type="text/javascript"></script>
        <script src="js/jquery.ui.core.js" type="text/javascript"></script>
        <script src="js/jquery.ui.widget.js" type="text/javascript"></script>
        <script src="js/jquery.ui.button.js" type="text/javascript"></script>
        <script src="js/jquery.ui.spinner.js" type="text/javascript"></script>
        <link href="css/demos.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">
        $(function () {
            function latlong() {
                return new google.maps.LatLng($("#lat").val(), $("#lng").val());
            }
            function position() {
                map.setCenter(latlong());
            }
            $("#lat, #lng").spinner({
                step: .001,
                change: position,
                stop: position
            });


            var map = new google.maps.Map($("#map")[0], {
                zoom: 8,
                center: latlong(),
                mapTypeId: google.maps.MapTypeId.ROADMAP
            });
        });
    </script>
    <style type="text/css">
    #map {
    500px;
    height:500px;
    }
    </style>
    </head>
    <body>


    <label for="lat">纬度</label>
    <input id="lat" name="lat" value="44.797"/>
    <br>
    <label for="lng">经度</label>
    <input id="lng" name="lng" value="-93.278"/>


    <div id="map"></div>


    <div class="demo-description">
    </div>

  • 相关阅读:
    OAuth 2.0之授权码模式
    Rest和Restful & http
    HTTP1.1协议中文版-RFC2616
    Linux中安装Python2.7
    CvMat、Mat、IplImage之间的转换详解及实例
    ROS Node/Topic/Message/Service的一些问题
    ROS的tf_tree相关
    机器人路径规划(包括行人检测及动态避障总结)(长期更新)
    相关博客链接(长期更新)
    关于视觉里程计以及VI融合的相关研究(长期更新)
  • 原文地址:https://www.cnblogs.com/qiqiBoKe/p/3088010.html
Copyright © 2011-2022 走看看