在使用appcan进行移动开发时候，导航的两种实现方式：一、基于地图的API；二、基于导航的API。本文就appcan用地图实现附近、卫星地图、路径规划和交通图四个方面的实现做讲解：
代码：
<!DOCTYPE html>
<html class="um landscape min-width-240px min-width-320px min-width-480px min-width-768px min-width-1024px">
<head>
<title></title>
<meta charset="utf-8">
<meta name="viewport" content="target-densitydpi=device-dpi, width=device-width, initial-scale=1, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<link rel="stylesheet" href="css/fonts/font-awesome.min.css">
<link rel="stylesheet" href="css/ui-box.css">
<link rel="stylesheet" href="css/ui-base.css">
<link rel="stylesheet" href="css/ui-color.css">
<link rel="stylesheet" href="css/appcan.icon.css">
<link rel="stylesheet" href="css/appcan.control.css">
<link rel="stylesheet" href="css/GPRS.css">
</head>
<body class="um-vp" ontouchstart>
<div id="page_0" class="up ub ub-ver bc-bg" tabindex="0">
<!--header开始-->
<div id="header" class="uh bc-text-head ub bc-head">
<div id="sechplan" class="yb-btn" id="back">
推荐 <br />
导航
</div>
<div class="uinn uinn ub-f1">
<div class=" sc-bg-active uinput ub ub-f1 bc-border uba uc-a1">
<input value="" id="splace" type="text" class="" >
</div>
<div class="sc-bg-active uinput ub ub-f1 bc-border uba uc-a1" style="margin-top:0.2em" >
<input value="" id="eplace" type="text" class="" >
</div>
</div>
<div class="yb-btn" id="search">
<div class="fa fa-search fa-yb"></div>
</div>
</div>
<!--header结束-->
<!--content开始-->
<div id="content" class="ub-f1 tx-l">
</div>
<!--content结束-->
<div id="footer" class="uh bc-text-head ub bc-head uinn">
<div class="yb-btn ub-f1" id="btn1">
<div class="fa fa-globe fa-2x"></div>
</div>
<div class="yb-btn ub-f1" id="btn2">
<div class="fa fa-map-marker fa-2x"></div>
</div>
<div class="yb-btn ub-f1" id="btn3">
<div class="fa fa-location-arrow fa-2x"></div>
</div>
</div>
</div>
<script src="js/appcan.js"></script>
<script src="js/appcan.control.js"></script>
</body>
<script>
var titHeight = $('#header').offset().height;
var serchlong;
var serchlati;
var longitude;//当前
var latitude;
var setText;
var cityname;
appcan.ready(function() {
appcan.initBounce();
var top=Number(appcan.locStorage.getVal("titheight"));
var width=screen.availWidth;
var height=screen.availHeight-top-50;
uexBaiduMap.open(0,titHeight,
$('#content').offset().width,
$('#content').offset().height,
"30.78","103.95");
uexBaiduMap.setCompassEnable(1);
uexBaiduMap.setScrollEnable(1)
最低0.47元/天 解锁文章
162
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
