Mapbox-gl-directions 事件不会触发
Mapbox-gl-directions events does not fire
我正在尝试计算 mapbox-gl-directions. I want to use the .on('route')
event but it never fires. I tryed to rebuild the example shown in the docs 中两个标记之间的简单路线,但没有成功。我做了以下事情:
var map = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/mapbox/streets-v8'
});
var directions = new mapboxgl.Directions({
unit: 'metric', // Use the metric system to display distances.
profile: 'driving', // Set the initial profile to walking.
container: 'directions' // Specify an element thats not the map container.
});
map.on('load', function() {
directions.setOrigin([77.5045504332, 13.0386169339]); // On load, set the origin to "Toronto, Ontario".
directions.setDestination([77.5075504332, 13.0386169339]); // On load, set the destination to "Montreal, Quebec".
});
directions.on('route', function(e) {
alert("FIRE!")
});
为什么这个事件没有被触发?
这里也有一个JS FIDDLE。
通过更新外部资源链接以使用最新版本的 Mapbox GL 和 Mapbox GL Directions 库,我能够在您提供的 JS Fiddle 中获取您的代码 运行。这意味着 Mapbox GL JS 的 v0.12.0
更改为 v0.26.0
并且 Directions 插件的 v1.0.0
更改为 v2.2.0
.
<script src='https://api.tiles.mapbox.com/mapbox-gl-js/v0.26.0/mapbox-gl.js'></script>
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.26.0/mapbox-gl.css' rel='stylesheet' />
<script src='https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-directions/v2.2.0/mapbox-gl-directions.js'></script>
<link rel='stylesheet' href='https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-directions/v2.2.0/mapbox-gl-directions.css' type='text/css' />
它看起来像您在 docs has not been updated since it was published in December 2015; here's a link 中找到的示例到更新的方向示例,并且使用了两个库的正确版本。最后,我可能会删除指向 Mapbox.js 的外部链接,因为在使用 Mapbox GL JS 时它们不是必需的。祝你好运!
我正在尝试计算 mapbox-gl-directions. I want to use the .on('route')
event but it never fires. I tryed to rebuild the example shown in the docs 中两个标记之间的简单路线,但没有成功。我做了以下事情:
var map = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/mapbox/streets-v8'
});
var directions = new mapboxgl.Directions({
unit: 'metric', // Use the metric system to display distances.
profile: 'driving', // Set the initial profile to walking.
container: 'directions' // Specify an element thats not the map container.
});
map.on('load', function() {
directions.setOrigin([77.5045504332, 13.0386169339]); // On load, set the origin to "Toronto, Ontario".
directions.setDestination([77.5075504332, 13.0386169339]); // On load, set the destination to "Montreal, Quebec".
});
directions.on('route', function(e) {
alert("FIRE!")
});
为什么这个事件没有被触发? 这里也有一个JS FIDDLE。
通过更新外部资源链接以使用最新版本的 Mapbox GL 和 Mapbox GL Directions 库,我能够在您提供的 JS Fiddle 中获取您的代码 运行。这意味着 Mapbox GL JS 的 v0.12.0
更改为 v0.26.0
并且 Directions 插件的 v1.0.0
更改为 v2.2.0
.
<script src='https://api.tiles.mapbox.com/mapbox-gl-js/v0.26.0/mapbox-gl.js'></script>
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.26.0/mapbox-gl.css' rel='stylesheet' />
<script src='https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-directions/v2.2.0/mapbox-gl-directions.js'></script>
<link rel='stylesheet' href='https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-directions/v2.2.0/mapbox-gl-directions.css' type='text/css' />
它看起来像您在 docs has not been updated since it was published in December 2015; here's a link 中找到的示例到更新的方向示例,并且使用了两个库的正确版本。最后,我可能会删除指向 Mapbox.js 的外部链接,因为在使用 Mapbox GL JS 时它们不是必需的。祝你好运!