福野泰介の一日一創

オープンデータとオープンソースに力を入れる東京都！
東京都オープンデータコミュニティに入りました。

「東京都オープンデータコミュニティ」
Slackで東京都のオープンデータ担当の人と直接コミュニケーションできます。

「東京都オープンデータカタログサイトホームページ」
多量のCSVデータ、APIが公開されている東京都オープンデータ。詳細検索から、今月更新された新鮮なデータを探してみました。

「TOKYO WALKING MAP - データセット - 東京都オープンデータカタログサイト」
最もアクティブなのは「東京都福祉保健局」のオープンデータ。コロナ対策サイトでオープンデータが活躍したことがきっかけかも？楽しそうなオープンデータを発見しました。

CKANのAPIが見当たらなかったので、このページのHTMLを「scrape.js」でスクレイピングして、264のコースをリストアップ。

続いて、「download.js」でzipをダウンロードし、kmlデータとしてまとめてリストとともに、GitHub Pagesで公開。（tokyo-walking-map_2.csv）

ひとまず、全スポットを地図に表示してみるため、Placemarkを抜き出して、重複する緯度経度を消す「makeplacemarks.js」で、3864地点のデータとしました。（tokyo-walking-map_placemark_ja.csv 日本語、tokyo-walking-map_placemark_en.csv 英語）

「TOKYO WALKING MAP スポットマップ」
3864地点はちょっと重いので、先日つくったGeo3x3メッシュによる概要表示機能を使った、csv-mapで表示。

「TOKYO WALKING MAP spot map」
日英で登録されていたので、別々のオープンデータとして分離し、英語版ページの表示に対応しました。

「トーキョーウォーキングマップ」
こちらがオープンデータの発生元サイト。一日10分歩いて、健康を！
東京都の企画、福井でも横展開してみるのも良さそうです。

「CyberFriday」
福井のコミュニティのリアルイベント、サイバーフライデーは今週末＠越前市！ 9/29金、武生駅から徒歩8分、先月オープンしたばかりのIdeaSyncにて開催です。そして、土日は「めがねフェス」！

<と>で囲まれた単語がタグとして特殊な扱いをするテキストデータ、HTML。「<」という文字を表現したいときは「&lt;」とアンドとセミコロン記号で対応する単語と囲んで記述します。

この変換（エンコードという）と、逆にHTML内の文章を通常の文章にする場合にはデコード(decode)するライブラリを、HTML.js としてまとめました。

「HTML - Code for FUKUI on GitHub」
ESモジュールなのでインポートしてすぐDenoやブラウザで使えます。「13.5 Named character references - HTML Standard」に大量に定義されていますが、無駄に重くなるのも嫌なので、ひとまず必要そうなものだけの対応です。必要に応じて追記ください。

「福井観光スポット似たもの探し」
昨日作ったこのアプリ。次々と福井県内の観光地を似ているもの、似ていないもので辿れて楽しんでいたら、HTMLデコードされておらず、文字化けしている箇所を発見したことが、本ライブラリの開発のきかっけでした。

「福井観光スポット似たもの探し」
ふくいドットコム掲載の福井観光地オープンデータを取得しなおしたところ、現在932箇所。755箇所から大幅増！メイン写真クリックで「ふくいドットコム」サイトが別ウィンドウで開き、常にそちらを使うようにしているので、2画面並べて使うと便利です。

オープンデータ、いろいろと活用して、福井を日本をより良い観光地にしていきましょう！

links
- 福井県観光スポットで似たもの探し with Embedding API by OpenAI

浮動小数をバイナリ化できたので、文章をベクトル化するEmbedding APIを使って、AIによる似たもの探しアプリをつくりました。

「福井観光スポット似たもの探し」
福井県観光連盟「ふくいドットコム」が紹介する755箇所の観光スポットの中から、似た観光地ベスト3と、似てない観光地ベスト3を表示します。クリックすると次々と見ることができます。知らない福井に触れてください！

「txt2vec」
最大8191トークンの文章を1536次元のベクトルにするOpenAIのEmbedding API、ADA002を使うJavaScript/Denoライブラリを準備。コサイン類似度を算出するベクトル計算を行うVec2.jsも実装。

「福井観光スポット似たもの探し」のつくりかた
1. 説明(description)だけを抜き出した配列をtxt2vecでベクトル化し、IEEE754/Base64URLでエンコードしたCSVファイルを生成。 (make_vec_fukuispot.js)

2. 全件に対して文章的な近さをコサイン類似度を計算して、トップ3、ワースト3のIDを追記したCSVを生成。 (calc_vec_fukuispot.js)

3. これを表示するアプリを作ってできあがり！ (index.html)

「Embeddings - OpenAI API」
文章を配列にしてまるっと渡すと、サクッとベクトルにして返してくれます。料金は、$0.0001 / 1K tokens （100万文字で15円）とリーズナブル！

links
- 福井県の観光スポット755箇所のCSV＆JSONオープンデータ、恐竜マップ in FUKUI

多量の浮動小数をコンパクトにデータ化したくなり、IEEE754で標準化されているバイナリエンコーディングを気軽に扱うライブラリを準備しました。

いろんな実装がありましたが、Float32Arrayを使えばUint8Arrayへ簡単に変換できました。チェックツールで確認しながら、最低限のテストコードを書いて、できあがり！

「code4fukui/IEEE754」

import { IEEE32 } from "https://code4fukui.github.io/IEEE754/IEEE32.js"; const bin = IEEE32.encode([1, .5, .1]); const f32array = IEEE32.decode(bin); console.log(f32array); ESモジュールとして、Denoやブラウザ上でサクッと使えます。

GitHubにアップしようとすると手元で被ったファイル名。実は、2021年、ieee754として移植したライブラリがありました。こちらはJavaScriptで丁寧に変換するライブラリの移植なので、速度面では今回の実装がいいでしょう。