去年に続き、夏休みの福井県立高志中サイエンス部訪問。 新1年生にプログラミングの楽しさを!上級者にはもっと楽しい創造のヒントを!の2本立て。

高志中サイエンス部のみんな!

はんだづけからはじめるプログラミング入門。その間に、上級者向けレクチャー、世の中には無料で使える楽しいおもちゃがたくさん!オープンソース、オープンデータ、IoT、思う存分遊びましょう!


はんだづけできたら、LED1、やった光った!(LEDを最初反対に付けてしまったのを手術し修正後)


ビーズでかわいくオリジナルIchigoDake!(ビーズで飾る電子工作


早速、IchigoJamでゲームづくり!
IchigoJamプリントや、IchigoJam教材スライドもオープンデータとして公開しています。
教材づくりへのチャレンジもぜひ → 33ステップで解説、GitHubオープンソース貢献入門 IchigoJamプリントをつくってみよう


IchigoJamで、ペアプログラミング!楽しさ2倍!?


経験者チームは、持っていったいろんなおもちゃで思い思いに遊ぶ。


オシャレな画面と共に、ランダムに奏でるIchigoJamプログラム!


VIDEOのパラメータをRNDにするのが斬新!


PCN上田発、ハンドスピナー型IchigoJamをPC冷却ファンをMapleSyrupで制御して、回してた!


JavaScriptで改造したカオスなブロック崩しゲームを見せてくれました。
物理エンジン使うと、また楽しいものがつくれるよ!


缶サット、昨年度の取り組み「模擬人工衛星の挙動制御と構造的工夫」を紹介してくれました。 今年は地面のマーカーにめがけて着地制御にチャレンジしたいとのことで、使用するセンサーの相談。 今オススメは、RISC-V 64bit x 2coreのカメラ付きモジュール、M1n

USB-Cでパソコンと接続し、rshellをセットアップ(初回だけ)

sudo pip3 install rshell

rshellコマンドで接続(usbeserialのあとの番号は自身の環境に合わせる)

rshell -p /rshell -p /dev/tty.usbserial-xxxxxxxxx0 edit /pyboard/flash/boot.py

viが起動するので、microPythonでプログラムを貼り付ける

import sensor import math sensor.reset() sensor.set_pixformat(sensor.RGB565) sensor.set_framesize(sensor.QVGA) sensor.run(1) green_threshold = (50, 80, -70, -10, -0, 30) #red_threshold = (40, 80, 30, 70, 0, 40) fm.register(20, fm.fpioa.UART2_TX) fm.register(15, fm.fpioa.UART2_RX) uart = machine.UART(machine.UART.UART2, 115200) print(0) while 1: img = sensor.snapshot() #blobs = img.find_blobs([red_threshold]) blobs = img.find_blobs([green_threshold]) if blobs: for b in blobs: print(b.cx(), b.cy()) #n = ((b.cx() // 2) << 8) + (b.cy() // 2) x = b.cx() / 320 * 100 y = (b.cy() + (320 - 240) / 2) / 320 * 100 n = math.floor(x) * 100 + math.floor(y) uart.write(str(n) + "\n") break time.sleep(.1)

「:wq」エンターと押して保存。これで書き込み完了!

M1nの20ピンをIchigoJamのRXDへ、M1nのGNDをIchigoJamのGNDへ、接続。

秋月電子の3Vで動くサーボと、AIカメラモジュールを組み合わせます。


IchigoJamでのプログラムはこれだけ!
シリアル信号で受信したXY座標をまとめた4桁の数が送られてくるので、100で割ったX座標のみを使って、サーボを動かす!


サーボに貼り付けたAmabieDakeが緑色を見せる場所に合わせて傾きます。
缶サット、空中での移動はどう実現するか?いろいろ試してみるのがおもしろそうですね。
マーカーの認識は、green_threshold のパラメータで微調整します。
IchigoJamのPC接続のように、M1nにシリアルで接続し、Ctrl-C で、動作を停止、プロンプトがでてくるので、下記コマンドで自動起動するプログラムを一旦消して、再度書き込みましょう。

os.remove('boot.py')

IchigoJamでのソフトウェア、制御するハードウェア、M1nのmicroPython、いろいろ分担して取り組んでみよう!


IchigoJamでコントロールするドローン、TELLOを使った実験中とのこと!


今回、声をかけてくれた前田くん、高志中サイエンス部のWebサイトがいい感じ!

IchigoJam 1.4のWS.LED命令についてかいてくれてます!)
ぜひいろいろ作って、オンライン、オフライン問わず、バンバン発表して、見てもらう人増やしましょう!(NT鯖江もよろしく)

