忘记一切,直到这里,我花了黎明时间尝试,看看我是否可以继续前进,我会解释。我有一张地图,我需要列举 1 到 15 个标记。标记是正确的,标记只有1、15次的问题。这是我的json:
https://github.com/eltonsantos/analise_integrada/blob/master/path.js
简单的json,没什么
我的代码是:
var rotas = L.geoJSON(paradas, {
onEachFeature: onEachFeature,
pointToLayer: function(feature, latlng){
console.log("Qtd: " + paradas.features.length)
for(var i = 1; i <= paradas.features.length; i++){
return L.marker(latlng, {
icon: new L.AwesomeNumberMarkers({
number: i,
markerColor: 'purple'
})
})
}
}
}).addTo(map);
Run Code Online (Sandbox Code Playgroud)
这段代码没有显示任何错误信息,它只是显示我所有的点都用 1 编号。我只是希望它们根据 json 中的数量从 1 到 15 编号
基于这里的这个例子,我想通过简单地点击感兴趣的区域来动态地将地图与 Highchart 链接起来。但是 shape_click 函数返回 $id NULL。我用不同的 shapefile 尝试了它,但它不起作用。您将在调整后的示例代码下方看到(此处提供的数据可用于从 shape_click 函数中获取 $id。
library(shiny)
library(dplyr)
library(leaflet)
library(sf)
library(rmapshaper)
ui <- fluidPage(
titlePanel("heatmap"),
# Sidebar with a slider input for year of interest
sidebarLayout(
sidebarPanel(
sliderInput("year",h3("Select year or push play button"),
min = 2000, max = 2002, step = 1, value = 2000,
animate = TRUE)
),
# Output of the map
mainPanel(
leafletOutput("unemployment"),
verbatimTextOutput('summary')
)
)
)
server <- function(input, output) {
#to get the spacial data: …Run Code Online (Sandbox Code Playgroud) 我正在使用 R 和 Leaflet for R 来绘制 1000 个点。原始数据从 SQL Server 作为英国国家网格 (BNG) 坐标(横轴墨卡托)导入到数据框中,然后使用 rgdal 将其转换为纬度/经度,然后通过 Leaflet 小部件输出到独立的 html。
BNG 坐标是通过地理编码邮政编码生成的,因此,当 >1 个人具有相同的邮政编码时,坐标是相同的。
我想在每个东/北坐标的最后 2 位数字中添加一些随机噪声,以便所有点都可能在 Leaflet 中可见。实现这一目标的最简单方法是什么?
谢谢
麦克风
我想知道我可以使用 Ionic 通过传单实时跟踪我的位置,我能够获得我当前的位置,但我也想在我移动时跟踪它
this.map.locate({
setView: true,
maxZoom: 16
}).on('locationfound', (e) => {
let markerGroup = leaflet.featureGroup();
this.marker = leaflet.marker([e.latitude, e.longitude], { icon: carIcon }).addTo(this.map);
Run Code Online (Sandbox Code Playgroud) 我有传单地图。我使用圆圈作为标记,因为我内置了一些缩放功能,并且我希望圆圈的半径在缩放过程中设置动画。不过,我也希望圆圈在被点击时“跳动”。我在网上看到了很多关于脉冲传单标记的文档,但没有关于脉冲圈的文档。这里有一个简单的解决方案吗?
查询:
var map = L.map('map').setView([40.449620, -79.939990], 13);
L.tileLayer('https://stamen-tiles-{s}.a.ssl.fastly.net/terrain/{z}/{x}/{y}{r}.{ext}', {
maxZoom: 19,
ext: 'png',
attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, <a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a> — Map data © <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'//,
}).addTo(map);
map.on('click', function(e) {
var currentZoom = map.getZoom();
if (currentZoom == 13) {
map.flyTo(e.latlng, 15, { //zoom in on click
animate: true,
duration: 1,
easeLinearity: 1
});
}
});
$.post('php/get-buildings.php', function(output){
var obj = jQuery.parseJSON( output );
var color;
customCircle = L.Circle.extend({
options: {
//some more options here
} …Run Code Online (Sandbox Code Playgroud) 我已经使用 react-leaflet 创建了折线,我想使用 polylinedacorator 在折线上显示方向。但我不知道如何使用 react-leaflet 做到这一点。我找到了多个带有传单的示例,但没有使用 react-leaflet
const polyline = [[51.505, -0.09], [51.51, -0.1], [51.51, -0.12]]
export default class VectorLayersExample extends Component<{}> {
render() {
return (
<Map center={center} zoom={13}>
<TileLayer
attribution='&copy <a
href="http://osm.org/copyright">OpenStreetMap</a>
contributors'
url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
/>
<Polyline color="lime" positions={polyline} />
</Map>
)
}
Run Code Online (Sandbox Code Playgroud)
任何人都可以告诉我如何使用带有上述代码的 polylinedacorators
我在角度项目中使用传单地图。
使用传单显示带有标记的地图。
这在 ng server 和 ng build 中正常工作。
但是当在构建中使用 --prod 时不显示标记图标。
标记图像路径错误。
http://127.0.0.1:8080/marker-icon.2273e3d8ad9264b7daa5.png%22)marker-icon-2x.png
Run Code Online (Sandbox Code Playgroud)
如何解决这个问题?
1.我用Leaflet画了一张GeoJSON地图。
2.使用D3在svg中创建节点
3.给节点绑定鼠标悬停事件,但是不生效
Leaflet 版本:1.5.1 D3.js v5 浏览器(附版本):Chrome 75.0.3770.80 操作系统/平台(附版本):Windows 10
<div id="mapDiv"></div>
<script>
var style = {
color: "#586a77",
opacity: 1,
weight: 1.5,
fillColor: "#323c48",
fillOpacity: .8
}
var mymap = L.map("mapDiv", {
center: [33.027088, 109.467773],
zoom: 4,
zoomControl: false,
attributionControl: false,
minZoom: 1,
maxZoom: 18
})
// ?d3????geojson??
d3.json("data/geojson/world.json")
.then((data) => {
L.geoJSON(data, {
style: style
}).addTo(mymap);
var svg = d3.select("#mapDiv").select("svg");
var d_plane =
"M59.79,12.92C62.42,9.4,64,5.75,64,3.15a3.62,3.62,0,0,0-.49-2,1.6,1.6,0,0,0-.29-.37,1.68,1.68,0,0,0-.34-.27,3.56,3.56,0,0,0-2-.51c-2.6,0-6.25,1.58-9.77,4.21-2.84,2.13-5.69,5.12-9.62,9.27L39.34,15.7l-7.62-2.28,0,0a1.71,1.71,0,0,0,0-2.41L30.36,9.61a1.71,1.71,0,0,0-1.21-.5,1.68,1.68,0,0,0-1.21.5l-2.06,2.06-1.09-.33a1.71,1.71,0,0,0-.14-2.25L23.27,7.7a1.71,1.71,0,0,0-1.21-.5,1.67,1.67,0,0,0-1.2.5L19,9.59,11.21,7.27a1.94,1.94,0,0,0-.55-.08,2.05,2.05,0,0,0-1.43.58L6.5,10.5A1.61,1.61,0,0,0,6,11.62,1.56,1.56,0,0,0,6.85,13l16.3,9.11a2.84,2.84,0,0,1,.4.3l4.65,4.65C23.85,31.66,20,36.09,17,40L16.15,41,3.54,39.86H3.32a2.33,2.33,0,0,0-1.56.65L.49,41.76A1.58,1.58,0,0,0,0,42.89a1.55,1.55,0,0,0,.92,1.43l8.87,4.21a2.07,2.07,0,0,1,.34.24l.74.73a5.38,5.38,0,0,0-.35,1.71,2.24,2.24,0,0,0,.62,1.63l0,0h0a2.25,2.25,0,0,0,1.63.61,5.43,5.43,0,0,0,1.69-.35l.75.75a2,2,0,0,1,.23.33l4.2,8.85a1.57,1.57,0,0,0,1.41.93h0a1.58,1.58,0,0,0,1.12-.47l1.3-1.31a2.32,2.32,0,0,0,.62-1.56c0-.07,0-.13,0-.16L23,47.85,24,47c3.86-3,8.3-6.9,12.87-11.24l4.65,4.66a2.49,2.49,0,0,1,.3.4L51,57.13a1.58,1.58,0,0,0,2.54.37l2.74-2.74a2.08,2.08,0,0,0,.56-1.43,2,2,0,0,0-.07-.54L54.41,45l1.89-1.89a1.71,1.71,0,0,0,0-2.41l-1.39-1.38a1.71,1.71,0,0,0-2.25-.14l-.32-1.09,2.06-2.06a1.72,1.72,0,0,0,.5-1.21,1.69,1.69,0,0,0-.5-1.2L53,32.27a1.71,1.71,0,0,0-2.42,0h0L48.3,24.65l2.25-2.14C54.68,18.59,57.67,15.76,59.79,12.92Z"
var plane = svg.append("g").attr("id", "plane").attr("fill", "#108ee9").attr("stroke-width", 1).attr('height',
10).attr('width', 10)
plane.append("path").attr("d", d_plane)
function …Run Code Online (Sandbox Code Playgroud) 我正在使用 react-leaflet 并想在地图上添加一个图例。
我目前可以通过将地图的 ref 传递给自定义组件并渲染 null 来实现,同时让函数创建 HTML 并将其添加到地图中。使用 Jest 和 Enzyme 测试裁判是一场噩梦。
有没有办法使用 react-leaflet 组件来实现这一点?
所以,我有一张传单地图......
var map = L.map('map').setView([35.772219, -78.675272], 17);
map.on('click', function(e) {alert('map click!')});
Run Code Online (Sandbox Code Playgroud)
我添加了一个标记...
var marker = L.circleMarker([35.772219, -78.675272]);
marker.on('click', function(e) {alert('marker click!')});
marker.addTo(map);
Run Code Online (Sandbox Code Playgroud)
如果我点击标记,标记和地图点击事件都会触发,但我只想要标记的点击事件......有什么办法可以做到这一点?我似乎无法在文档中找到一个。