月別アーカイブ: 2019年7月

喫緊の安全対策

実施の優先順位

科学の発展が無条件に人間を幸福にしているわけではありません。利用の仕方が間違っていたり、応用することを躊躇していれば宝の持ち腐れです。車の追突やアクセルとブレーキの踏み間違いによる事故が後を絶ちません。

最近、農薬散布のヘリコプターが高圧電線に引っ掛かり墜落した事故が報道されています。高圧電線は急に設置されるわけでなく、設置場所の位置や高さは安定した情報です。

この情報をヘリコプターの運転者が共有していれば事故は防げるはずです。GPS技術が導入されてかなりの時間が経過した今、電線は運転者には見えにくくてもそれをサポートするシステムの構築が難しいとは思えません。

地下に埋設されている電線、通信ケーブル、ガス管、上下水道管が映し出される画像システムが稼働しています。

雪国における右図のようなスノーポールも運転席の画像に映るようになれば実際のポールは必要なくなるかもしれません。

車載カメラが大衆価格で設置できる時代です。

車に較べて高額なヘリコプターに危険物感知あるいは危険物に接近した情報を発信する装置を搭載するのは容易に実現可能と推測します。

車の自動運転だけがクローズアップされています。船舶なども含めた交通安全対策が実現されるように期待します。

経営者、国のリーダーは目先の利益だけを追求せずに高所大所からの判断を迫られているようです。

変わることへの力

変遷の歴史

コンビニの24時間営業がようやく見直されるようです。時代時代に合わせて変わる体力がないと取り残されます。人口集密地はいうに及ばず過疎地でも一律に24時間営業を強いられるのは理不尽です。

都市部では遅い時間のサービスは割高ですが、地方では行きかう人がまばらになる遅い時間のサービスは逆に割安になっています。それを全国一律に営業体制を守らせるのは実情にあっていません。

24時間戦えますかのキャッチコピーが一世風靡しました。その間、石油危機が複数回訪れ、時の副総理がアラブ諸国を訪問し油乞い外交を続けて国難を切り抜けました。一方、テレビ放送ではNHKが23時終了、民放放送は24時終了のやむなきに至りました。そうやって厳しいエネルギー政策を実行したのに、《喉元過ぎれば熱さを忘れる》で24時間営業につながりました。

数度のオイルショック

言いふらされた化石燃料の枯渇

石油は後、50年ほどで枯渇すると学校で習った人が多いことでしょう。その後、鉱物資源の探索技術が向上しその考えが退けられました。また、石油代替エネルギーが研究されて話題に昇るのも少なくなりました。急に枯渇するのは困りますが、化石燃料の枯渇はすでに織り込み済みなのです。

それはバラ色から始まった

政策は複合的要因で変わります。ソーラー発電への補助金も期限付きです。誰もが投機的行動をしているわけではありませんが、過当競争が業界全体を衰退させることはよく耳にすることであり、時代の趨勢を見守りながら変わり続けることが大切のようです。

日本30著名観光案内

日本訪問客の推移

我が国を観光目的で訪れる外国人が増えています。化石燃料や鉱物資源を持たない国にとっての観光事業の隆盛はありがたいことです。訪日国別では韓国、中国、台湾、香港、タイ、シンガポール、マレーシア、インドネシア、フィリピン、ベトナム、インドなどのアジア近隣諸国がほとんどです。2020年東京オリンピックを控え、ますますの増加傾向が想定されます。

外国人観光客の目は地方へ向いている。これからのインバウンドは地方部が主役になる! https://chugokugo-sekkyaku.com/inboundchihou/ を引用

以前にJapanese thirty big tourist spot gameをお届けしましたが、このたび、英語文を増やして紙面をリニューアルしました。退屈な方にはゲームで運試しをしながら地図を見て観光地を確認してください。

日本30著名観光案内

Click to announceをクリックしてお楽しみください。

 

 

梅雨さむストップ

太陽を求む

記録的な日照不足です。何事も極端はいけません。そろそろ梅雨も明けてもらわないと困ります。

 

7月の風物詩

梅雨明けを待望

