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>

  • 相关阅读:
    SpringBoot: 2.SpringBoot整合servlet(转)
    SpringBoot: 1.创建第一个SpringBoot项目(转)
    SqlServer:SqlServer(服务器磁盘监控,创建管理员账号分配权,添加链接服务器,查询CPU,查询内存)
    Log parser工具使用
    目录爆破工具
    安装腾讯QQ问题记录
    Sql Server 2017 安装问题记录
    reGeorg+Proxifier使用
    Swaks
    python2.7 安装pycrypto库报错
  • 原文地址:https://www.cnblogs.com/qiqiBoKe/p/3088010.html
Copyright © 2011-2022 走看看