腾讯地图Javascript API GL
1. 介紹
騰訊位置服務(wù)在多平臺(tái)為開發(fā)者提供了豐富的地圖展現(xiàn)形式，幫助從屬于不同領(lǐng)域的開發(fā)人員輕松完成構(gòu)建地圖并在其基礎(chǔ)上打造專屬內(nèi)容的工作。同時(shí)配合海量數(shù)據(jù)、個(gè)性化定制、可視化等能力滿足各個(gè)行業(yè)場景下對地圖的需求。
Javascript API GL是基于WebGL技術(shù)打造的3D版地圖API，3D化的視野更為自由，交互更加流暢。
提供豐富的功能接口，包括點(diǎn)、線、面繪制，自定義圖層、個(gè)性化樣式及繪圖、測距工具等，使開發(fā)者更加容易的實(shí)現(xiàn)產(chǎn)品構(gòu)思。
充分發(fā)揮GPU的并行計(jì)算能力，同時(shí)結(jié)合WebWorker多線程技術(shù)，大幅度提升了大數(shù)據(jù)量的渲染性能。最高支持百萬級點(diǎn)、線、面繪制，同時(shí)可以保持高幀率運(yùn)行。
2. 從Hello World開始
首先注冊騰訊位置服務(wù)平臺(tái)賬號，完成個(gè)人認(rèn)證后，新建應(yīng)用申請應(yīng)用Key，
里邊默認(rèn)啟用產(chǎn)品足夠我們使用了，如果需要額外的服務(wù)勾選即可
進(jìn)入JavaScript API，查看開發(fā)指南
選擇基礎(chǔ)入門
將官方提供的Hello World示例復(fù)制到我們的代碼中，注意將應(yīng)用Key替換成自己申請的Key
<!DOCTYPE html> <html> <head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>Hello world!</title><style type="text/css">#container{/*地圖(容器)顯示大小*/width:1200px;height:400px;}</style><!--引入Javascript API GL，參數(shù)說明參見下文--><script src="https://map.qq.com/api/gljs?v=1.exp&key=******替換成你申請的Key******"></script><script>//地圖初始化函數(shù)，本例取名為init，開發(fā)者可根據(jù)實(shí)際情況定義function initMap() {//定義地圖中心點(diǎn)坐標(biāo)var center = new TMap.LatLng(39.984120, 116.307484)//定義map變量，調(diào)用 TMap.Map() 構(gòu)造函數(shù)創(chuàng)建地圖var map = new TMap.Map(document.getElementById('container'), {center: center,//設(shè)置地圖中心點(diǎn)坐標(biāo)zoom: 17.2, //設(shè)置地圖縮放級別pitch: 43.5, //設(shè)置俯仰角rotation: 45 //設(shè)置地圖旋轉(zhuǎn)角度});}</script> </head> <!-- 頁面載入后，調(diào)用init函數(shù) --> <body onload="initMap()"><!-- 定義地圖顯示容器 --><div id="container"></div> </body> </html>以本地服務(wù)的方式去啟動(dòng)，不要以磁盤路徑去訪問
3. 個(gè)性化地圖
地圖平臺(tái)大多默認(rèn)采用經(jīng)典白色風(fēng)格，有時(shí)我們需要地圖樣式和企業(yè)系統(tǒng)風(fēng)格保持一致，或者做一些個(gè)性化的展示。在這方面騰訊地圖為開發(fā)者提供了可擴(kuò)展的地圖風(fēng)格，包括一些官方樣式模板，如果不滿足我們的需求，還可以進(jìn)行自定義樣式。
選擇(? ω ?)的樣式，點(diǎn)擊直接使用，將樣式和使用的應(yīng)用Key進(jìn)行綁定
在代碼中設(shè)置使用樣式
//定義map變量，調(diào)用 TMap.Map() 構(gòu)造函數(shù)創(chuàng)建地圖var map = new TMap.Map(document.getElementById('container'), {center: center,//設(shè)置地圖中心點(diǎn)坐標(biāo)zoom: 17.2, //設(shè)置地圖縮放級別pitch: 43.5, //設(shè)置俯仰角rotation: 45, //設(shè)置地圖旋轉(zhuǎn)角度mapStyleId: 'style1' //設(shè)置樣式ID style1、style2...});官方提供的樣式（其中一個(gè)）運(yùn)行結(jié)果如下：
4. 自定義樣式
首先在開發(fā)者平臺(tái)創(chuàng)建自己的自定義樣式，將自定義樣式和應(yīng)用Key關(guān)聯(lián)后使用自定義樣式
在應(yīng)用中綁定自己設(shè)置的自定義樣式
在代碼中更改mapStyleId為對于的自定義樣式id
運(yùn)行結(jié)果：
總結(jié)
以上是生活随笔為你收集整理的腾讯地图Javascript API GL的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： php开发的教学管理系统,php教学管理
- 下一篇： 快吧我的世界服务器一直未响应,为什么快吧