から梅雨ぎみでしたが、各地で災害が起きるほど雨が降りました。ここにきて、日照不足で野菜が高騰しています。そろそろ、梅雨が明けて欲しいです。

ギンギンギラギラの暑さがやってくるのは判っていますが、こうも梅雨寒むが続いては耐えられません。

波と太陽

海の日

もうすぐ海の日です。浜辺ではかき氷よりラーメンが売れるのでしょうか。

《冬は寒く夏は暑い》、商売にはこれが一番と言われています。願いを込めて、早めの風物詩をお届けします。

夏休み、お盆前の3連休です。有意義に使いたいものです。

先日、病院に行ったら、8/11~8/18は夏季休業ですのお知らせがありました。病院が8連休とは思い切ったものです。欧米では1ヶ月の長期休暇は普通ですが、日本もどうやらそのレベルに近づきつつあるようです。

 

プログラミング教育

小学校で2020年から必修

2020年度からプログラミング教育が小学校で必修化されます。最近、プログラミング講座などの広告が頻繁に入るようになりましたのも、必修化の時期が迫ってきているからです。



当ブログではプログラミング教育に直接、携わっているわけでなく頼まれれば協力・応援したいと考えています。学業成績の向上、将来の職業選択に有利に働くなどの近視眼的な気配りは考えていません。楽しくプログラミングを習得することを目指します。

野球、サッカー、音楽などのクラブチームが形成されて久しいなか、文系のクラブが生まれにくいのはなぜでしょうか。私財をなげうって社会に貢献するほどの人材がいない、それを支援するスポンサーが歴史的に育っていないからでしょうか。

興味を喚起

フロントランナーになるほどの力を持っていないものには、関心を惹きつけるような情報を提供するほかありません。

今回は、音楽と画像を組み合わせた映像をショパン作曲のワルツにより実現しました。

楽しみながら学ぶプログラミング

今回のサンプルプログラムコードを最後に掲載します。たったの38行ですがエッセンスが詰まっています。内容は高度の部類に属します。プログラミング教育の必修化を間近に控え、プログラミングに興味を抱いた方は体系づけられた教則本を紐解かれることをお奨めします。

ネット上に山ほど紹介されています。一つの例として上記画像をクリックしてたどり着いてください。画像やサンプルコードが満載です。

ショパンの子犬のワルツ

次の画像をクリックし、さらにBGM開始ボタンを押すと20匹の子犬の画像が描画されます。ショパンのワルツをお聴きの後には戻るキー(←)を押下して戻ってきてください。

『ようこピアノの日々』 youkopiano.exblog.jp ブログを参照

JavaScriptプログラム例

<!DOCTYPE html>
<html>
<body>
<Div style="width:480px; height:90px; font-size:22px;  color:navy; border:0px solid violet;">
<span style='font-size:22px; color:violet;'>ショパン作曲、ワルツ第6番『子犬のワルツ』</span>
<div style="float:left; width:300px; height:55px; color:yellow; border:0px solid red;">
<audio id="bgm" src="http://aidesign.lolipop.jp/wp-content/uploads/2016/07/Chopin-MimuteWaltz.mp3" controls controlslist="nodownload"></audio>
</div>
<div style='float:left; height:55px; font-size:14px; line-height:1.2em; color:navy; border:0px solid gold'>&nbsp;&copy;TacM,2019, Ver0.02<BR>&emsp;&emsp;&emsp;&emsp;&emsp;<span id='num' style='font-size:32px; line-height:1.4em; color:magenta;'>&#x1F338;</span></div>
</Div>
<div style='claer:both; width:480px; border:0px solid red;'><span style='font-weight:bold;'>&nbsp;&nbsp;&#x2B11;BGMスタート</span></div>
<Div style="position:relative; width:480px; height:360px; color:yellow; border:0px solid blue; overflow:hidden;">
<img id="p20" src="http://aidesign.lolipop.jp/wp-content/uploads/2019/07/puppy20.png" width="2400" height="1440" style="position:absolute; top:-1080px; left:-480px; clip:rect(1080px,960px,1440px,480px)">
</Div>
<script type="text/javascript" charset="utf-8">
const SUJI="\u24ff\u2776\u2777\u2778\u2779\u277A\u277B\u277C\u277D\u277E\u277F\u24EB\u24EC\u24ED\u24EE\u24EF\u24F0\u24F1\u24F2\u24F3";// 0   ①    ②    ③    ④    ⑤    ⑥    ⑦    ⑧    ⑨    ⑩    ⑪    ⑫    ⑬    ⑭    ⑮    ⑯    ⑰    ⑱    ⑲
	var j = count = 0;										//開始、停止、再開を制御する変数、 画像番号を制御する変数
