手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >基于jquery实现控制经纬度显示地图与卫星
基于jquery实现控制经纬度显示地图与卫星
摘要:复制代码代码如下:$(function(){functionlatlong(){returnnewgoogle.maps.LatLng($(...

复制代码 代码如下:

<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 {

width: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>

</div>

【基于jquery实现控制经纬度显示地图与卫星】相关文章:

基于jquery实现下拉框美化特效

jQuery的Scrollify插件实现滑动到页面下一节点

JQuery勾选指定name的复选框集合并显示的方法

javascript改变和控制显示的图片大小

JavaScript实现广告的关闭与显示效果实例

jQuery+ajax实现无刷新级联菜单示例

jQuery实现在列表的首行添加数据

jquery实现动态改变div宽度和高度

javascript实现简单的进度条

js控制excel打印完美解决方案

精品推荐
分类导航