百度地圖高階例項1-如何利用【百度地圖API】，製作房產酒店地圖？（中）
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"/><title>酷訊酒店地圖</title><script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2"></script><style type="text/css">
a{text-decoration:none;color:#6ce;font-size:14px;}
a:hover{text-decoration:underline;}</style></head><body><div style="float:left;width:520px;height:340px;border:1px solid gray" id="container"></div><div style="float:left;width:200px;height:340px;border:1px solid gray;border-width:1px 1px 1px 0;padding:0 10px 0 0;line-height:1.8em;"><ul><li><span style="float:right;">120元</span><a onmouseover="openMyWin(infoWindow1,point[1])" href="#">如家快捷酒店</a></li><li><span style="float:right;">2370元</span><a onmouseover="openMyWin(infoWindow2,point[2])" href="#">崑崙大廈</a></li><li><span style="float:right;">50元</span><a onmouseover="openMyWin(infoWindow3,point[3])" href="#">華夏銀行</a></li><li><span style="float:right;">16元</span><a onmouseover="openMyWin(infoWindow4,point[4])" href="#">成都小吃</a></li><li><span style="float:right;">300元</span><a onmouseover="openMyWin(infoWindow5,point[5])" href="#">錦繡大飯店</a></li><li><span style="float:right;">180元</span><a onmouseover="openMyWin(infoWindow6,point[6])" href="#">七天快捷酒店</a></li><li><span style="float:right;">9元</span><a onmouseover="openMyWin(infoWindow7,point[7])" href="#">中央民族大學</a></li><li><span style="float:right;">3300元</span><a onmouseover="openMyWin(infoWindow8,point[8])" href="#">昌平汽車專修學院</a></li><li><span style="float:right;">20元</span><a onmouseover="openMyWin(infoWindow9,point[9])" href="#">百度大廈</a></li><li><span style="float:right;">1000元</span><a onmouseover="openMyWin(infoWindow0,point[0])" href="#">海爾電器銷售點</a></li></ul></div></body></html><script type="text/javascript">var map =new BMap.Map("container");
var point =new BMap.Point(116.404, 39.915);
map.centerAndZoom(point, 14);
var myIcon =new BMap.Icon("http://dev.baidu.com/wiki/static/map/API/examples/images/Mario.png", new BMap.Size(32, 70), { //小車圖片 imageOffset: new BMap.Size(0, 0) //圖片的偏移量。為了是圖片底部中心對準座標點。 });
var point = [new BMap.Point(116.411776,39.942833),new BMap.Point(116.320791,40.003682),new BMap.Point(116.275186,39.896095),new BMap.Point(116.425098,39.946249),new BMap.Point(116.359823,39.984761),new BMap.Point(116.316479,39.98323),new BMap.Point(116.385986,39.946124),new BMap.Point(116.427545,40.00796),new BMap.Point(116.446965,39.911603),new BMap.Point(116.454579,39.946652)]; //10個座標點var marker1 =new BMap.Marker(point[1],{icon:myIcon}); // 建立10個標註var marker2 =new BMap.Marker(point[2],{icon:myIcon});
var marker3 =new BMap.Marker(point[3],{icon:myIcon});
var marker4 =new BMap.Marker(point[4],{icon:myIcon});
var marker5 =new BMap.Marker(point[5],{icon:myIcon});
var marker6 =new BMap.Marker(point[6],{icon:myIcon});
var marker7 =new BMap.Marker(point[7],{icon:myIcon});
var marker8 =new BMap.Marker(point[8],{icon:myIcon});
var marker9 =new BMap.Marker(point[9],{icon:myIcon});
var marker0 =new BMap.Marker(point[0],{icon:myIcon});
map.addOverlay(marker1); // 將標註新增到地圖中map.addOverlay(marker2);
map.addOverlay(marker3);
map.addOverlay(marker4);
map.addOverlay(marker5);
map.addOverlay(marker6);
map.addOverlay(marker7);
map.addOverlay(marker8);
map.addOverlay(marker9);
map.addOverlay(marker0);
map.setViewport(point); //調整地圖的最佳視野為顯示標註陣列pointvar opts1 = {offset : new BMap.Size(0, -25), title : '<span style="font-size:14px;color:#0A8021">如家快捷酒店</span>'};
var opts2 = {offset : new BMap.Size(0, -25), title : '<span style="font-size:14px;color:#0A8021">崑崙大廈</span>'};
var opts3 = {offset : new BMap.Size(0, -25), title : '<span style="font-size:14px;color:#0A8021">華夏銀行</span>'};
var opts4 = {offset : new BMap.Size(0, -25), title : '<span style="font-size:14px;color:#0A8021">成都小吃</span>'};
var opts5 = {offset : new BMap.Size(0, -25), title : '<span style="font-size:14px;color:#0A8021">錦繡大飯店</span>'};
var opts6 = {offset : new BMap.Size(0, -25), title : '<span style="font-size:14px;color:#0A8021">七天快捷酒店</span>'};
var opts7 = {offset : new BMap.Size(0, -25), title : '<span style="font-size:14px;color:#0A8021">中央民族大學</span>'};
var opts8 = {offset : new BMap.Size(0, -25), title : '<span style="font-size:14px;color:#0A8021">昌平汽車專修學院</span>'};
var opts9 = {offset : new BMap.Size(0, -25), title : '<span style="font-size:14px;color:#0A8021">百度大廈</span>'};
var opts0 = {offset : new BMap.Size(0, -25), title : '<span style="font-size:14px;color:#0A8021">海爾電器銷售點</span>'};
var infoWindow1 =new BMap.InfoWindow("<div style='line-height:1.8em;font-size:12px;'><b>地址:</b>北京市朝陽區高碑店小學旁</br><b>電話:</b>010-59921010</br><b>口碑：</b><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><a style='text-decoration:none;color:#2679BA;float:right' href='#'>詳情>></a></div>", opts1); // 建立資訊視窗物件，引號裡可以書寫任意的html語句。var infoWindow2 =new BMap.InfoWindow("<div style='line-height:1.8em;font-size:12px;'><b>地址:</b>北京市海淀區紫竹院123號</br><b>電話:</b>010-59921010</br><b>口碑：</b><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><a style='text-decoration:none;color:#2679BA;float:right' href='#'>詳情>></a></div>", opts2);
var infoWindow3 =new BMap.InfoWindow("<div style='line-height:1.8em;font-size:12px;'><b>地址:</b>北京市海淀區紫竹院123號</br><b>電話:</b>010-59921010</br><b>口碑：</b><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><a style='text-decoration:none;color:#2679BA;float:right' href='#'>詳情>></a></div>", opts3);
var infoWindow4 =new BMap.InfoWindow("<div style='line-height:1.8em;font-size:12px;'><b>地址:</b>北京市海淀區紫竹院123號</br><b>電話:</b>010-59921010</br><b>口碑：</b><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><a style='text-decoration:none;color:#2679BA;float:right' href='#'>詳情>></a></div>", opts4);
var infoWindow5 =new BMap.InfoWindow("<div style='line-height:1.8em;font-size:12px;'><b>地址:</b>北京市朝陽區高碑店小學旁</br><b>電話:</b>010-59921010</br><b>口碑：</b><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><a style='text-decoration:none;color:#2679BA;float:right' href='#'>詳情>></a></div>", opts5);
var infoWindow6 =new BMap.InfoWindow("<div style='line-height:1.8em;font-size:12px;'><b>地址:</b>北京市大鐘寺滄瀾大廈</br><b>電話:</b>010-59921010</br><b>口碑：</b><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><a style='text-decoration:none;color:#2679BA;float:right' href='#'>詳情>></a></div>", opts6);
var infoWindow7 =new BMap.InfoWindow("<div style='line-height:1.8em;font-size:12px;'><b>地址:</b>北京市朝陽區高碑店小學旁</br><b>電話:</b>010-59921010</br><b>口碑：</b><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><a style='text-decoration:none;color:#2679BA;float:right' href='#'>詳情>></a></div>", opts7);
var infoWindow8 =new BMap.InfoWindow("<div style='line-height:1.8em;font-size:12px;'><b>地址:</b>北京市哇哈哈路鮮魚一條街</br><b>電話:</b>010-59921010</br><b>口碑：</b><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><a style='text-decoration:none;color:#2679BA;float:right' href='#'>詳情>></a></div>", opts8);
var infoWindow9 =new BMap.InfoWindow("<div style='line-height:1.8em;font-size:12px;'><b>地址:</b>北京市朝陽區高碑店小學旁</br><b>電話:</b>010-59921010</br><b>口碑：</b><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><a style='text-decoration:none;color:#2679BA;float:right' href='#'>詳情>></a></div>", opts9);
var infoWindow0 =new BMap.InfoWindow("<div style='line-height:1.8em;font-size:12px;'><b>地址:</b>北京市朝陽區高碑店小學旁</br><b>電話:</b>010-59921010</br><b>口碑：</b><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><img src='http://cdn2.iconfinder.com/data/icons/diagona/icon/16/031.png' /><a style='text-decoration:none;color:#2679BA;float:right' href='#'>詳情>></a></div>", opts0);
marker1.addEventListener("mouseover", function(){this相關推薦
百度地圖高階例項1-如何利用【百度地圖API】，製作房產酒店地圖？（中）
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"/><title>酷訊酒店地圖</title>
【經典數據結構】B樹與B+樹（轉）
linux 每分鐘 www 數據 csapp png 感知 轉動 繼續 本文轉載自：http://www.cnblogs.com/yangecnu/p/Introduce-B-Tree-and-B-Plus-Tree.html 維基百科對B樹的定義為“在計算機科學中，B
【6年人工智慧開發】簡述卷積神經網路（CNN）
在百度做了6年人工智慧方面的程式設計開發，也有很多這方面的經驗吧，從古至今，機器人一直承載著人類巨大的夢想。隨著各類感測器、語音互動、機器識別、SLAM等技術的蓬勃發展，機器人開始從科幻作品中走出
【安卓本卓】Android系統原始碼篇之（二）Source Insight
Source Insight（以下簡稱SI） 一、SI簡介 SI是一款面向專案開發的程式編輯器和程式碼瀏覽器，它提供了一個檢視將分散在各個地方的程式碼匯合在一起形成一個虛擬的整體，供開發者方便地閱讀和編輯，如下圖所示。它已經持續維護了10多年了，旨在提
【Selenium】使用selenium進行自動化測試（中）
1.元素定位與操作 查詢元素方法： driver.findElement(By arg0); 其中寫用來定位的API，常見用來定位的API有六種，接下來一一介紹： 1.1 By.id 根據id來獲取元素，返回單個元素，因為id值一般是唯一的。 //獲得id
【朝花夕拾】Android效能優化篇之（四）Apk打包
APK，即Android Package，是將android程式和資源整合在一起，形成的一個.apk檔案。相信所有的Android程式設計師是在IDE的幫助下，完成打包輕而易舉，但對打包流程真正清楚的可能並不多。本章的內容比較簡單，也是非常基礎的內容，但是對理解android應用的結構卻有很大
【朝花夕拾】Android效能優化篇之（一）序言及JVM篇
序言 筆者從事Anroid開發有些年頭了，深知掌握Anroid效能優化方面的知識的必要性，這是一個程式設計師必須修煉的內功。在面試中，它是面試官的摯愛，在工作中，它是程式碼質量的攔路虎，其重要性可見一斑。在團隊中，效能優化的工作又往往由經驗豐富的老師傅來完成，可見要做好效能優化，絕不是一件容易的事情。
【朝花夕拾】Android效能優化篇之（五）Android虛擬機器簡介
前言 Android虛擬機器的使用，使得android應用和Linux核心分離，這樣做使得android系統更穩定可靠，比如程式中即使包含惡意程式碼，也不會直接影響系統檔案；也提高了跨平臺相容性。在Android4.4以前的系統中，Android系統均採用Dalvik作為執行andorid程式的
【朝花夕拾】Android效能優化篇之（五）Android虛擬機器
前言 Android虛擬機器的使用，使得android應用和Linux核心分離，這樣做使得android系統更穩定可靠，比如程式中即使包含惡意程式碼，也不會直接影響系統檔案；也提高了跨平臺相容性。在Android4.4以前的系統中，Android系統均採用Da
【安卓本卓】Android系統原始碼篇之（一）原始碼獲取、原始碼目錄結構及原始碼閱讀工具簡介
前言 古人常說，“熟讀唐詩三百首，不會作詩也會吟”，說明了大量閱讀詩歌名篇對學習作詩有非常大的幫助。做開發也一樣，Android原始碼是全世界最優秀的Android工程師編寫的程式碼，也是Android開發中絕對的權威所在。Android系統開源，且佔據了當今手機系統世界的絕大部分江山，各大手機廠商要做手機系
阿里雲伺服器活動【2核8G5M頻寬】3年只要2070元 （活動）
2070的價格是針對新使用者的政策。 可以用同事朋友老婆的身份資訊購買 切記 身份證資訊（可以用支付寶實名認證，但支付寶的資訊也必未購買過阿里雲的產品）、手機號、郵箱地址必須未註冊過阿里雲 切記 身份證資訊（可以用支付寶實名認證，但支付寶的資訊也必未購買過阿里
HTTP協議 (三) 壓縮 之前寫過一個篇 【HTTP協議詳解】 ，這次繼續介紹HTTP協議中的壓縮。 本文會使用Fiddler來檢視HTTP request和Response, 如果不熟悉這個工
之前寫過一個篇 【HTTP協議詳解】 ，這次繼續介紹HTTP協議中的壓縮。 本文會使用Fiddler來檢視HTTP request和Response, 如果不熟悉這個工具，可以先參考[Fiddler教程] HTTP壓縮是指: Web伺服器和瀏覽器之間壓縮傳輸的”文字內容“的方法。 HTTP採用通用的壓縮演算
【機器學習實戰系列】讀書筆記之KNN演算法（三）
本次讀書筆記在於延續上一篇部落格的工程，做出微小的改動，即使用Matplotlib建立散點圖（散點圖使用DataMat矩陣的第一、第二列資料）。首先還是介紹一個相關知識點，方便程式碼瀏覽。知識點一：1、在使用Matplotlib生成圖表時，預設不支援漢字，所有漢字都會顯示成框
【朝花夕拾】Android多執行緒之（三）runOnUiThread篇——程式猿們的貼心小棉襖
runOnUiThread()的使用以及原理實在是太簡單了，簡單到筆者開始都懶得單獨開一篇文章來寫它。當然這裡說的簡單，是針對對Handler比較熟悉的童鞋而言的。不過麻雀雖小，五臟俱全，runOnUiThread()好歹也算得上是一方諸侯，在子執行緒切換
【百度】大型網站的HTTPS實踐（一）——HTTPS協議和原理
大型網站的HTTPS實踐（一）——HTTPS協議和原理 原創 網路通訊/物聯網 作者：AIOps智慧運維 時間：2018-11-09 15:07:39 349 0 前言
【百度】大型網站的HTTPS實踐（二）——HTTPS加密演算法介紹
大型網站的HTTPS實踐（二）——HTTPS加密演算法介紹 原創 網路通訊/物聯網 作者：AIOps智慧運維 時間：2018-11-09 15:09:43 358 0 前言
【百度】大型網站的HTTPS實踐（三）——HTTPS對效能的影響
HTTPS在保護使用者隱私，防止流量劫持方面發揮著非常關鍵的作用，但與此同時，HTTPS也會降低使用者訪問速度，增加網站伺服器的計算資源消耗。本文主要介紹HTTPS對效能的影響。 HTTPS對訪問速度的影響 在介紹速度優化策略之前，先來看下HTTPS對速度有什麼影響。影響主要來自兩方面：協議互動所增加的網
例項-0基礎微信小程式開發入門1.2-【第一個小程式】
【開啟征程】開啟微信web開發者工具，點選小程式專案：點選右下角的“+”號，將建立快速模板前面的勾去掉然後選擇體驗小程式，目錄隨意，點選確定，即可建立一個全空的小程式專案啦。【建立最基本的目錄結構和檔案】在開始建立之前，我們有必要了解一下最基本的東西：JSON 是一種資料格
百度地圖JavaScript API 學習之自定義標註圖示（二）
地圖繪製之新增自定義標註圖示（二） 官方提供了兩種方法來自定義標註圖示： 通過引數MarkerOptions的icon屬性進行設定 使用Marker.setIcon()方法。 第二
【Python】無須numpy，利用map函數與zip(*)函數對數組轉置（轉）
http details 介紹 二維數組 nbsp 圖片 因此 art comm http://blog.csdn.net/yongh701/article/details/50283689 在Python的numpy中，對類似array=[[1,2,3],[4,5,6],