月別アーカイブ: 2018年1月

新しい暮らし方

新しい言葉の多用

生産性革命人づくり革命働き方改革の言葉が躍っています。かつては革命などという言葉は革新勢力が使うのが一般的でしたが、このごろは保守の本家本元の旗振りにより高らかに響き渡っています。

これらの積極的な行動が若い世代から評価され、世論調査では高い支持率に表れているようです。

古典的な革新勢力に元気がない、魅力的な人材が集まらない、仲間割れで足の引っ張り合い、守旧派には知恵者がそろっている、分け合えるパイを持っている、勉強熱心な人材がいるということが言えるかも知れません。

働き方が見直されて、古い大勢から脱却して改革に着手された業界、会社では長時間労働から解放され自由に振舞える時間が増えています。

多様な価値観

昔、大昔は『一つのことに秀(ひい)でていれば万事に通ず』、『一芸は百芸に通ず』などと喧伝されました。

一つのことが名人クラスになれば、他のことは大目に見てもらえるという余裕があったように思います。

民主化以前に、剣の達人ならば身なり服装に関わらず尊敬されたことでしょう。

ところが今では巨匠、千両役者、大家(たいか)といえども不潔・粗野・慮外な人は評価されにくいです。

一方、イケメンで主役を張っている俳優が料理もうまく話し上手だったり、雄弁なアナウンサーが気象予報士の資格を持っていたり、一芸だけではアピール度がイマイチの時代が到来しているのだろうか。

時間に余裕が出てくると多様な価値観が認められやすくなります。

新しい生き方

ひたすら、ひたむきに、脇目も振らずなどそのことだけ一心には、もう評価されないのだろうか。評価されないことはないでしょうがなにか時流に乗ってない気がします。それだけ、世の中が複雑多岐になってきてもっと総合的な、より最適解に近いものが求められているのでしょう。

長時間労働は短期間の緊急避難策であるべきです。店じまいセールを長期間にわたって営業したら笑いものです。いつまでも、「赤信号みんなで渡れば怖くない!」は通用しません。

時間に余裕ができたら、専門外の分野に心を砕くのもいいのではないでしょうか。自分にないものを持っている人との交流は得るものが多いと言われています。Javascriptの世界もなかなかのものですよ!

お山の大将は所詮、狭い領域の事柄です。『たかが井の中の蛙、されど空の高さを知り、やがて大海を知る』になりたいものです。

クリッピングをマスター

長年の課題

複数のピースを一枚にまとめ集合画像にしたとき、クリップして部分的に表示することができず悩んでいました。今回、以下のような2行5列にまとめた10枚の動物の画像を1枚ずつ表示できたので備忘録として残します。 img要素にposition absoluteを指定し、clip:rectにより取り出すエリアを設定し、位置のずれをtopとleftによって調整して期待した動作を得ました。今回、clip領域を計算により決定せずに、泥臭い方法ながらテーブルを参照する方式に変えたところ思うような動作になりました。以前はcanvasのdrawImage関数を用いて切り抜けていましたが、canvasに頼ることがないので積年の悩みが解消しました。以下にコードを示します。

サンプルコード

<html>
<body>
<button onclick="setClip();">開始</button> <span id="num" style="color:red">&#x24ff;</span>
<span style="font-size:10px"> &copy;TacM,2018 Ver0.01</span><br />
<div style="position:relative; width: 750px; height: 300px; border: 0px solid gray;">
<img id="sample" width="750px" height="300px" style="position:absolute; top:-150px; left:-300px;
 clip:rect(150px,450px,300px,300px)" src="http://aidesign.lolipop.jp/wp-content/uploads/2015/08/animal10.png">
