てがろぐ - Fumy Otegaru Memo Logger -

お手軽一言掲示板（この辺の文章は「管理画面」の「設定」内にある「フリースペース」タブから編集できます。）

動作サンプルです。 ご自由にお試し下さい。パスワードguestで管理画面もお試し頂けます。
■いま見ているスキンは「シンプル日記スキン」です。他に、 標準スキン、 昔のツイッターっぽいスキン(ブルー)、 昔のツイッターっぽいスキン(ピンク)、 付箋型スキン、 ジャーナル(日誌)スキン、 ブログタイプスキン(タイトル付きブログっぽくできるスキン)、 黒板スキン、 チャットタイプスキンがあります。
《てがろぐCGIの配布・解説ページに戻る》
:シンプル日記スキン: スキンは弄り放題なので、掲載したくない要素はたいてい省けます。このスキンでは投稿者名を一切表示しません。

or 管理画面へ

No.3976

➡ 2023年9月2日(土) 09時54分 〔1年以上前〕 質問/要望 No.3976 ✎ ！

マッパー＠あどみと申します。
最近てがろぐを設置し、データベースなしでこんなに高機能なんて！と感心しつつ、カスタマイズにはげんでいるところです。
早速ですが、#地図 の埋め込み機能のリクエストです。

🗾 OpenStreetMapの埋め込みについて
私は、OpenStreetMapという、誰でも編集できて利用の制約がゆるいオンライン地図のマッピングで活動しています。
OpenStreetMapのサイト自体に共有リンクを出力する機能があるので、これを使っててがろぐの投稿に地図表示を埋め込めるといいなと思います。
（以下、技術的な説明が長いのでたたみます）

共有メニューから「リンク」をクリックすると
https://
www.openstreetmap.org/?
mlat=43.3853&mlon=145.8171#
map=16/43.3853/145.8171
「HTML」をクリックすると
<iframe
 width="425" height="350" src="https://
www.openstreetmap.org/export/embed.html?
bbox=145.8067059516907%2C43.37855547332784%2C145.8275628089905%2C43.392075799933046&
layer=mapnik&
marker=43.38531601356901%2C145.81713438034058"
 style="border: 1px solid black">
</iframe>
<br/>
<small>
<a href="https://
www.openstreetmap.org/?mlat=43.3853&mlon=145.8171#map=16/43.3853/145.8171">大きな地図を表示
</a>
</small>
というURLが出力されます。
（こちらはURL貼り付け禁止とのことですが、説明に必要なため、引用として貼らせていただきました。元のURLに改行はありませんが、意図的にあちこちに改行を入れてリンク表示にされないようにしています。表示される場所はいずれも北海道の納沙布岬です）

「リンク」の方のURLは、mlat=xx&mlon=xx が地図上のマーカーの座標（緯度経度）です。
#map=16 の16などの数値はズームレベル（表示縮尺）その後ろの数値は地図の中心の座標です。
マーカー付きで当該場所の地図を表示したOpenStreetMapのサイトが開きます。
OpenStreetMap側のチェックボックスで、マーカーを含めないリンクにもできます。

「HTML」の方のURLはiframeタグ付きで出力されていて、てがろぐのソースを見るとYoutube等の埋め込みもirameタグを使用しているので、このURLをてがろぐに合うように加工して投稿に埋め込めないだろうかと思ったところです。
bbox=から&までの間の数値は、前半がフレームの左下角、後半が右上角の座標です。
layer=mapnikというのはOpenStreetMapの標準地図レイヤーを指しています。サイト上で6種類の地図レイヤーが選択できるようになっているので、URLを出力したときに選択しているレイヤー名が表示され、埋め込み地図でも同じ地図レイヤーで表示されます。
marker=以降は前段に書いたマーカー座標です。畳む

世間一般では、Googleマップの埋め込みの需要の方が多いだろうとは思いますが、私がOpenStreetMap界隈で活動しているため、こちらでリクエストさせていただきました。
Googleマップにも「地図を共有または埋め込む」というメニューがあり、iframeタグ付きの埋め込み用URLが出力できるので、OpenStreetMapができるならGoogleマップもできるのかもしれません。

« No.3975 / No.3977 »

初期表示に戻る

■フリースペース：

ここは、CGIの設定画面から自由に文章を入力して掲載できるスペースです。スキンを編集しなくてもCGI上から手軽に内容を変更できます(HTML使用可)。
動作サンプルです。◆他のスキン：標準スキン, 昔のツイッターっぽいスキン(ピンク版), 付箋型スキン, シンプル日記スキン, ジャーナル(日誌)スキン, ブログタイプスキン, チャットタイプスキン, 黒板スキン 《てがろぐCGIの配布ページに戻る》

編集

■ハッシュタグ：

■日付一覧：

■日付検索：

■カレンダー：

2023年9月
日月火水木金土
12
3456789
10111213141516
17181920212223
24252627282930
« 前の月 / 次の月 »

■カテゴリ：

■最近の投稿：

■新着画像リスト：

Perlのバージョンを上げる設定(さくらインターネット)

全317個 （総容量 36.08MB）

■詳細全文検索：

  • 投稿者名：
  • 投稿年月：
  • ＃タグ：
  • カテゴリ：
  • 出力順序：