基於高德地圖實現移動網際網路地圖定位自動檢索系統

阿新 • • 發佈：2019-01-15

<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title>移動網際網路地圖定位自動檢索系統-熊盼</title>
		<style type="text/css">
			* {
				margin: 0px;
				padding: 0px;
			}
			
			body {
				font-family: "微軟雅黑";
				color: #666;
				font-size: 12px;
			}
			
			.header {
				width: 100%;
				height: 80px;
				background: #f5f5f5;
				border-bottom: 1px solid #d2d2d2;
			}
			
			.header .h_logo {
				padding: 20px 30px 0 30px;
				float: left;
			}
			
			.header .h_search {
				float: left;
				line-height: 75px;
			}
			
			.header .h_search span {
				font-size: 16px;
				font-family: "楷體";
			}
			
			.header .h_search .t_txt {
				width: 125px;
				height: 25px;
				outline: none;
				border: 1px solid #ededed;
				padding-left: 6px;
				letter-spacing: .5px;
			}
			
			.header .h_search .t_btn {
				width: 60px;
				height: 28px;
				outline: none;
				color: #fff;
				background: #27c;
				border-radius: 5px;
				cursor: pointer;
			}
			
			.header .h_search .t_btn:hover {
				background: #000;
				transition: all 0.8s ease;
			}
			
			.maps {
				width: 100%;
				height: 800px;
			}
			
			.maps .m_map {
				width: 100%;
				height: 800px;
			}
			
			#panel {
				width: 250px;
				max-height: 80%;
				border: 1px solid silver;
				position: absolute;
				right: 20px;
				top: 80px;
				border-top: none;
				overflow: auto;
			}
		</style>
	</head>

	<body>
		<div class="header">
			<div class="h_logo">
				<h1>高德地圖路徑規劃</h1>
			</div>
			<div class="h_search">
				<span>起始地</span><input type="text" class="t_txt" id="start" placeholder="起始地" />
				<span>結束地</span><input type="text" class="t_txt" id="end" placeholder="結束地" />
				<input type="button" class="t_btn" value="搜尋" onclick="search()" />
				<span>關鍵詞查詢</span>
				<input type="text" class="t_txt" id="site" onclick="keysearch()" />
				<input type="button" class="t_btn" value="搜一搜" />
			</div>
		</div>
		<div class="maps">
			<div class="m_map" id="mapContainer"></div>
			<div id="panel"></div>
		</div>
		<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=c892adb4571e31adcf085646a26eaec5"></script>
		<script type="text/javascript">
			var map, toolBar, mouseTool;
			var map = new AMap.Map('mapContainer', {
				resizeEnable: true,
				zoom: 11,
			});
			//給地圖新增地圖操作ToolBar外掛、滑鼠工具MouseTool外掛
			map.plugin(["AMap.ToolBar", "AMap.MouseTool"], function() {
				toolBar = new AMap.ToolBar();
				map.addControl(toolBar);
				mouseTool = new AMap.MouseTool(map);
			});
			AMap.plugin('AMap.Autocomplete', function() {
				//例項化AutoComplete
				var autoOptions = {
					city: "武漢市",
					input: "start"
				};
				autocomplete = new AMap.Autocomplete(autoOptions);
			});
			AMap.plugin('AMap.Autocomplete', function() {
				//例項化AutoComplete
				var autoOptions = {
					city: "武漢市",
					input: "end"
				};
				autocomplete = new AMap.Autocomplete(autoOptions);
			});

			//搜尋展示
			function search() {
				//載入公交換乘的外掛
				AMap.service('AMap.Transfer', function() { //回撥函式
					var trans;
					transOptions = {
						map: map,
						panel: "panel",
						city: '武漢市', //公交城市
						policy: AMap.TransferPolicy.LEAST_TIME //乘車策略
					};
					//構造公交換乘類
					trans = new AMap.Transfer(transOptions);
					//根據起、終點座標查詢公交換乘路線
					trans.search([{
						keyword: document.getElementById('start').value
					}, {
						keyword: document.getElementById('end').value
					}], function(status, results) {});
				});
			};

			function keysearch() {
				var site = document.getElementById('site').value;
				AMap.service(['AMap.PlaceSearch'], function() {
					var placeSearch = new AMap.PlaceSearch({
						pageSize: 5,
						pageIndex: 1,
						city: "027",
						map: map,
						panel: panel
					});
					//關鍵字查詢
					placeSearch.search(site);
				});
			};
		</script>
	</body>

</html>

基於高德地圖實現移動網際網路地圖定位自動檢索系統

<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>移動網際網路地圖定位自動檢索系統-熊盼</title> <

基於高德地圖為底圖實現全國、省、地級市下鑽

目錄簡介效果圖具體實現注意點不足點簡介由於前面通過echarts和百度地圖都沒能實現理想效果從而只能另尋方案，最終實現方案：全國省採用echarts渲染，單個省、地級市採用高德地圖為地圖渲染（有人可能會疑問為什麼不全部採用高德地圖渲染，在上一篇中我

基於高德地圖實現的公交線路查詢功能

