2021-04-26
HTMLは、コンピューター言語ですが、プログラミング言語ではありません。

という定説を覆す記事。
「HTMLはプログラミング言語か」問題に終止符を打つ - Qiita
見事にHTMLがプログラミング言語になっていました。


The HTML Programming Language (THPL) を使って、緯度経度の表現 Geo3x3 のエンコードをHTMLで実装してみました。

HTMLはその仕様を自由に提案することができ、いろんな提案によって今日のHTMLがあります。 なので、HTMLが一般的にプログラミング言語と呼ばれる日が来る可能性も十分にあるわけです。

下記が、Geo3x3_encode.thpl.html 全文。Math.floorがないので、除算と引き算を使った関数 floor を定義し、文字列演算がないので、数を10倍しながらエンコードしています。 デコード処理を実現するには、文字列系の関数をいくつかTHPLに足す必要がある気がします。(src on GitHub)

<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width"> <title>Geo3x3_encode in THPL</title> <script src="https://unpkg.com/the-html-programming-language@0.1.0/browser.min.js"></script> </head> <body> <section title="floor"> <footer> <abbr><math><minus/></math><br> <slot></slot><br> <abbr><math><rem/></math><br><slot></slot><br>1</abbr> </abbr> </footer> </section> <section title="encode_loop"> <dl> <dt>lat</dt><dd><slot name="0"></slot></dd> <dt>lng</dt><dd><slot name="1"></slot></dd> <dt>level</dt><dd><slot name="2"></slot></dd> <dt>unit</dt><dd><slot name="3"></slot></dd> <dt>res</dt><dd><slot name="4"></slot></dd> </dl> <dl> <dt>x</dt><dd><abbr title="floor"><abbr><math><divide/></math><br><var>lng</var><br><var>unit</var></abbr></abbr></dd> <dt>y</dt><dd><abbr title="floor"><abbr><math><divide/></math><br><var>lat</var><br><var>unit</var></abbr></abbr></dd> <dt>n</dt><dd><abbr><math><plus/></math><br><var>x</var><br><abbr><math><times/></math><br><var>y</var><br>3</abbr><br>1</abbr></dd> </dl> <footer> <meter><var>level</var></meter> <ruby> <meter>1</meter> <rt><var>res</var></rt> <rt> <abbr title="encode_loop"> <abbr><math><minus/></math><br> <var>lat</var><br> <abbr><math><times/></math><br><var>y</var><br><var>unit</var></abbr> </abbr><br> <abbr><math><minus/></math><br> <var>lng</var><br> <abbr><math><times/></math><br><var>x</var><br><var>unit</var></abbr> </abbr><br> <abbr><math><minus/></math><br> <var>level</var><br> <meter>1</meter> </abbr><br> <abbr><math><divide/></math><br> <var>unit</var><br> <meter>3</meter> </abbr><br> <abbr><math><plus/></math><br> <abbr><math><times/></math><br><var>res</var><br>10</abbr><br> <var>n</var> </abbr> </abbr> </rt> </ruby> </footer> </section> <section title="encode"> <dl> <dt>lat</dt><dd><slot name="0"></slot></dd> <dt>lng</dt><dd><slot name="1"></slot></dd> <dt>level</dt><dd><slot name="2"></slot></dd> </dl> <dl> <dt>flg</dt><dd><abbr><math><lt/></math><br><var>lng</var><br>0</abbr></dd> <dt>lat</dt><dd><abbr><math><plus/></math><br><var>lat</var><br>90</abbr></dd> <dt>lng</dt><dd><var>flg</var><ruby> <meter>1</meter><rt><abbr><math><plus/></math><br><var>lng</var><br>180</abbr></rt> <rt><var>lng</var></rt></ruby></dd> <dt>prefix</dt><dd><var>flg</var><ruby><meter>1</meter><rt>W</rt><rt>E</rt></ruby></dd> </dl> <footer> <var>prefix</var> <abbr title="encode_loop"><var>lat</var><br><var>lng</var><br><var>level</var><br>60<br>0</abbr> </footer> </section> <p><output><abbr title="encode">35.65858<br/>139.745433<br/>14</abbr><wbr></output></p> <p><output><abbr title="encode">35.65858<br/>-139.745433<br/>14</abbr><wbr></output></p> </body> </html>

ちなみに、JavaScriptでの実装はこちら。

const encode = (lat, lng, level) => { let res = "E"; if (lng < 0.0) { res = "W"; lng += 180.0; } lat += 90.0; let unit = 180.0; for (let i = 1; i < level; i++) { unit /= 3.0; const x = Math.floor(lng / unit); const y = Math.floor(lat / unit); res += x + y * 3 + 1; lng -= x * unit; lat -= y * unit; } return res; }; console.log(encode(35.65858, 139.745433, 14)); console.log(encode(35.65858, -139.745433, 14));

いろんなプログラミング言語を見たい方は、こちら75言語で実装した「Geo3x3」をご覧ください。 おなじみC言語から、Scratch、関数型言語の代表LISPなど、違いをいろいろと楽しめますよ。

鳴かぬなら、鳴くのを創ろう!

Tweet
クリエイティブ・コモンズ・ライセンス
本ブログの記事や写真は「Creative Commons — CC BY 4.0」の下に提供します。記事内で紹介するプログラムや作品は、それぞれに記載されたライセンスを参照ください。
CC BY / @taisukef / アイコン画像 / プロフィール画像 / 「一日一創」画像 / RSS