マーカーのリーフレットポップアップの中央のテキスト

現在、リーフレットを使用して地図を作成していますが、ポップアップでテキストを中央に配置することが可能かどうか疑問に思っていましたか？マーカーのリーフレットポップアップの中央のテキスト

Here is an example of what a marker currently looks like, as you can see, the writing below starts from the left and I was hoping there's a way to centre the second line.

これは、私は現在、それのためにそれを使用していますコードです：

map <- leaflet(nodes) %>% addTiles() %>% setView(-0.219067099999961, 51.5122826, zoom=15) %>% addAwesomeMarkers(~lng, ~lat, icon=icons, popup = paste(nodes$group, "<br>", nodes$label))

出典

2017-03-06 MLMM

はCSSクラスを作成した場合は、テキスト

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>Demo</title> 
 
    <style> 
 
    #map { 
 
     height: 600px; 
 
     border: 1px solid #ccc; 
 
    } 
 

 
\t .myCss{ 
 
\t text-align:center; 
 
\t } 
 
\t </style> 
 
\t <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" /> 
 
\t <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/MarkerCluster.css" /> 
 
\t <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/MarkerCluster.Default.css" /> 
 
\t <link href='https://api.mapbox.com/mapbox.js/plugins/leaflet-fullscreen/v1.0.1/leaflet.fullscreen.css' rel='stylesheet' /> 
 

 

 
</head> 
 

 
<body> 
 
<div id="map"></div> 
 

 
<script src="https://unpkg.com/[email protected]/dist/leaflet.js"></script> 
 
<script src="https://unpkg.com/[email protected]/dist/leaflet.markercluster-src.js"></script> 
 
<script src='https://api.mapbox.com/mapbox.js/plugins/leaflet-fullscreen/v1.0.1/Leaflet.fullscreen.min.js'></script> 
 
<script> 
 
    var addressPoints = [ 
 
     [-31.953512, 115.857048, "<p class='myCss'><b>Morgan Stanley<br> Funder</b><p>"], 
 
     [-37.8210819833, 175.2213903167, "<p class='myCss'><b>Morgan Stanley<br> Funder</b><p>"], 
 
     [-34.206841, 142.136490, "<p class='myCss'><b>Morgan Stanley<br> Funder</b><p>"], 
 
     [-37.8211946833, 175.2213655333, "<p class='myCss'><b>Morgan Stanley<br> Funder</b><p>"] 
 
    ]; 
 
</script> 
 
<script type="text/javascript"> 
 
    var tiles = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {}); 
 
     latlng = L.latLng(-25.2744, 133.7751); 
 

 
    var map = L.map('map', {center: latlng, 
 
     zoom: 4, 
 
     layers: [tiles], 
 
     fullscreenControl: { 
 
      pseudoFullscreen: false 
 
     } 
 
    }); 
 

 
    var markers = L.markerClusterGroup(); 
 

 
    for (var i = 0; i < addressPoints.length; i++) { 
 
     var a = addressPoints[i]; 
 
     var title = a[2]; 
 
     var marker = L.marker(new L.LatLng(a[0], a[1]), { title: title }); 
 
     marker.bindPopup(title); 
 
     markers.addLayer(marker); 
 
    } 
 
    map.addLayer(markers); 
 

 
</script> 
 

 
</body> 
 
</html>

出典

2017-06-15 09:00:11

をポップアップするために適用されます働いて、[回答を受け入れたものとしてマークしてください。]（http://meta.stackexchange.com/questions/5234/how-does-accepting-an-answer-work）ありがとう！ –

マーカーのリーフレットポップアップの中央のテキスト

答えて

関連する問題