</div>
</body>
<script type="text/javascript" charset="Shift_JIS">
const SUJI = "\u24ff\u2776\u2777\u2778\u2779\u277a\u277b\u277c\u277d\u277e";	//0123456789
const rectT=[
'rect(  0px, 150px, 150px,   0px)', 'rect(  0px, 300px, 150px, 150px)',
'rect(  0px, 450px, 150px, 300px)', 'rect(  0px, 600px, 150px, 450px)',
'rect(  0px, 750px, 150px, 600px)', 'rect(150px, 150px, 300px,   0px)',
'rect(150px, 300px, 300px, 150px)', 'rect(150px, 450px, 300px, 300px)',
'rect(150px, 600px, 300px, 450px)', 'rect(150px, 750px, 300px, 600px)'];
var v=0;
var p = document.getElementById( "sample" );

function setClip(){
 console.log("V="+v+" : "+rectT[v]);
 document.getElementById("num").innerHTML=SUJI.substr(v, 1);
 p.style.clip = rectT[v];
 p.style.left = -(v%5)*150+'px';
 p.style.top = -Math.floor(v/5)*150+'px';
 if(++v < 10) setTimeout(setClip, 1000);
 else v = 0;
}
</script>
</html>

動作結果

   ©TacM,2018 Ver0.01

ユニバーサルデザインの始まり

バリアフリー

はるかふた昔以上も前に、バリアフリーという言葉がはやりました。バリア(barrier)とは垣根、フェンス、障害、障壁との意味であり、バリアフリーは「そこから自由な」との意味合いで、障壁のないとか障害を感じさせないなどの意味に使われてきました。

もてはやされたバリアフリーという言葉もいまでは、ユニバーサルデザインにとって代わられました。両者の違いはバリアフリーが障害・障壁を除去するという意味で使われるのに対して、ユニバーサルデザインは、できる限りはじめからバリアのないデザインを心がけるという考え方です。

すべての人にやさしい設計

当方は福祉や建築設計の専門家ではないので、ユニバーサルデザインの本質に触れることはできません。

工場の製造ラインでたとえば、五品種ほどの組み立て部品が流れる工程において、弱視や耳の不自由な方のために標準工程に何を追加したらよいかを考えてみました。

目の不自由な方には、動物をかたどった大きめのイラストと品種を寄り分けるための音声を追加しています。

製造ラインで品種を音で知らせる

耳の遠い人、弱視の人など体の不自由な方でもちょっとした工夫で健常者と同等の作業が可能になります。製造ラインの流れ作業において、体のハンディキャップを乗り越える代替策を例に挙げます。

昨今の製造ラインは作業員が直接、手を下すことは少なく異常が発生した時に適切な処置を施すことが多いことでしょう。今回の例では音と画像で知らされた注文者の希望を製品化しています。

スモールチェンジ

原材料の高騰が影響

最近、物の大きさがいつの間にか小さくなっています。これは原材料が高騰したのに価格に転嫁できずに、事実上の値上げをもくろんだ結果です。先刻、NHKが特集で報じていてその現象を《スモールチェンジ》と名付けたと語っていました。

嵩を少なくすることで材料費を抑えています。質を落としたり、水分の量を増やしたりして経営を続けている様は努力を認めつつも、いじましさも感じます。商品本体のサイズを変えると包装紙や箱のサイズも変更になりますがそこは端折って手を付けないことが多いようです。全体の積み荷サイズは変わず輸送費の節約につながらないので付け焼き刃的施策と言わざるを得ません。

インスタントコーヒー、納豆、菓子などは一様に小さくなっています。ハムなどはサイズが不変ながら枚数が少なくなっています。しゃけの切り身、ちりめんじゃこ、キャラメルなどはスモールチェンジがしやすく、インスタントコーヒー、尾頭付き魚、野菜などは知恵を絞ることになります。

知恵の絞り方

値上げせずに利益を維持するには、クラスを下げざるを得ません。尾頭付き魚や果物は小さなサイズ、野菜は半切り、贅沢付属品は削除などの方法があります。

スーパーでこれらが一気に始まったときは、行政がこの地区を低所得者特区に申請したのかなと疑ったほどです。