IchigoJamに高性能な目を付けてみましょう。
目とは、光の三原色の強さを二次元配列上に受け取り、左右の差で立体的に知覚する器官。
カメラはそれをデジタルで実現したデバイスです。

毎秒何十枚もの画像を処理するのはIchigoJamのCPUでは荷が重いので、画像処理付きのデバイスを使います。 秋月電子で見つけた「Sipeed M1n Module AI Development Kit based on K210(RISC-V)」を使って、赤が右にあるか左にあるかをデジタル入力で受け取れるセンサーを作ってみました。


センサー実験と、IchigoJamにつないで動かしている様子。


64bit RISC-V 400MHz x 2core + AIエンジン + カメラ で、1,450円、すごい時代です。


LEDを光らせてみましょう。
IchigoJamよりちょっとだけむずかしいです。
WindowsやMacが使いこなせるようになったら、ぜひチャレンジしてみましょう!
USB-Cで接続し、CoolTerm(for macOS)などで接続して、microPythonでプログラミングします。

fm.register(20, fm.fpioa.GPIO1) led = GPIO(GPIO.GPIO1, GPIO.OUT) led.value(1)

お行儀が悪いですが、20ピンとGNDにLEDを直結して実験してみましょう。 コンピューターK210は、ピン毎に自由に機能を割り当てできます。fm.registerで表にでているGNDの隣の20ピンにGPIO1を割り当て、GPIO1をOUTに設定。 valueで1に設定すると、光ります!

while 1: led.value(1) time.sleep(0.5) led.value(0) time.sleep(0.5)

設定後、こんなプログラムで0.5秒ごとにエルチカできます。(ちなみにIchigoJamではこんな感じ)

1 LED1:WAIT30:LED0:WAIT30:CONT

コンパイル不要で、IchigoJamっぽい感覚で使えます。

rshellを使うと、シェルから接続できて、IchigoLatte感覚でファイルの作成もできて便利です。 editコマンドでviが使える!


カメラモジュールを接続してみましょう。この向きです。ちょっと固いですが、ケーブルを壊さないように慎重に!

sensorがカメラです。設定してcaptureするだけで画像が取得できて、いろいろ使えます。 サンプルを少し改造して、赤を見つけた左右位置によって、20ピンと隣の15ピンで出力して実験です。

import sensor sensor.reset() sensor.set_pixformat(sensor.RGB565) sensor.set_framesize(sensor.QVGA) sensor.run(1) red_threshold = (40, 80, 30, 70, 0, 40) fm.register(16, fm.fpioa.GPIO0) btn = GPIO(GPIO.GPIO0, GPIO.IN) fm.register(20, fm.fpioa.GPIO1) left = GPIO(GPIO.GPIO1, GPIO.OUT) fm.register(15, fm.fpioa.GPIO2) right = GPIO(GPIO.GPIO2, GPIO.OUT) while btn.value(): img = sensor.snapshot() blobs = img.find_blobs([red_threshold]) if blobs: for b in blobs: print(b.cx()) if b.cx() > 320 / 2: left.value(1) right.value(0) else: left.value(0) right.value(1) break else: left.value(0) right.value(0)

本体に付属のボタン2つ、1つはリセット、1つは書き込みモードになるボタンですが、起動中はフリーに使えます。 16ピンをGPIO0、GPIO.INに割り当て、センサープログラムを中断するボタンとしました。


うまくいきました!boot.py として、プログラムを保存すれば、起動時に勝手に動き出します。IchigoJamのFILE0保存+ボタン押しながら起動または@ARUN相当ですね。


あとはIchigoJamにつなぐだけ、GND同士をつなぎ、20ピンと15ピンをIchigoJamのIN1とIN2に接続して、IchigoJamでテストプログラムを書いて確認しましょう。

1 ?BIN$(IN(),2):WAIT3:CONT

USB-Cから電源をとるか、VCCに3.3V、300mA以上の電源を接続すれば、単体で動作します!
コンピューターの目を使った高度なロボット操作にも気軽にチャレンジできそうです。

越前がにロボコン」では、「こどもプログラミング実業団」企画に賛同いただける企業の方、大募集中です!
AI/IoT、こどもたちと一緒に楽しく習得する企業型地域ICTクラブ、はじめませんか?

COVID-19 Japan 新型コロナウイルス対策ダッシュボードの物理版。パソコン上のPythonを使って、USBシリアル経由でつないだIchigoJamを制御。 (モノクロにすると、色の強さが分かる)

