Marked.js with OpenStreetMap

md_with?map_20190517.png

This is program sample for my job.
I needed MarkDown editor with tag of easy map for client. So I searched a useful piece of information on the web and made this sample.
This sample has extend Marked.js. It’s easy to use into the map on your web site by expanding comment tag of html.

Sample of “Marked.js with OpenStreetMap”

May be, The same way would be able to make other functions.

こちらも仕事絡みの調査で、Marked.js を使ったクライアントに実装するマークダウンエディタに地図(OpenStreetMap)を簡単に実装できるタグを追加する必要があったので、メモとして記録しておきます。
HTMLのコメントを拡張することで実装しています。

IIIF image-viewer Sample

Seadragon_20190516.png

I needed using IIIF viewer for my work. So I researched about that on the web site.
I used the OpenSeadragon.
Here is implemented sample I made.

IIIF Viewer test page

If you want to use same things, it would become good sample.
The sample images(IIIF Manifest) uses which are publicly available data.

仕事関連の調査で、クライアントベースの IIIF のビューアーを作らなければならなかったので記録として残しておきます。
といっても、大抵はWEBで探せば色々みつかるので、1から自分で作ったわけじゃないですけどね。

新しいアプリ「Opposgram」 って?

  • 投稿:
  • 更新:2019年5月 9日
  • by
  • in

opposgram_20190509.png

元々はパダワンの為のSwift学習用最終課題として準備したサンプルコードなんですが、そこはプログラマの性といいますか、ついつい作り込みすぎちゃってアプリになっちゃいました(笑)
このプログラムの前に3プロジェクトほど課題があって、簡単なUIのアクションから始まって、インクリメンタルサーチの実装、UITableVIewなどのリスト系UIとWebAPIを組み合わせたサンプルコード群になってます。
Opposgram はジェダイになるための最終テストって感じですかねぇ?