乾電池の本数を減らし全体の価格をちょっぴり下げる方法は巧妙な値上げです。納豆付属品の練りがらしは前よりは水っぽくなっています。作る側からも「水の味しかしない豆腐」に疑問を呈する声が挙がっています。

やむを得ぬ策か

スモールチェンジの傾向は食品だけかというとあらゆるところに蔓延しています。初詣祈願の祈祷札についてくる縁起物が年々、小さくなっています。実質的な値上げが統計上に反映されないので、いつまでもデフレ状態から脱却できず消費者心理に悪影響を及ぼしているのではないだろうか。

値上げあるいは実質値上げになって消費者として負担を強いられているのなら、せめて経済の統計に貢献したいと考えるのは庶民のほのかな願いといえましょう。

生活防衛と根本対策

図書館の電球なども3個使いが2個になっていたり努力がうかがえますが、公営住宅や道路の街灯はかなりの照度にならないと消えない古いタイプです。雨模様で暗い日には日中でも点灯しています。

水道管、橋などインフラの寿命がやがて一斉にやってきそうです。高度成長はうたかたの夢と考え、地道な生活防衛を迫られています。

QRコードの新境地

QRコードの利用例

QRコードはあらゆるところで利用されています。ここで取り上げることは新しくも珍しくもないことでしょうが、新参者にとっては語るに価値がありと、いまさらながらスポットライトを当ててみました。

QRコードが世に出たころはまだ、インターネットが普及途上にあったので当時は基本的な利用方法のような気がします。今はあらゆるものがインターネットにつながる時代であり、昔とは趣きが異なることでしょう。

QRコードの新機軸

以下の実行例は10個のQRコード画像を読み、取り出された文字列をJavaScriptスプリプト言語処理系が解釈して表示しています。文字が赤色で表示されたり大きなサイズになるのはspan要素で指定されているからです。あくまでもQRコード画像の色は単色です。

たとえば、小林一茶の俳句は以下のような文字列から成っています。そのほか、メッセージが左右にスクロールしたり、イラストが左から右へ流れて描画されるのはJavaScriptのMarquee要素(タグ)によります。

めでたさも<BR>
 中くらいなり<BR>
  おらが春<BR>
   <span style="font-size:11px;">小林一茶</span><BR>

開始ボタンをクリックしてスタートです。

QRコードリーダー ©TacM,2018 Ver0.15 
認識名称:
QRコードサイズ:FileSize   進行
読み取り結果
 日本語サポート

 

二十四節気のアンカー

もうすぐ大寒

二十四節気は立春から始まり大寒で終わりになります。1月20日~2月3日の期間を大寒と定めています。一年で最も寒い時期です。

2月は如月、着更着と言われ、着物を更に着重ねる意味がありますが2月の頃には寒さにも慣れ、やはり大寒の頃が一番寒く感じられます。

季節の風物

1月の行事として、七草がゆ、成人の日、鏡開き、どんど焼き、藪入りなどがありましたが、下火になったり、中身の変貌と様変わりしています。

女性の成人を狙い撃ちしたような悲しい詐欺事件が起きました。少子化のあおりを受けて2~3年前から成人式の着付けを予約していたようですが、やはり危惧が現実のものとなりました。

性善説は限界か

仲間の飲み物に異物を混入させたり、立派な建物の中で商売している会社が詐欺行為をするこのごろです。

ちょっと古くなりましたがザ・ガードマンというドラマが登場して人気を博し、セキュリティーをサービスする警備会社が大企業に成長している時代です。

性善説はとっくに崩壊しています。おちおち、知り合いでも信用することはままならなくなっています。

企業間の競争が激しくなって、消費者の青田買いのような雰囲気が強くなっています。早割、早得の名のもとに大きな割引率で客を惹きつけています。

かつてある定期購読本を5年契約で読んでいましたが、景気低迷で本のページ数が年々、少なくなり年ごとに充実した内容を期待した側として納得いかないものがありました。