var evnt = document.getElementById("bgm");					//BGMのイベントオブジェクト
	evnt.addEventListener('play', function(){				//プレイイベント//console.log("PLAY/PAUSE", j);
	  if(j++ == 0){											//初回ならば、タイマー関数を取り付ける
		var countup = function(){							//一定間隔で子犬の画像を切り替える無名関数
			var p = document.getElementById('p20');			//画像オブジェクト
			var x = count % 5;								//横の配置を制御
			var y = Math.floor(count / 5);					//縦の配置を制御
			p.style.left = -x*480+'px';						//切り取る画像の横の位置
			p.style.top = -y*360+'px';						//切り取る画像の縦の位置
			var r = 'rect(' + y*360 + 'px,' + (x+1)*480 + 'px,' + (y+1)*360 + 'px,' + x*480 + 'px)';
			p.style.clip = r;								//クリッピング
			document.getElementById('num').innerHTML = SUJI[count];	//画像番号を更新//console.log(count, x, y, p.style.top, p.style.left, r);
			if(++count < 20)	setTimeout(countup, 4000);	//終了チェック
		}
		countup();											//画像を切り替える無名関数を起動
	  }
	}, true);												//trueで本来のイベント処理を続行させる
	evnt.addEventListener('ended', function(){count=j=0;});	//再生完了を知らせる//再利用を可能にする
</script>
</body>
</html>

おわりに

上記プログラムでは20匹のワンちゃん画像を集合写真のように一枚にしています。



できれば20個の画像を用意し、画像名を一連番号にして扱えばもっとプログラミングが平易なものになったことでしょう。大きな画像は読込み時間もかなりかかるのでプログラミングが難解になりやすいです。

 

おとなの願い事

かなわぬ願い事

願い事はそう簡単に叶うものではありません。10円や100円のお賽銭で願い事をかなえてもらおうとは虫がよすぎます。

それでも神社仏閣に出向いて祈ることが肝心です。

今日は七夕です。無理なお願いですが永久機関の発明の願い事を図にしてみました。これは不老不死の長寿薬のように無理難題の代表例です。

 

セミコロンの扱い

プログラミング言語の盛衰

一時代を築いた言語にFORTRANがあります。コンピュータへの入力方式が紙カードを前提にして作られたように感じられます。FORTRANのプログラムコードは行の7カラムから72カラムと決められていました。

原則として1行(80カラム)で1つの記述単位にしていました。このような方式を固定書式と呼びます。FORTRANは行という概念から脱することはできませんでした。

これに対しC言語やHTMLは行という概念はなく自由書式(フリーフォーマット)と称されますが、かすかに行を踏襲していると言えるでしょう。自由書式では、行末(改行)はスペースに等価なはずですが、それが少し異なっています。

電子媒体の行の長さは不定であり決められていませんが、80~140桁のように振舞うことが多いです。これはモニタ画面の横幅の文字数に相当します。

JavaScriptの構文

JavaScriptにはがあり、式の最後にセミコロンを付けると文になります。文が複数集まると{}に括られたブロックになります。
式は
a = 12
b = c * d
e = f | 7
最後に‘;’を付けて文になります。
a = 12;
b = c * d;
e = f | 7;
式はif(x*100+y) document.write(“異常発生”); のように文を構成する部品です。式にセミコロンをつけたものを式文といいます。

式;             // 式文であるためセミコロンをつけている

if (true) {            // if文とブロック文の組み合わせ
console.log(“文1”);
console.log(“文2”);
}                // ブロックで終わる文なので、セミコロンが不要

