geodjangoでポリゴンデータを表示したい
前提
モデルにポリゴンデータを格納済みで、views.pyで如何にして表示させるかを焦点とする。
https://github.com/makinacorpus/django-leaflet/issues/211
参考先
https://www.youtube.com/watch?v=ieJ0J-iFJuY
マップに描画するまでのイメージ:
templateを呼び出すためのviewを用意することに加え、polygonデータを呼び出すためのviewの2つを用意する。前者を使ってleafletのマップをテンプレートに表示させる。テンプレート内にjavascriptのコードを記述する。ロジックはpolygonデータの変数を作成する。jQueryのgetJSONを使い、読み込んだpolygonデータをmapに加える。
<!DOCTYPE html>
<html>
<head>
{% load leaflet_tags %}
{% leaflet_css %}
{% leaflet_js %}
<style type="text/css">
.leaflet-container {height : 80%;}
</style>
<script
src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
</head>
<body>
<h1>list</h1>
<div style="height :1200px;">
{% leaflet_map "main" callback="map_init_basic" %}
</div>
<script type="text/javascript">
function map_init_basic(map, options){
var polygons = "{% url 'prefecturas:data' %}";
console.log(polygons);
$.getJSON(polygons, function(data){
//console.log(data);
L.geoJson(data).addTo(map);
})
}
</script>
</body>
</html>