一生に一度ということで晴れ着の予約に何十万円という金額を事前に渡し、信用だけが担保というのは危険極まりないことです。

冬の食べ物

今年の冬は殊の外、野菜の値段が高く鍋料理の回数は多くありません。白菜は柔らかい触感で、海のミルクと言われている牡蠣との相性も良く、寒い冬にはうってつけです。しらたき、湯豆腐にかつお節をまぶして日本酒で温まりたいものです。

QRコードリーダー

日本語QRコード

hyper.gear.comから引用

QRコードの発祥地の日本として全角文字を自在に扱える技術を調査していました。

これらはとっくの昔に開発されて商品化され市場に出回っています。ただ、この状況は先頭を走っているごく一部のフロントランナーだけの秘伝になっているようです。

ここでは、すでに公開されている技術を寄せ集めて短歌や俳句をQRコード化して楽しむ方法をまとめています。

詳しい規約

商品には仕様が示され、商品開発の規約や制度は万人に公開されるのが原則です。

それらの原文は英文だったり有料だったりし、かつ、中身が実態を反映してなく時代遅れになっている場合があります。

それを言い訳にして原文を読んでないことが多くなります。そのため、何度も動作を繰り返して実態をつかみ現状に合わせています。

日本語表示例

ここでは4つのQRコードを読み込み、コードを解析して識別した内容を表示します。最初の2つはURLアドレスをQRコード化しており、全角文字は含まれていません。後の2つは俳句を題材にしていて漢字のほか全角のスペースと改行コードが含まれています。

残念ながら画像データは含まれていませんが致命的ではありません。なぜならば、共有のアルバムに登録したURLアドレスを載せれば画像を描画できるからです。よって、間接的ながら画像をQRコード化できるといっても過言ではないでしょう。

開発のあれこれ

1.全角文字を含むQRコードでは画像サイズが小さいとエラーになりやすい。
2.QRコード収納文字数により、デコードのキャラクタタイプが異なるようだ。
3.収納した文字数が多くなるとUTF-8からデータ数の少ないShift_JISになるようだ。
4.複雑なJavascriptタグは正しく動作しないことがある。
5.IE11を含むモダンブラウザで動作することと思われる。
6.読み込んだ文字がhttpから始まる場合、クリックすればそのページにジャンプ。

動作例

QRコードリーダー ©TacM,2018 Ver0.12 
進行 x y
認識名称:
QRコードサイズ:FileSize
読み取り結果
 日本語サポート

 

QRコード探求版

伸び行く若者

疲れを知らない子供のように…は「シクラメンのかほり」の一節です。歳を感じさせない昔の青年も存在します。「歳を重ねたらいたずらに若ぶらずに、盆栽や写経などに没頭すればよいのだ」という意見もあります。

世代交代は必要です。長年にわたって築き上げたことを灰にするのはもったいない、かっこよく言うならば次の世代に引き継ぎたいというのは最後のあがきでしょうか。多くのことを吸収できる小中学生に期待しましょう。

QRコード探求の始まり

QRコードを巡る様々なサポートは飽和状態になるほどに出回っています。しかしながら、自分の引き出しのなかに理解した技術として蓄積されているとは限りません。今回、JavaScriptプログラミングの一環として、動く物体に貼られているQRコードを読み取って表示する例を考えてみましょう。

QRコード解析方法

指定した文字列からQRコード画像を自ら作るサンプルコードはGithubから容易に入手することができますが、今回、WebサイトでサービスされているQRコード画像を作るサービス—QRコード作成 CGI’s『ご入力いただいた文字列のQRコードを作成する』を利用しました。

指定されたテキストボックスに URLやメールアドレスなど任意の文字列を入力し、作成ボタンをクリックして取得しました。

