- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我已经开始尝试使用 Mapbox,一切如我所愿,只是我无法弄清楚如何禁用集群。这是我的代码:
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<title>Add custom icons with Markers</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<script src='https://api.tiles.mapbox.com/mapbox-gl-js/v1.0.0/mapbox-gl.js'></script>
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v1.0.0/mapbox-gl.css' rel='stylesheet' />
<style>
body { margin:0; padding:0; }
#map { position:absolute; top:0; bottom:0; width:100%; }
</style>
</head>
<body>
<style>
.marker {
/*display: block;*/
border: none;
/*border-radius: 50%;*/
cursor: pointer;
padding: 0;
background-image: url('https://upload.wikimedia.org/wikipedia/commons/thumb/e/ed/Map_pin_icon.svg/176px-Map_pin_icon.svg.png');
background-size: cover;
width: 20px;
height: 27px;
/*border-radius: 50%;*/
/*cursor: pointer;*/
}
</style>
<div id='map'></div>
<script>
mapboxgl.accessToken = 'pk.eyJ1IjoibmFiZWxla3QiLCJhIjoiY2p4ZXVubnQwMGVmcTN6cGU0c3JpZmM2diJ9.peecDCcSljWhChxCknv7AQ';
var coordinates = [
[6.73579, 78.72300],
[2.70886, 11.51694],
[34.05482, -57.09742],
[-39.05019, 89.79126],
[17.44893, 35.57014],
[23.60105, 168.12674],
[-4.87631, 72.99334],
[39.7392, -104.9903],
[39.79905,-105.78118],
[39.80266,-105.78692],
[39.79758,-105.78061],
[39.80314,-105.78978],
[39.80313,-105.78999],
[39.80103,-105.78272],
[39.80096,-105.78259],
[39.80187,-105.78407],
[39.80283,-105.78593],
[39.79937,-105.78134],
[39.80023,-105.78164],
[39.80272,-105.78765],
[39.80263,-105.78673],
[39.80264,-105.78676],
[39.80125,-105.78326],
[39.7976,-105.78028],
[39.80316,-105.7905],
]
var num_coordinates = Object.keys(coordinates).length
var geojson = {
"type": "FeatureCollection",
"features": []
}
for (var coord_ind = 0; coord_ind < num_coordinates; coord_ind++) {
geojson.features.push({
"type": "Feature",
"properties": {
"message": "Bar",
"iconSize": [300, 300]
},
"geometry": {
"type": "Point",
"coordinates": [coordinates[coord_ind][1], coordinates[coord_ind][0]] // Longitude then Latitude
}
})
}
var map = new mapboxgl.Map({
container: 'map', // container id
style: 'mapbox://styles/mapbox/streets-v11', // stylesheet location
// style: 'mapbox://styles/mapbox/satellite-v9', // stylesheet location
center: [-99.66, 38.46], // starting position [lng, lat]
zoom: 5.5 // starting zoom
});
map.on('load', function() {
map.loadImage('https://upload.wikimedia.org/wikipedia/commons/thumb/e/ed/Map_pin_icon.svg/176px-Map_pin_icon.svg.png', function(error, image) {
if (error) throw error;
map.addImage('pin', image);
map.addSource("photo_locations", {
type: "geojson",
data: geojson,
cluster: false,
clusterMaxZoom: 1, // Max zoom to cluster points on
clusterRadius: 1 // Radius of each cluster when clustering points (defaults to 50)
});
map.addLayer({
"id": "points",
"type": "symbol",
"source": "photo_locations",
"layout": {
"icon-image": "pin",
"icon-size": 0.12
}
});
});
});
</script>
</body>
</html>
您可以看到我为我的源设置了 cluster: false
。但是,如果您在浏览器中显示它,这些图钉仍然聚集在一起。如果您放大丹佛西部的大头针,您会看到它分成多个大头针。
如何让集群完全禁用,以便在任何缩放级别都可以看到每个单独的图钉?任何想法表示赞赏。谢谢!
最佳答案
正如 geografa 所建议的,添加 "icon-allow-overlap": true
就可以了。这需要添加到图层的 layout
部分。所以我现在有:
...
"layout": {
"icon-image": "pin",
"icon-size": 0.08,
"icon-allow-overlap": true
}
...
关于Mapbox - 完全禁用聚类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56894865/
在gdb中获取此消息。我知道它不是错误或任何东西。我也做了分页,所以那不是问题。 有什么办法可以抑制此消息? 最佳答案 我很好奇看到这个问题没有得到解决... 我获得了GDB manual,它说(部分
好吧,这很烦人,而且可能很简单。我想用禁用的复选框启动我的网页,并在选择列表框中的特定行后启用这些框。所以我把它放在 onload 方法中 onload = function () { for
看来我需要以某种方式在我的 php 页面上禁用 IPv6,但我不确定该怎么做。我想我必须在我的 INI 文件中的某处添加 --disable-ipv6 ……虽然这看起来不像正确的语法。 我正在尝试解决
我有这两个代码: 第一个是禁用复制粘贴的宏: Sub Desable_Copy() Dim oCtrl As Office.CommandBarControl For Each oCt
在下面的代码中,我想, 如果我选择/单击“患者类型”按钮。它们在菜单“xmenumain”“儿科心电图”项中应该被禁用(它应该列在菜单列表中,但颜色为淡灰色)。我如何实现它? void MyMenu:
我目前在 Coordinator 布局中有一个底部导航栏,我向其添加了 HideBottomViewOnScrollBehaviour。有些屏幕需要隐藏导航栏,我可以通过从 BottomNavigat
我需要一些关于 jquery if 条件的帮助。我已经搜索和测试了几个小时,任何帮助都会很棒!我得到这个 HTML 代码: Value: No Match Test Test 2 Test 3
我正在开发 Delphi -7 中的自定义组件我有一些published特性 private { Private declarations } FFolderzip ,Fi
尝试学习菜单处理的基础知识。我的测试应用程序的菜单栏有 3 个菜单——即“TestApp”、“File”和“Help”。我发现我可以完全删除这些菜单,只需调用 say: NSMenu* rootMen
我以编程方式创建一个 NSMenuItem,但它被禁用。如果我重写 validateMenuItem: 方法并为所有项目返回 YES,则菜单项工作正常。 当我告诉菜单 autoEnableItems
我的 Web 表单中有一个 asp 按钮 (runat="server") 进入更新面板。 当我点击这个按钮时,它会执行一些操作。 Private Sub ButtonDoI
我目前正在为 video.js 构建一个插件,它可以在某些断点处将覆盖层呈现在屏幕上。但是,在不启动视频的情况下,我无法单击任何叠加层。我认为我需要禁用播放器上的点击播放功能。 我应该如何禁用/启用
设置剑道网格 selectable: "row", navigatable: true, 允许选择列标题单元格并通过键盘切换其排序状态。如何完全禁用使用键盘选择列标题单元格的功能? 最
我不想卸载code rush。我只是想在不需要的时候有机会将其关闭。 这可能吗? (快速版本)... 最佳答案 首先您应该打开“DevExpress”菜单。默认情况下,它在 CodeRush Xpre
设置: 我正在使用 TinyMCE 的 Angular 包装器来允许我的用户构建自己的电子邮件模板。这些电子邮件会发送给每个用户组织内的多个人员。我创建了自定义工具栏按钮来插入小文本 block [[
我希望下拉菜单在悬停时打开,前提是窗口大于 767 像素。我试图在页面加载和窗口调整大小时调用一个函数,并使用宽度大小条件。 enableHover() 函数仅适用于页面加载,不适用于窗口调整大小。
由于我遇到了一些问题,我正在 .NET Framework 4 中尝试连接池。使用 SQL Profiler,我可以看到每次从连接池中获取连接时,都会执行存储过程 sp_reset_connectio
我避免在我的 swift 代码中收到警告。然而,当谈到 Storyboard要求时,这对我来说有点困难。 所以现在我只想禁用 xcode 显示有关 Storyboard问题的警告。 我尝试了以下方法但
我不是 JavaScript 专家,我目前正在尝试为表单创建一个函数,该函数根据上一页上选择的数字重复相同的字段。 表单字段可能有 1 到 10 行,每行都有一个单选按钮选择,可启用/禁用每一行。 目
我正在尝试使用 CPU2006 运行各种基准测试,以查看各种优化在 gcc 速度方面的作用。我熟悉 -O1、-O2 和 -O3,但听说 -msse 是一个不错的优化。 -msse 到底是什么?我还看到
我是一名优秀的程序员,十分优秀!