var bbox = [-70.823364, -33.553984, -70.473175, -33.302986];
var pointGrid = turf.pointGrid(bbox, 3, {units: 'kilometers'});
//-> point grid geojson
var mymap = L.map('mapid').setView([36.3426631, 138.6092733], 13);
L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}', {
attribution: 'Map data ©
OpenStreetMap contributors,
CC-BY-SA, Imagery ©
Mapbox',
maxZoom: 18,
id: 'mapbox.streets',
accessToken: 'Mapboxのアクセストークンを記載'
}).addTo(mymap);
var controler = mymap.pm.addControls({
position: 'topleft',
drawMarker:false,
drawPolyline:false,
drawRectangle:true,
drawPolygon:false,
drawCircle: false,
editMode:false,
dragMode:false,
cutPolygon:false,
removalMode:false,
//図形が生成された時に発火するイベント
mymap.on('pm:create', function(e){
//生成したrectangの座標を取得する
var bbox = e.layer.getBounds().toBBoxString().split(",")
.map(function(d){ return +d });
//ポイントグリッドを作成する
var pointGrid = turf.pointGrid(bbox, 0.5, {units: 'kilometers'});
L.geoJSON(pointGrid).addTo(mymap);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
var
mymap
=
L
.
map
(
'mapid'
)
.
setView
(
[
36.3426631
,
138.6092733
]
,
13
)
;
L
.
tileLayer
(
'https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}'
,
{
attribution
:
'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>'
,
maxZoom
:
18
,
id
:
'mapbox.streets'
,
accessToken
:
'Mapboxのアクセストークンを記載'
}
)
.
addTo
(
mymap
)
;
var
controler
=
mymap
.
pm
.
addControls
(
{
position
:
'topleft'
,
drawMarker
:
false
,
drawPolyline
:
false
,
drawRectangle
:
true
,
drawPolygon
:
false
,
drawCircle
:
false
,
editMode
:
false
,
dragMode
:
false
,
cutPolygon
:
false
,
removalMode
:
false
,
}
)
;
//図形が生成された時に発火するイベント
mymap
.
on
(
'pm:create'
,
function
(
e
)
{
//生成したrectangの座標を取得する
var
bbox
=
e
.
layer
.
getBounds
(
)
.
toBBoxString
(
)
.
split
(
","
)
.
map
(
function
(
d
)
{
return
+
d
}
)
;
//ポイントグリッドを作成する
var
pointGrid
=
turf
.
pointGrid
(
bbox
,
0.5
,
{
units
:
'kilometers'
}
)
;
L
.
geoJSON
(
pointGrid
)
.
addTo
(
mymap
)
;
}
)
;
著者: 清水正行
所在地: 群馬県高崎市
群馬・東京間を行き来する出稼ぎフリーランスエンジニアです。GIS(地理情報システム)・データビジュアライゼーション・オープンデータなどについて書いてます。