データは、COVID-19 Japan 新型コロナウイルス対策ダッシュボードTXT版を使用。CSV / JSON もオープンデータ、ご活用ください。


すがやみつる氏による「こんにちはマイコン」のPython版「ゲームセンターあらしと学ぶ プログラミング入門 まんが版こんにちはPython」の出版記念にひさびさPythonプログラミング!

Pythonは、変数に型はないけど、型変換は自動ではないのでメソッドを使う。変数はBASICと同様、宣言が不要なので、長い変数名を使った時の誤字に注意。一行コメントは #、長いコメントは """ で囲む。

IchigoJamを単なる表示器として使ったプログラムが完成。(src on GitHub)

def locate(x, y): ser.write(b'\x15') ser.write(chr(32 + x).encode()) ser.write(chr(32 + y).encode()) ser.write(b'\x13\x0c') locate(2, 2) ser.write(b'COVID19 ')

こちらその一部、IchigoJam特殊キーコードを使った、カーソル位置指定(LOCATE/LC)に相当するメソッドを、定義(def)して、使用。chrはBASICのCHR$と一緒!シリアル通信にわたす際、encodeで文字列をバイナリ化。


COVID-19 Japan 新型コロナウイルス対策ダッシュボード
5/8まで公開されていたデータがなくなり、報道発表で数値が訂正される。以後、都道府県の公開データを集計する形となった。 このため、死亡者数が一部不明「-」表示に変わっている。ぜひ各自治体からのオープンデータ化、ぜひお願いします!

重症患者数、現在患者数を含むデータ定義書を作成。オープンデータ化する際に参考にどうぞ。
covid19/opendata_spec_covid19_20200510.xlsx at master · code4sabae/covid19


VIDEO3/5を使った拡大表示にも対応!
ILI9341対応βファームウェア:IchigoJam 1.4β20 for ILI9341


★3.2インチ★TFT液晶モジュール★240x320★ - aitendo
かなり文字が大きく見える、3.2インチのILI9341液晶は、こちら!IM0、IM1、IM2のはんだによるジャンパー設定を、0、1、1に切り替えて、4線SPI制御にして、使用するピンにピンヘッダーかピンソケットをはんだづけ。


CLKがD_WRS、DCがD_WRと表記されているので注意。

液晶モジュール - IchigoJam
D_LEDA - VCC(抵抗を介して接続で明るさ調整可)
D_WRS(SCK) - IN1 (SPI用のクロック)
D_SDI(MOSI) - VIDEO2 (SPI信号)
D_WR(DC) - IN2 (Data or Command)
D_RESET - IN4
D_CS - GND (Chip Select - 常に選択)
GND - GND
VCC_IN - VCC (3.3V)


コンパクトでかわいい、2.2インチ!

4線SPI対応ILI9341液晶でぜひお試しください!
(8bit/16bitパラレル通信のみのものには非対応です)

KMD、慶応義塾大学メディアデザイン研究科と鯖江市とのコラボ5周年成果発表!
地域の進化=鯖江モデル by KMD研究員 大江さん


成果発表会に結婚披露宴が合体した謎イベント


前代未聞なイベントに、鯖江市長、越前漆器協同組合理事長、鯖江商工会議所会頭、梵社長などなど集まっちゃうのが鯖江の強み。

鯖江高校150周年記念にKMD教授、岸さんが講演し、伝統産業漆に興味をもってもらって市長へ提案、その場で即断即決から始まり、職員&民間のすばやいバックアップがあっての成果とのこと。まさに、オープンデータもそうでした。

速攻アップされる、市長ブログ!
KMDプロジェクト5周年記念および木戸さんのご結婚お披露 | 『さばえ.jp』百さんのブログです


鯖江へ移住してきて、鯖江から離れられなくなった、KMDリサーチャーの木戸さん、おめでとう!

進化し続ける鯖江を支えるのはこどもたち、ICTに強い人を育てる要のプログラミング教育。

2025年度の一人一台パソコン使った新しい教育環境を目指す「GIGAスクール構想」と、その実現を支える「ICT活用教育アドバイザー」。2019年の44名リストを、1つ星オープンデータPDFを、JavaScriptで3つ星化(CSV/JSON)して、コンパクトなHTMLでまとめました。

ICT活用教育アドバイザー一覧(平成30年度)