『誰やらが 形に似たり けさの春』という芭蕉の句は左図のようになります。一般的に使われる全角文字もコード化することが可能です。正確にエンコード・デコードされないものが出回っていますが、漢字圏に身を置くものとして早めのマスターを心がけたいです。
  1. 上記サイトから設定した文字列のQRコード画像を4個、用意する。
  2. jqueryソースコード(jquery.min.js)をインクルードする。
  3. githubから20個近いmegapix-image.jsなどのQRコードサポート関数群を入手してインクルードする。
  4. ベルトコンベア、小車、大車の画像を作る。
  5. 画像ファイルをサーバーのアップロードする。
  6. 指定されたファイルをimg要素でQRコード画像を読み込む。
  7. 読み込んだ画像イメージをCanvasに設定する。
  8. Canvasを利用してBase64コードに変換する。
  9. Base64をQRコードにデコードし、文字列を抽出する。
  10. 抽出した文字列を解析結果として表示する。
  11. クロスオリジンエラーをクリアするため、オプションパラメーターに「-allow-file-access-from-files」を指定してChrome.exeを立ち上げておく。
  12. Chromeならば、–disable-web-security –user-data-dirのパラメータも指定する。立ち上げ時にエラーメッセージが表示されてもこれを指定しないと思い通りの実行になりませんでした。

 

動作ブラウザの情報

動作可能なブラウザは今のところ、Chromeだけです。その上、ローカル環境では思い通り動作するのに納得いかない処理があり、QRコードを貼り付けた物品がベルトコンベアに乗って移動する部分は残念ながら描画されません。また、漢字は文字化けが起き正しく表示されません。時が解決してくれるかも知れません。

動作例

QRコードリーダー©TacM,2017 Ver0.02 
進行 x y

認識名称:
記載内容:

 

進化と人間の幸福

科学の進歩とうぬぼれ

技術や医学の進歩は必ず幸せをもたらすと長い間、信じ続けてきましたが「梅棹忠夫」の著作に触れて、そうでもないぞと思い知らされました。

身近かな例では、伝染病の予防薬や治療薬・抗菌薬の開発は健康対策に大きく貢献しているので、化学・科学の発展は無条件で人間に幸せをもたらしていると考えがちです。

科学の発展により、細菌兵器、原爆などの大量破壊兵器以外にも様々な問題が噴出しています。人生は長く複雑です。だから僧侶、牧師、哲学者に教えを乞うことになります。

科学の進歩と人類への貢献はひとまず置いておくことにします。

技術進歩の一例

駅のホームから目の不自由な方が転落する事故は後を絶ちません。ホームドアの設置はまだ、限定的です。JR山手線はだいぶ前に設置されましたが経営的に余裕のない路線へは設置はゼロに近い状況です。

電車の車両数、ドア数(1車両当たりのドアの数)などに違いがあり、ホームと発着する車両との同期を取ることに難しさがあるようです。

電車がホームに入ってきて止まった位置の前のホームドアが開くように制御されなければなりません。

これを制御するホームドアはかなり高額な装置になっていたところ、電車のドアにQRコードを貼り付けてホームドア側のカメラで制御するシステムを開発し、小予算で安全性に貢献できるというニュースを目にしました。

QRコードを追いかける

QRコードの活用で、各駅にホームドアが設置されるようになれば、安全な鉄道利用におおいに寄与することでしょう。

以下の8枚の図は、URLアドレスのQRコードを時計方向に30度回転させ、検出する位置により、デコード解析が成功するかどうかを調査したものです。

項番 解析:成功・失敗
0 -71 -40
1 -81 -50
2 -91 -60
3 -101 -70
4 -111 -80
5 -121 -90
6 -131 -100
7 -141 -110

考察

8個のテスト結果から判断すると、検出位置により期待した結果が得られるものとそうでないものがあります。スーパーのレジなどでは正しい検出が得られるまで繰り返すことにより、問題を解決することができます。どの場合も再現性があるので状況に応じた対策が得られるでしょう。