リーフレットとJavascriptを初めて使用していて、参考にして地図を作成しようとしています。リーフレットを使用するときにデフォルトの青の代わりにすばらしいアイコンを適用しようとしています。私はすべての種類の変形を試してみました。私のために働いていないようです。フォントリーフレットのgeoJsonファイルを含むすばらしいアイコン
すべてのアイコンが地図の青色のデフォルト色で表示されるので、ここで少し失われています。 また、次のステップでは、GeoJSONファイルのプロパティを使用してGeoJSONファイルの値に基づいてアイコンスタイルを変更する方法を探しています。たとえば、"koncept = "Large"
は素晴らしいアイコンを使用します。koncept = "Small"
はすばらしいアイコンです。など
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Leaflet test</title>
<link rel="stylesheet" type="text/css" href="css/leaflet.css">
<link rel="stylesheet" type="text/css" href="css/mapstyle.css">
<link rel="stylesheet" type="text/css" href="css/leaflet.awesome-markers.css">
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="js/leaflet.js"></script>
<script type="text/javascript" src="js/leaflet.ajax.min.js"></script>
<script type="text/javascript" src="js/leaflet.awesome-markers.min.js"></script>
<script src="js/spin.js"></script>
<script src="js/leaflet.spin.min.js"></script>
<script src="https://use.fontawesome.com/xxxxxxxxxx.js"></script>
<script type="text/javascript" src="dip.geojson"></script>
<body>
<div id="mapid"></div>
<script type="text/javascript">
var map = L.map('mapid').setView([59.5, 14.5], 7);
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors',
}).addTo(map);
//test if awesome icon works... and it works...
L.marker([59.5,14.621303], {icon: L.AwesomeMarkers.icon({icon: 'coffee', prefix: 'fa', markerColor: 'red', iconColor: '#ffffff'}) }).addTo(map);
//This part below does not work with awesome markers, it returns to the default blue markers
var dip = new L.geoJson.ajax(["dip.geojson"], {icon: L.AwesomeMarkers.icon({icon: 'coffee', prefix: 'fa', markerColor: 'red', iconColor: '#ffffff'}) }).addTo(map);
</script>
</head>
</div>
</body>
</html>
このフィドルを見てくださいいくつかの変更が、まだありませんAwesomeMarkers、マップ上の唯一の青デフォルト...
var dip = new L.geoJson.ajax(["dip.geojson"],{icon: L.AwesomeMarkers.icon({icon: 'coffee', prefix: 'fa', markerColor: 'red', iconColor: '#ffffff'})}).addTo(map);
ようこそ!エラーメッセージの出所を完全に理解できるように[MCVE](https://stackoverflow.com/help/mcve)を提供してください。理想的には、ライブコードスニペット、Plunker、JSFiddle、JSBinなどを使用してライブサンプルを提供してください。 – ghybs