resource 返回 end 裏的成功文檔地圖插件 osi con 高德地圖支持公交線程查詢功能。線上示例; 線上示例說明接口返回的數據結構： path和via_stops字段詳情： ... path: [ { Q: 39.97741,

基於高德地圖實現完全自定義Marker

做地圖社交類APP開發的都知道,一般情況下,為了整體的美觀和使用者體驗度,我們需要定製化Marker的樣式。本文中實現的方式都是基於高德地圖的,百度地圖也類似,大家可以照葫蘆畫瓢,廢話不多說,先來看看最終效果: 實現思路: 先來看看高德官方提供的設

微信小程式-基於高德地圖API實現天氣元件(動態效果)

#### 微信小程式-基於高德地圖API實現天氣元件(動態效果) 在社群翻騰了許久，沒有找到合適的天氣外掛。迫不得已，只好借鑑網際網路上的`web`專案，手動遷移到小程式中使用。現在分享到網際網路社群中，幫助後續有需要的開發者。 > 1.元件介紹 **1.1 元件效果預覽圖** 小程

基於高德地圖的描點操作，監聽地圖縮放，展示合理數量的marker

基於高德地圖的android開發

首先：接入高德地圖第三方SDK——如何獲取API Key 一：登入---高德開發平臺二：控制檯--》應用管理--》建立新的應用：獲取除錯版SHA1安全碼：首先這不先別去看文件看完之後你會更懵找到build--》點選creat new--》在

php+高德地圖webapi 高德jsapi 實現當前位置與目標位置距離並按照距離排序（座標逆轉換）

Android基於高德地圖實時定位服務

Service功能有：實時定位（後臺進行） Service不會，去百度谷歌功能有實時定位（30秒間隔）判斷是否在規定的時間段內判斷距離是否大於規定的距離判斷服務是否在開啟的狀態服務程式碼：LocationService（Android

基於高德地圖的交通資料分析

前言設計需求在於每天上班早高峰期,每次都提前出門,雖然有地圖可以實時檢視路況,但是再過一陣時間就會異常的堵車如果通過資料監控分析每天指定路段在什麼時間段相應的擁堵情況,即可合理控制時間. 有時候很早出門,卻堵車堵得依然快遲到,而有時出門時間晚了,卻發現那個

微信小程式-路線規劃,地圖導航功能基於高德地圖API

主要實現微信小程式中的地圖路線規劃和地圖導航功能小程式二維碼：更新 2018年4月18日：新增限行限號查詢。 2018年5月7日：新增快遞查詢，模板訊息傳送。準備 2、在微信小程式後臺把restapi.amap.com新增進request合法域名

基於高德地圖根據地址名稱返回對應的經緯度

在吹水之前，首先先感謝阿里巴巴所提供的高德地圖服務，沒有阿里巴巴，那接下來的逼我也裝不了。寫這篇部落格的緣由，原因是我閒的慌，想搞點事情。因為工作中，有這麼一個需求，需要根據一系列的具體地址，返回所對應的經緯度。閒話少說，老樣子，先上程式碼。沒上程式碼

基於高德地圖SDK進行搜尋

高德地圖SDK使用地址http://lbs.amap.com/ 地圖設定 #define GDMAPKEY @"key" #import "ViewController.h" #import <MapKit/MapKit.h> #import <AM

android跳轉手機百度高德騰訊谷歌地圖、地圖傳座標、座標偏移、base64解碼相關

調起百度的native app http://developer.baidu.com/map/uri-introandroid.htm#idmykey47 座標轉換 http://api.map.baidu.com/ag/coord/convert?from=2&

基於移動網際網路的高校評優評獎系統設計與實現

**基於移動網際網路的高校評優評獎系統設計與實現** 基於移動網際網路的高校評優評獎系統設計與實現mysql資料庫建立語句基於移動網際網路的高校評優評獎系統設計與實現oracle資料庫建立語句基於移動網際網路的高校評優評獎系統設計與實現sqlserver資料庫建立語句

【高德地圖API】從零開始學高德JS API（七）——定位方式大揭祕

摘要：關於定位，分為GPS定位和網路定位2種。GPS定位，精度較高，可達到10米，但室內不可用，且超級費電。網路定位，分為wifi定位和基站定位，都是通過獲取wifi或者基站資訊，然後查詢對應的wifi或者基站位置資料庫，得到的定位地點。定位資料庫可以不斷完善不斷補充，所以，

包含高德，百度等地圖 apikey 專案打包 relese debug keystore

1.debug版，不同編譯環境，sha1不同，需要自己提取；在android studio terminal中輸入 keytool -list -v -keystore C:\Users\Ad

基於高德地圖實現移動網際網路地圖定位自動檢索系統

基於高德地圖實現移動網際網路地圖定位自動檢索系統

基於高德地圖為底圖實現全國、省、地級市下鑽

基於高德地圖實現的公交線路查詢功能

基於高德地圖實現完全自定義Marker

微信小程式-基於高德地圖API實現天氣元件(動態效果)

基於高德地圖的描點操作，監聽地圖縮放，展示合理數量的marker

基於高德地圖的android開發

php+高德地圖webapi 高德jsapi 實現當前位置與目標位置距離並按照距離排序（座標逆轉換）

Android基於高德地圖實時定位服務

基於高德地圖的交通資料分析

微信小程式-路線規劃,地圖導航功能基於高德地圖API

基於高德地圖根據地址名稱返回對應的經緯度

基於高德地圖SDK進行搜尋

最新基於高德地圖的android進階開發（4）GPS定位之POI（Point of interesting）興趣點原始碼簡介

最新基於高德地圖的android進階開發（1）獲取 Map API Key

最新基於高德地圖的android進階開發（5）地圖的基本操作、事件監聽、使用者UI、圖層選擇等

android跳轉手機百度高德騰訊谷歌地圖、地圖傳座標、座標偏移、base64解碼相關

基於移動網際網路的高校評優評獎系統設計與實現

【高德地圖API】從零開始學高德JS API（七）——定位方式大揭祕

包含高德，百度等地圖 apikey 專案打包 relese debug keystore

基於高德地圖實現移動網際網路地圖定位自動檢索系統

相關推薦