leaflet入門3|地図に円を描画する

leaflet(1.3)を使ってマップに図形(円)を描画します。

Demoはこちらです。

全体のコード

解説

地図を描画するまでの解説は、leaflet入門1に記載しています。

step1(L.circle)

円を描画するには、L.circle を使用します。

基本的には、以下のように円の中心座標と、radiusで半径(m)を指定します。

step2(線、塗りつぶしの色を指定)

多角形と同様に、描画する線や図形内を塗りつぶす色を指定することができます。

指定の仕方は、以下のプロパティを設定します。

color:描画する線の色を指定します。

fillColor:塗りつぶしの色を指定します。

fillOpacity:塗りつぶしの不透明度を指定します。(0になるほど透明になります)

L.circleを使うと、簡単に円を描画することができます。

次回は地図にマーカーを表示したいと思います。

スポンサーリンク

シェアする

  • このエントリーをはてなブックマークに追加

フォローする