if (true) console.log(true);    // ブロックで終わらない文なので、セミコロンが必要

if (true) {
console.log(true);
}                                                                  // ブロックで終わる文なので、セミコロンが不要

//function式
var myFuncB = function() {
var hen = 10;
return hen;
};                         // ここのセミコロンを忘れると悩みます!

//function文
function myFuncA() {
var val = 10;
return val;
}                                                              // ここにはセミコロンを付けない

var myOptions = {                           // メンバ名変数の初期化
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};                                                           // ここのセミコロンを忘れると悩みます!

自動でセミコロンを付与

上例でセミコロンを忘れると悩みます!の行のセミコロンを忘れても自動でセミコロンを付与してくれるので思うような動作になります。このことをASI(Automatic Semicolon Insertion)と言っています。

ASIは一世代前の固定書式でのみ有効になる考え方です。フリーフォーマットが全盛な時代では文はセミコロンで終わるのが原則であり、ASIの世話になるのは危険です。以下の例題で説明します。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
</body>
<script type="text/javascript">
// メンバ名で参照する変数の初期化
  var request = {                 //ルートポイント
        origin: 0,                //0:0-1]、 始点:読売新聞東京本社前
        destination: 9,           //9:18-19]、終点:箱根・芦ノ湖
        waypoints: [              //経由点
            { location :  3 },    //1、増上寺山門前
            { location :  5 },    //2、鶴見中継所
            { location :  7 },    //3、横浜市こども植物園
            { location :  9 },    //4、戸塚中継所
            { location : 11 },    //5、横浜トヨペット
            { location : 13 },    //6、平塚中継所
            { location : 15 },    //7、小田原中継所
            { location : 17 }     //8、小涌谷駅
            ],
       travelMode: 1024
    };
    document.write("ORIGIN=", request.origin);
    document.write("DESTINATION=", request.destination);
    document.write("WayPoints-0=", request.waypoints[0].location);
    document.write("WayPoints-8=", request.waypoints[7].location);
</script>
</html>

 

ASIが働いて24行目のセミコロンを省略しても動作します。すべての改行を削除し、コードの短縮化や難読化を図ると前後の3行はtravelMode:1024};document.write(“ORIGIN=”, request.origin);になります。これで問題なく動作します。

一方、セミコロンを省略した場合は、travelMode:1024}document.write(“ORIGIN=”, request.origin);となり誤動作します。

さいごに

先人の技術を導入し、自分のコードの中に組み込み動作させ、もっと大きな所作を実現できます。それをコードの短縮化のためにコメントや改行を削除して1行のコードにすると誤動作の憂き目に何度もぶち当たりました。

その体験から記事をまとめました。フリーで使わせていただいて苦情を申し上げるつもりはありません。

セミコロンを省略する派、セミコロンを付ける派と2派に分かれず、フリーフォーマットというすぐれた仕様を採用した先達に想いをはせながら、文法の基本を厳守して必ずセミコロンを付けてもらえたらありがたいと切望して終わりにします。

湯けむり美人

コーヒーブレーク

【栃木の秘湯】を巡る女子旅~”日本秘湯を守る会”おすすめの旅館

2019年も半分が過ぎ2日目です。今日は夏至(げし)から十一日目に当たり半夏生(はんげしょう)です。スーパーにはタコや鯖がところ狭しと並んでいることでしょう。

ここ2~3週間はプログラミングにまじめに取り組んできました。

月替わり、半年経過を記念し恩賞としてゆるやか路線に進んでみましょう。湯けむりの向こうにかすかに浮かぶ影を話題にします。

湯けむり天女伝説

ネットを検索したら、湯けむりをサポートするアニメーションAPIが公開されていました。『プラグインを使わずに湯気のアニメーションを作成』の記事を参考にさせていただきました。

アニメーションのイベントを捕まえる方法がはっきりしないので、setTimeoutで羽衣天女(はごろもてんにょ)の出現とお隠れを制御しました。モーレツに業務に精勤されている諸氏の頭休めにお奨めします。

残念ながら教育的配慮により画面を静止できません。お気に入りの画像はスクリーンショットで!