ページ名前所属web
P1安藤明伸あんどうあきのぶ宮城教育大学技術教育講座准教授[fb] web1 web2
P2石野正彦いしのまさひこ上越教育大学
P3稲垣忠いながきただし東北学院大学文学部教育学科教授web1 [tw]
P4今田晃一いまだこういち金沢学院大学文学部教育学科教授web1 web2 web3
P5太田耕司おおたこうじ千代田区立お茶の水小学校校長web1 web2 web3
P6尾島正敏おじままさとし倉敷市教育委員会web1 web2
P7小柳和喜雄おやなぎわきお奈良教育大学大学院教授web1
P8梶本佳照かじもとよしてる新見公立短期大学幼児教育学科教授web1 web2
P9加藤隆弘かとうたかひろ金沢大学人間社会学域学校教育学類准教授[fb]
P10加藤直樹かとうなおき岐阜大学教育学部附属学習協創開発研究センター教授web1
P11加藤直樹かとうなおき東京学芸大学web1 [fb]
P12門田哲也かどたてつや倉敷市教育委員会教育企画総務課情報学習センター主任
P13金子大輔かねこだいすけ北星学園大学経済学部教授web1 [tw]
P14岸磨貴子きしまきこ明治大学国際日本学部准教授web1 web2
P15楠本誠くすもとまこと松阪市教育委員会事務局学校支援課
P16久世均くぜひとし岐阜女子大学教授/遠隔・通信教育部長
P17久保田善彦くぼたよしひこ宇都宮大学教育学研究科教育実践高度化専攻教授web1 web2 web3
P18駒崎彰一こまざきしょういち中野区立緑野小学校校長web1
P19小松川浩こまつがわひろし千歳科学技術大学理工学部教授web1 web2 web3 web4
P20後藤康志ごとうやすし後藤康志新潟大学教育・学生支援機構web1
P21篠原真しのはらまこと相模原市立総合学習センター学習情報班担当課長
P22島村秀世しまむらひでよ長崎県教育庁政策監(教育情報化担当)
P23泰山裕たいざんゆう鳴門教育大学大学院web1 web2 web3
P24田嶋直哉たじまなおや北海道教育庁学校教育局教育環境支援課主幹(情報化推進)
P25辻慎一郎つじしんいちろう鹿児島県薩摩川内市立川内中央中学校[fb]
P26豊田充崇とよだみちたか和歌山大学教職大学院教授web1 web2
P27永田智子ながたともこ兵庫教育大学大学院准教授
P28中橋雄なかはしゆう武蔵大学社会学部教授web1 web2 web3
P29中村武弘なかむらたけひろ奈良教育大学次世代教員養成センター特任講師[fb]
P30西田光昭にしだみつあき柏市教育委員会柏市立教育研究所教育専門アドバイザーweb1
P31新田正にったただし京都市教育委員会事務局指導部
P32野中陽一のなかよういち横浜国立大学大学院教育学研究科高度教職実践専攻教
P33平井聡一郎ひらいそういちろう株式会社情報通信総合研究所特別研究員web1 web2 web3
P34東原義訓ひがしばらよしのり信州大学学術研究院教育学系教授
P35福田孝義ふくたたかよし佐賀県武雄市ICT教育監web1 web2
P36藤村裕一ふじむらゆういち国立大学法人鳴門教育大学大学院准教授web1 web2 web3
P37堀田博史ほったひろし園田学園女子大学教授web1
P38益川弘如ますかわひろゆき聖心女子大学文学部教育学科教授[fb]
P39村松浩幸むらまつひろゆき信州大学教育学部技術教育グループweb1 web2
P40毛利靖もうりやすしつくば市立みどりの学園義務教育学校校長web1 web2 web3 web4 web5
P41西村陽介にしむらようすけ滋賀県草津市教育委員会事務局
P42山本圭作やまもとけいさく大阪市教育委員会事務局web1
P43山本朋弘やまもとともひろ鹿児島大学大学院教育学研究科准教授[fb] web1
P44渡部昭わたべあきら墨田区教育委員会
(出典:ICT活用教育アドバイザー派遣事業(平成30年度):文部科学省

参考、PDFからテキストコピーし、CSV化するPythonプログラム

const fs = require('fs') const text = fs.readFileSync('ictadvisor30-src.txt', 'utf-8') const ss = text.split('\n') const SPLITTER = 'ICT活用教育支援アドバイザープロフィール' let id = 1 console.log('ICTEDU_Advisor_30_ID,name,kana,position,URL_1,URL_2,URL_3,URL_4,URL_5') for (let i = 0 i < ss.length; i++) { const s = ss[i] if (s == SPLITTER) { const line = [] line.push(id++) const name = [] for (let j = 1; j < 4; j++) { name.push(ss[i + j].replace(/\s/g, '')) } line.push(name[1]) line.push(name[0]) line.push(name[2]) const url = [] for (let j = -1; i + j >= 0; j--) { const s2 = ss[i + j] if (s2 == SPLITTER) { break } if (s2.startsWith("http://") || s2.startsWith("https://")) { url.push(s2) } } for (let j = url.length - 1; j >= 0; j--) { line.push(url[j]) } console.log(line.join(',')) } }

ちょっとしたプログラムで、使い勝手が劇的に変わります。

すべてのこどもたちにプログラミングを伝えるべく、まずは大人もプログラミングの楽しさと強さを味わっておきましょう!


いただいた、メガネ堅パン、KMDスペシャル!

めがね産業高度化に向けた4者提携、前夜の作戦会議時の3D写真!

平行法で立体に見えます。VR用の3Dテクスチャーとしても使えます。
(参考、福井高専、KDDI、jig.jp、エル・コミュニティ、地域産業高度化に向け提携 | 2019年 | KDDI株式会社


撮影機材、Insta360 EVO、レンズ2つでステレオ撮影!(折り曲げて360度カメラにもなる)


裏面は何もなし!撮影時の気分は、昔なつかし写ルンです!


スマホのアルバムへエクスポートしたままの写真はこちら。


中心部をクロップ(切り出し)するといい感じの3D写真になるので、Pythonで切り出しプログラム「crop3d.py」づくり。

import os import sys import PIL.Image if len(sys.argv) < 2: print("crop3d [input jpg file] [output jpg file] (ratiow) (ratioh) (offx) (offy)") sys.exit() f = sys.argv[1] fo = sys.argv[2] if len(sys.argv) > 2 else f ratiow = float(sys.argv[3]) if len(sys.argv) > 3 else .6 ratioh = float(sys.argv[4]) if len(sys.argv) > 4 else ratiow offx = float(sys.argv[5]) if len(sys.argv) > 5 else 0 offy = float(sys.argv[6]) if len(sys.argv) > 6 else 0 src = PIL.Image.open(f) iw, ih = src.size iw2 = int(iw / 2 * ratiow) ih2 = int(ih * ratioh) dst = PIL.Image.new(src.mode, (iw2 * 2, ih2)) x = iw // 4 + int(iw2 * offx) y = ih // 2 + int(ih2 * offy) iml = src.crop((x - iw2 // 2 , y - ih2 // 2, x + iw2 // 2 + 1, y + ih2 // 2)) imr = src.crop((x - iw2 // 2 + iw // 2, y - ih2 // 2, x + iw2 // 2 + iw // 2 + 1, y + ih2 // 2)) dst.paste(iml, (0, 0)) dst.paste(imr, (iw2, 0)) dst.save(fo, 'JPEG', quality=95, optimize=True)

画像加工はPillowを使用(参考、Pillowに関する情報 | note.nkmk.me


パラメータで切り出す大きさ、縦横のオフセットを元画像サイズ比で指定。
レンズ間がそんなに広くないので、遠景のステレオ感は薄め。


月イチ開催、会社のランチ会のデザート付属のドライアイス。この距離感、いい感じ!

広角化、多眼化するスマホのカメラ、ぜひVR180対応、できればインカメラも180度広角化して、360度対応してほしい。

パソコンとスマホ、どちらが入力速いですか?

日本人、実はスマホ派の方が多いのかもしれません。 実際、日本語入力であれば、フリック入力方式と変換予測と慣れによって、あまりストレスなく使えています。(編集機能が貧弱なので、長文はまだ面倒)

パソコンとスマホのいいとこ取りをすべく、スマホでコントロールするパソコン第一弾、シンプルなプレゼンクリッカーを作成。

キー操作や、マウス操作をプログラミングするAPIをネット越しに呼び出せばOKです。今回はサーバー側は Python3 + Flask で作りました。 pyautogui を使うと、Javaで言う java.awt.Robot と同様、キー操作、マウス操作をエミュレートできます。

from flask import Flask, render_template app = Flask(__name__) @app.route('/') def home(): return render_template("index.html") import pyautogui @app.route('/api/left') def left(): #pyautogui.click() pyautogui.keyDown('left') return "" @app.route('/api/right') def right(): #pyautogui.rightClick() pyautogui.keyDown('right') return "" app.run(host = '0.0.0.0', port = 8001)

templatesフォルダに、操作するクライアント側プログラムを HTML+CSS+JavaScriptで以下のように記述。

<!DOCTYPE html><html lang="ja"><head><meta charset="utf-8"/><meta name="viewport" content="width=device-width"/> <title>clicker</title> </head><body> <div class=btn id=left>←</div> <div class=btn id=right>→</div> <style> body { text-align: center; font-family: sans-serif; } .btn { display: inline-block; margin: 5vh 1vw; width: 40vw; height: 50vh; line-height: 50vh; background-color: gray; color: white; font-size: 30vw; } </style> <script> left.ontouchstart = function(e) { fetch('api/left') e.preventDefault() } right.ontouchstart = function(e) { fetch('api/right') e.preventDefault() } </script> </body> </html>

パソコンとスマホを同一ネットワーク内で起動して、IPアドレスを ifconfig (Mac) か ipconfig (Windows) で調べて、スマホで表示してみましょう(QRコード連携が便利です)

スライド表示して、スマホから左右ボタンを遠隔操作できました。
機能を増やしたり、マウス替わりにしてみたり、WebSocket化して高速化したり、いろいろ試すベースができあがり!

最強の学習ツール、ネットにつながったパソコン。

IchigoJam BASICで学び、ノートパソコンにステップアップする一歩手前、無線LAN接続ボード「MixJuice」を使って IchigoJam をブラウザ化する「Ichigobrowser」を作ってみました。webサイトへアクセスして日本語が読めます!

単にパソコンを手にしたこどもは、ゲームで遊んだりYouTubeにハマってしまうだけかもしれません。 プログラミングから触れてもらうことで、こどもたちは自分で創る楽しさ、自分で学ぶ楽しさ、コンピュターとネットの本当の力に気がついてくれます。

10/1から募集開始になった「第10回PCNこどもプロコン2019-2020」でノートPCをゲットできるよと話すと、鯖江の小学生の子たちみんな目をキラキラさせてチャレンジしたいという頼もしい声!(鯖江市全4年生総合2コマプログラミング教育授業動画公開


Ichigobrowser の仕組み:サーバーで中継プログラムを動かして、URLをMixJuice経由でおくると、IchigoJamで読めるようにカタカナ化されて、リンクと共に文章が送られてきます

11111 @A:?"MJ GET sabae.cc:5001/?u=";STR$(S):END OK2 S="https://ichigojam.net/":GSB@A

Ichigobrowserの使い方:コマンド「OK2」でエラー表示を止めて、変数SにURLをいれて、中継サーバー(仮に動作させている sabae.cc:5001)に渡すと、そのページが返ってきます。意外と読めるカタカナページ!


目指すはMSX! Raspberry Pi より安価な IchigoJam 発表!」をIchigobrowesrで表示!

Ichigobrowser」は、サーバーで動くPythonの中継プログラムで実現しています。
プログラムはオープンソース、こどもたちのために活用ください(src on GitHub)


ロゴデザインはドット絵ツール「dote


参考になった、PCN大阪、森さん著の「Python 2年生 スクレイピング入門
requetsを使って、BeautifulSoup4でタグ解析、Aタグのリンクを抽出して、カタカナ化して、返却!


こちらの本、jigブラウザがきっかけで取り組みを始めた鯖江市のオープンデータも掲載!
データをプログラムで使う楽しさ、広まりそうです。


2004.10.1の jigブラウザ 誕生からちょうど15年!
人類最強のコミュニケーションツール、web上の革命はまだまだ始まったばかり。

2019年度の人気プログラミング言語ナンバーワンのPythonGitHubのアクティブでも不動の1位、PC上のPythonを使ってIchigoJamをコントロールして、かんたんIoTを実現してみましょう!

ネットにつながっているPC、Pythonを使えば世界中のさまざまなデータをAPI経由、スクライピングなどで、取得し放題。
Python2年生 スクレイピングのしくみ 体験してわかる!会話でまなべる! | 森 巧尚 | コンピュータ・IT | Kindleストア | Amazon」(まもなく登場!1年生はこちら

でも、PCではデバイスやセンサーなどを直接制御はできません。
そこで、それら電子部品の制御が得意なIchigoJamとUSBシリアルでつないでいいとこどり。

IchigoJamにUSBシリアルをつなぐか、IchigoKamuyを使って、PCに接続したら、Python用シリアル通信ライブラリ「pySerial」をセットアップ

pip3 install pyserial

USBシリアルのポート(port)を /dev/tty.〜 または COM3 などで指定し、LEDをつけるプログラムはこちら(シリアルを閉じる前に0.1秒待ちをいれてます)

import serial import time port = '/dev/tty.SLAB_USBtoUART' ser = serial.Serial(port, 115200) ser.write(b'LED1\n') time.sleep(0.1) ser.close()

好きなコマンドをIchigoJamへ送って、結果を1行表示するPythonプログラムをつくって

import serial import time import sys port = '/dev/tty.SLAB_USBtoUART' ser = serial.Serial(port, 115200) ser.write(sys.argv[1].encode('utf-8')) ser.write(b'\x0a') print(ser.readline().decode('utf-8')) time.sleep(0.1) ser.close()

IchigoJamコマンドをPCのコンソールから自由自在に送信可能!(例、LEDオフ、出力ポート制御、アナログ入力、サーボ制御)

python3 command.py 'LED0' python3 command.py 'OUT1,1:WAIT60:OUT1,0' python3 command.py '?ANA(2)' python3 command.py 'PWM2,100'

IchigoJam 1.4βファームウェアを使えば、マイコン内蔵フルカラーLEDのまとめて制御もこのように簡単!(リファレンス

python3 command.py 'LET[0],10,0,0:WS.LED1,50'


ネットで取得したデータに合わせて派手にお知らせできますね!
その他、いろいろサンプルプログラム in Python はこちら
IchigoJam/IchigoJam-control-by-python: IchigoJam control by Python

links
- Rubyで操るフルカラーLED50コ、USBシリアル x IchigoJam x Ruby編!
- IchigoJamでパソコンとUSBシリアル通信。Node.jsを使うとキーボードとモニタいらず – しずかなかずし

データで遊ぼう!

山口県工業技術センターにて開催「衛星データ解析技術研究会」にてオープンデータ特集。
オープンデータと宇宙データを組み合わせると、ますます楽しく遊べます。

自治体5つ星オープンデータ化を支援するodpなど、5つ星オープンデータの広まりを心待ちにしつつも、いますぐプログラミングして遊べる楽しいこと、はじめましょう!


Tellusで使える2010年3月〜2018年7月末までの降雨量データ、緯度経度共に0.1度の精度で降雨量が分かります。これを使って宇部市、常磐公園や宇部高専あたりの晴天率を調べてみました。

2018年6月の晴天率は、60%とでました。
Tellus OSでもチェックできますが、プログラムにするといろんな場所を自動的にチェックできて便利です。

こちらが計算するのに使った、Jupyter Notebookで動かすPythonプログラム。

TOKEN = "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx" import os, json, requests, math from skimage import io from io import BytesIO import calendar import matplotlib.pyplot as plt %matplotlib inline def get_image_GSMaP(date, xtile, ytile): sname = "GSMaP" zoom = 5 url = "https://gisapi.tellusxdp.com/{}/{}/{}/{}/{}.png".format(sname, date, zoom, xtile, ytile) print(url) headers = { "content-type": "application/json", "Authorization": "Bearer " + TOKEN } r = requests.get(url, headers=headers) return io.imread(BytesIO(r.content)) def ll2tile(lat, lng, z): w = math.pow(2, z) / 2 yrad = math.log(math.tan(math.pi * (90 + lat) / 360)) return [ (lng / 180 + 1) * w, (1 - yrad / math.pi) * w ] def get_pixel_GSMaP(date, lat, lng): tile = ll2tile(lat, lng, 5) img = get_image_GSMaP(date, math.floor(tile[0]), math.floor(tile[1])) return img[math.floor(tile[0] * 256 % 256)][math.floor(tile[1] * 256 % 256)] def calc_fine_ratio(y, m, lat, lng): cnt = 0 _, ndays = calendar.monthrange(y, m) for d in range(1, ndays + 1): date = "{:0=4}-{:0=2}-{:0=2}".format(y, m, d) rgba = get_pixel_GSMaP(date, lat, lng) #n = (rgba[0] << 24) | (rgba[1] << 16) | (rgba[2] << 8) | rgba[3] n = rgba[3] print(date, n) if n < 255: cnt = cnt + 1 return cnt / ndays calc_fine_ratio(2018, 6, 33.931245,131.277600)

緯度経度からタイル座標への返還は、こちらJavaScriptのプログラムを参考にしています。


PCN山口代表のコヤマさんにも会えました!宇部高専生によるPCN宇部との連携、はじまります!


さくらインターネット、小笠原さん、牟田さんとも楽しいパネルディスカッション。


講演資料オープンデータ「オープンデータと宇宙データで地域活性化(PDF)


日本の衛星、だいち2号(ALOS-2)の1/3スケール模型。この子が宇宙からデータを届けてくれているんですね!
1/1スケール模型、Oculus QuestでぜひVR表示させたいところ!3Dオープンデータ探します。


山口名物、瓦そば!
瓦そばオープンデータがあったら、衛星データと組み合わせて、どんなアプリを作りますか?
こどももおとなも、レッツ、プログラミング!

宇宙データプラットフォームを使った分析はじめ、続いては、お気に入りデバイス Oculus Questと組み合わせます。
2.5mの分解能で宇宙から標高を計測する、ALOS-PRISM。Tellusの開発環境、Jupyther Notebookを使って富士山付近のデータをエクスポートして、VR表示しました。


VR fujisan
マイクラでリアルなマップを再現したい夢、データとプログラミングを使えば簡単に叶います!

作り方
1. Tellusに、Jupyther Notebook か Jupyter Lab を利用申請。
2. 富士山の位置のメッシュを調べる。(タイル座標確認ツール
3. Jupyter Notebook上、Pythonでプログラムをかく

TOKEN = "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx" import os, json, requests, math from skimage import io from io import BytesIO import matplotlib.pyplot as plt %matplotlib inline def get_image(zoom, xtile, ytile, opacity=1, r=3, g=2, b=1, rdepth=1, gdepth=1, bdepth=1, preset=None): sname = "aw3d30" url = "https://gisapi.tellusxdp.com/{}/{}/{}/{}.png?opacity={}&r={}&g={}&b={}&rdepth={}&gdepth={}&bdepth={}".format(sname, zoom, xtile, ytile, opacity, r, g, b, rdepth, gdepth, bdepth) if preset is not None: url += '&preset='+preset headers = { "content-type": "application/json", "Authorization": "Bearer " + TOKEN } r = requests.get(url, headers=headers) return io.imread(BytesIO(r.content)) img = get_image(10,906,404) io.imshow(img)

富士山の標高データが画像で表示されます。
4. RGB値が最高になっているようなので、最大値を求めてみる(きっともっとシンプルに書けます)

max = 0 for d in img: n = (d[0] << 16) | (d[1] << 8) | d[2] if n > max: max = n print(max)

結果

12766

富士山の高さは3766mなので、9000ずれた1m単位だと推定。 5. 試しにテキストで表示してみる

for y in range(256): for x in range(256): d = img[x,y] n = (d[0] << 16) | (d[1] << 8) | d[2] n -= 9000 n /= 4000 n = math.floor(n) print(n,end='') print()


それっぽい。
6. JavaScript用に配列データとして出力

h = [] for y in range(256): for x in range(256): d = img[x,y] n = (d[0] << 16) | (d[1] << 8) | d[2] n -= 9000 h.append(n) print(h)

このデータを、fujisan-data.js として保存して、JavaScriptでWebVRを使ったVRアプリをつくって、できあがり!

<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>VR fujisan - data by Tellus</title> <script src="https://aframe.io/releases/0.9.2/aframe.min.js"></script> <script src="https://fukuno.jig.jp/app/webvr/fujisan-data.js"></script> </head> <body> <script>"use strict" window.onload = function() { var scene = document.querySelector('a-scene') const r = 1 const rw = 4 // sampling rw * rw const bw = 256 // org data sampling w and h const w = bw / rw let map = [] for (let i = 0; i < w * w; i++) { const x = i % w const y = (i / w) >> 0 const p = x * rw + y * rw * bw const n = HEIGHT[p] map[i] = n } for (let i = 0; i < map.length; i++) { const x = i % w const y = (i / w) >> 0 const h = map[i] * 0.0005 let box = document.createElement('a-box') box.setAttribute('position', { x: (x - w / 2) * r, y: h / 2 * r - 7, z: (y - w / 2) * r }) box.setAttribute('depth', r) box.setAttribute('width', r) box.setAttribute('height', r * h) scene.appendChild(box) } } </script> <a-scene id="scene"> <a-sky color="#000000"></a-sky> <a-light color="blue" position="1 0.1 0.5"></a-light> <a-light color="cyan" position="0.1 4 2"></a-light> </a-scene> </body> </html>

縮尺は適当なのでリアルな富士山ではないですが、これで怪獣や巨人になった気分で富士山付近を歩けます。
VR x Tellus、楽しいですよ!

links
- VRではじめる現代HTML入門 - Oculus Quest x 福井高専生
- 50行で作るVRマイクラ風 / boxcraft for Oculus Quest with A-Frame
- モバイル時代こそバス! つつじバスロケVRビジュアライズ - リアルタイムオープンデータ x Oculus Quest
- 異次元の分かりやすさ、触って学ぶVR数学、ベジェ曲線編 on Oculus Quest

Tweet
クリエイティブ・コモンズ・ライセンス
この作品は「Creative Commons — CC BY 4.0」の下に提供されています。
CC BY / @taisukef / アイコン画像 / プロフィール画像 / RSS