Opposgram は、Instagram の語呂合わせを真似て、opposite と telegram を混ぜた造語になってます。名前の通りで、2つの画像を合成し、その組み合わせの妙を皆でシェアして楽しむアプリとなってます。(詳細はこちら
データストアに Google の Firebase を使ってるので、あまりデータが増えるとアプリ公開を止めるかもですが、そもそもその前に申請通過するかどうかが微妙です(笑)

まぁ、他の写真加工アプリとInstagramで同じことはできるのですが、そこはそれ、出処がサンプルですし、実はこれ、パダワンが作るアプリのテンプレートの一部になる予定で、たまたまそれが Instagram に似ちゃったってことです(^^;

padawan_asoka_2.png

Good luck, Padawan!
I just believe, You’ll go beyond your Master in the near future.
May the CODE be with you.

SurfTideΔ for Android 細かなバグ修正、iOS版Widgetとの違い

  • 投稿:
  • 更新:2019年2月21日
  • by
  • in

a_std_and_201992211.png

Android版でいくつか細かな修正のため何度かアップデートしました。
修正内容としては

  • デバイスウェイクアップで前回起動と日付が変わっていると本日に移動するようにした
  • ウィジェットとの連動で本日を表示にするようにした
  • 天気図表示で希に異常終了していたのを修正
  • ニュース表示で希に異常終了していたのを修正
  • メイン画面がローテションしていたのをローテーションしないように修正
  • その他、例外処理をいくつか追加して予期せぬ終了に対応

こんな感じです。
v1.1.1で追加したサイト登録機能ですが、登録するサイトの情報量が多すぎるときにアプリが不安定になる場合があります。これについては現在調査中で、問題が判別したらアップデートしていきます。

ウィジット関連も少し修正したので、Android版とiOS版のウィジットの違いについても説明しておきます。 両方のデバイスを利用している人は少し混乱するかも知れませんが、Android版とiOS版では以下のような違いがあります。

  • iOS版はウィジットをアプリにバンドルしてますがAndroid版は別アプリです
  • iOS版のウィジットは現在アプリで表示している場所のみ表示できます(アプリとウィジットが連動している)
  • iOS版のウィジットは上記の制約により、ウィジットからアプリを起動(ロングタップ)した場合アプリに切り替えるだけです
  • Android版のウィジットはアプリとは関係なく複数の場所を設置できます(アプリとウィジットは連動していない)
  • Android版ウィジットは「more」をタップすることでウィジットで表示中の場所を指定してアプリを起動できます

どちらが便利かは人それぞれだと思いますが、上記のような振る舞いはアプリ作成のコンセプトというよりは、それぞれのOSのウィジットの扱いの違いのため、アプリの振る舞いをそれぞれに合わせていることになります。

SurfTideΔ for iOS v1.1.1 リリース and ちょっとしたTips

  • 投稿:
  • 更新:2019年2月15日
  • by
  • in

起動時に「明日」になってしまうバグを修正したバージョンがリリースしました。

と、これだけではなんですから、ちょっとした便利な使い方を載せておきます。iOS/Android共通です。
気づいている方もいるかも知れませんが、天気図画面の中程に「現在の気圧」を表示しています。(デバイスが対応している場合のみです)

a_std_tips_20190215.png

これは画面表示中にリアルタイムに気圧変化を表示しています。大気は急激に動くわけでは無いので、じっとみていても大して変化しませんが、何時間かおきに確認すると気圧の変化がわかるかと思います。
気圧が下がってきていれば天候は悪くなる傾向に、上がってきてれば高気圧圏内にはいってきているので天候は回復傾向にあると予測できます。
特に台風などが接近しているときには気圧が大きく下がるので、ある程度ピークの予測が付くかと思います。

自分は気圧が低いとどうも体調がシックリこない時があります。そんな時は気圧を確認して「あーなるほど」と思ったりします。

風や波情報をチェックしたついでに、ちょっと気圧も確認してみると面白いかもしれません。

iOS版では先行リリースしてた新機能ですがAndroid版も本日PlayStoreにリリースしました。
以下よりダウンロードできます。


動画にある「https://www.windy.com」サイトはサーファーにとても便利なサイトです。ピンポイントで風や波の情報を、3つの情報リソースを利用して表示できます。

このサイトを、SurfTideΔでお気に入りのサイトとして登録するときの方法を以下で簡単に説明しておきます。(iOS/Android共通)

まずは登録するURLを得るためにモバイルのブラウザでここにアクセスして下さい。
日本の全景地図が表示されると思いますので、ピンチとドラッグを利用して登録したい地点を画面の枠に収めます。
次に、サーフポイントの近くをタップします。場所がマークされるので、地図の方をドラッグして微調整して下さい。

これでURLフィールド(検索やURLを入力するフィールド)にURLが作成されているはずです。これをコピーしてSurfTideΔでお気に入りのサイトとして登録すると利用できます。

SurfTideΔに内包する天気情報と合わせると、計4つのウェザー情報リソースを比較できるので、後は自分の判断です。よい波を当てて下さいね!

お気に入りのサイトを登録する新機能は、ほぼこのサイトをシームレスに表示したいがために追加したようなものです(笑)
個人的には、他にも有料サイトの「波伝説」のマイページも登録し利用しています。これであちこちアプリを切り替えたりブラウザーで表示したりしなくても、SurfTideΔを波乗り情報のポータルとして利用できとても便利になりました。
是非いろいろ活用してみて下さい。こちらで登録すると便利なサイトを紹介しています。

SurfTideΔ for iOS v1.1.1 申請中(バグ修正)

  • 投稿:
  • 更新:2019年2月14日
  • by
  • in

先日リリースした v1.1.0 ですが、起動時にタイド日付が「明日」に移動してしまうバグがありました。発見して報告して下さった方ありがとうございました。
現在修正してStoreに申請中です。2,3日中にはリリースされると思いますので再度アップデートをお願いします。

SurfTideΔ for Android 天気情報UIを少し便利に!

  • 投稿:
  • 更新:2019年2月14日
  • by
  • in

iOSで先行して修正したいた機能ですが、Androidでも利用が可能になります。現在Playストアにて公開ベータテスト中で、多分今週中には一般公開できると思います。(2/14 既に公開済です)


a_std_and_site_plus.png

追加した機能の1つめとして、自由にサイトを3つまで登録でるようになります。単一の予報データで波を予測するより、いくつか確認してみて予測するのが良いかと思います。
この追加機能で、SurfTideΔからシームレスに複数の情報が確認できます。
上記のようなサイトもボタン1つで即表示できます。参考になるサイトはこちらで紹介しています。

a_std_and_ui_plus.png

2つめは、SurfTideΔの天気情報のUIを拡張しました。
タイド表示中は左右スワイプで日付を移動できていましたが、天気情報表示中も左右の端を超えてスワイプした場合に日付を移動できるようにしました。
連続して1時間毎の天気予報を確認するのに便利かと思います。

SurfTideΔ for iOS 天気情報UIを少し便利に!

  • 投稿:
  • 更新:2019年2月13日
  • by
  • in

現在 SurfTideΔ for iOS のバージョンアップをテストしています。(2019/2/10公開済)
その中で1つ便利になるUIを紹介します。

タイド表示は左右スワイプで日付を移動できたのですが、天気情報表示中は左右はスクロールになるため日付の移動は出来ませんでした。
新バージョンで少し改修して、天気コンテンツが左右のエッジにある場合、オーバースクロールを利用して、それぞれ前後の日付に移動できるようにしました。言葉で説明すると解りづらいですが、上記の動画をみてもらうと解りやすいかと思います。
あわせて、新機能となる「お気に入りのリンク」機能も動画に載せているので使い方を確認してみて下さい。

Android版についてはこれから同じような改修をしようと思っていますので、Androidユーザーの方は今しばらくお待ち下さい。

追記:2019/2/12
v1.1.0既に公開していますので、上記機能は利用できます。是非バージョンアップしてみて下さい。

追記:2019/2/13
Android版もまもなくリリースします。

SurfTideΔ で連携すると便利なサイト

  • 投稿:
  • 更新:2019年2月13日
  • by
  • in

a_std_favorite_sites.png

SurfTideΔ v1.1.0よりお気に入りのサイトを登録できるようになります。
(現在テスト中につき未公開)
ナビゲーションメニューにサイトへアクセスできるボタンを追加しました。URLの設定は遷移した画面で「えんぴつ」ボタンをタップすることで入力できます。初期状態では使い方の説明サイトを表示します。

波伝説等の有料サイトも登録可能です。もちろん有償ユーザーに限りますが、初回表示でログイン情報を入力することで次回からは対象のページが表示できます。
たとえば上記画像右のように波伝説の「千葉北・概況」を登録するには、以下のようなURLを設定します。

https://www.namidensetsu.com/waveinfo/gaikyo/?surf_gaikyo_area=05

波伝説の「マイ波情報」は以下のようなURLです。

https://www.namidensetsu.com/mypage/index.html

PC等で対象サイトを表示すれば目的のURLを得ることができます。
ただし、有料サイトでは1端末でしかログインを許していない場合もあるので、別のデバイスでログインする場合は毎回ログインが必要になる場合がります・

フリーで一番のお勧めとしては「Windy.com」サイトです。このサイトは1週間先までの波風の情報等がグラフィカルに表示できます。また複数の予測を比較することもできサーファーには非常に便利なツールになっています。
上記画像中央のようにピンポイントで設定するには以下ようなURLになります。URLはPCやiPhoneのSafariで表示してサイズや位置を調整すれば得ることができます。

https://www.windy.com/35.655/140.611?35.284,140.607,9

その他のお勧めとしては以下のようなサイトがあります。これらはそのままコピー&ペーストするか、目的の情報まで遷移したURLをコピー&ペーストすると利用できます。

「気象庁:沿岸波浪実況図

https://www.data.jma.go.jp/gmd/kaiyou/db/wave/chart/daily/coastwave.html

「気象庁:潮位表

https://www.data.jma.go.jp/kaiyou/db/tide/suisan/

「海上保安庁:海洋速報/海流推測図 など

https://www1.kaiho.mlit.go.jp/KANKYO/KAIYO/qboc/index.html

「Yahoo!:全国の波予測

https://weather.yahoo.co.jp/weather/wave/

「Yahoo!:台風情報

https://typhoon.yahoo.co.jp/weather/jp/typhoon/

「Yahoo!:新しい天気予報サイト「SCW」

https://supercweather.com

いずれの情報も 2019/2月現在の情報です。変更される場合もあります。
上記URLは、iPhoneのSafariから、URLの上部にあるリンクをロングタップするとリンクをクリップボードにコピーできます。

新しい便利なサイトを発見したら追加していきますので、たまにこのページを参照してみて下さいね。また登録の方法等わからないことがありましたら気軽に連絡下さい。可能な限りサポートします。