mapbox学习

红太狼 2022-12-29 09:37 226阅读 0赞

# 学习入门 #

地图 入门小知识

--------------------

\#地图的初始化详解：

下面展示一些 `初始化小方法`。

// An highlighted block

var map = new mapboxgl.Map({ 
    	  container: 'map', // Mapbox GL JS 进行地图渲染的 HTML 元素，或该元素的字符串 id 。该指定元素不能有子元素。
    	  center: [-122.420679, 37.772537], 
    	  minZoom: 0-24, // 地图最小缩放级别（0-24）。
    	  maxZoom: 0-24, // 地图最大缩放级别（0-24）。 
    	  zoom: 13,
    	  style: mapbox://styles/mapbox/streets-v10, // 地图的 Mapbox 配置样式。它必须是一个符合 Mapbox 样式规范 的 JSON 对象，或者是一个指向该 JSON 的 URL 地址。
    	  hash: true, // 如果为 true ，地图的位置 (包括缩放层级、中心纬度、中心经度、方位角和倾角) 将会与页面URL的哈希片段同步。例如， http://path/to/my/page.html#2.59/39.26/53.07/-24.1/60 。
    	  interactive:false, // 如果为 false ，地图将不会绑定对鼠标、触碰、键盘的监听，因此地图将不会响应任何用户交互。
    	  bearingSnap:7, // 定义何时地图的方位将自动对齐到正北方向的阈值（以度为单位）。例如，当 bearingSnap 为 7 时，如果用户将地图转动到正北方向 7 度以内的范围时，地图将自动恢复对齐到正北方向。
    	  pitchWithRotate: false, // 如果为 false ，将不会在"拖拽进行地图旋转"的同时控制地图的倾斜。
    	  transformRequest: (url, resourceType)=> { 
    	    if(resourceType === 'Source' && url.startsWith('http://myHost')) { 
    	      return { 
    	       url: url.replace('http', 'https'),
    	       headers: {  'my-custom-header': true},
    	       credentials: 'include'  // Include cookies for cross-origin requests
    	     }
    	    }
    	  }
    	});

转载于mapbox

--------------------

https://www.mapbox.cn/mapbox-gl-js/api/\#map\#querysourcefeatures