カテゴリー: JavaScript

巣ごもりDXステップ講座情報ナビを眺める(´・ω・`)-3

作って学べるAI入門

AIの基礎知識の紹介とAI-Plant Bamboo Betaの使い方を紹介するpdfだった。
最新バージョンとpdf内の画像等が異なってる模様。
AIサービス自体はGoogleアカウントでログインした。


以下は画面との相違点や視聴して思った感想の羅列。勘違いして文句を言っている部分もあるだろうけど、( ゚ 3゚)キニシナイ

P17「保存してデータの分析に進む...」の"保存して"が抜けてる。
P18 ポップアップ表示がなかった。
p19 上記の結果として"アヤメの品種データ.csvのデータ分析"となった。
p19 データの可視化で"次元圧縮"が増えてる。
p20 「2.特徴量とラベル列を選択してください。」 "列"が抜けてる
p23 アルゴリズム選択後に表示される[詳細設定]をクリックしないとアルゴリズム一覧は表示されない。
p26-27 おすすめのモデルがSVM(RBFカーネル)だった。
    項目"テストデータ"が追加されてる。
p31の「グラフを作成する」の上のグラフ選択のような行は何に使うんだろう? この段階でグラフにする結果を選択出来る?
p35 "次章「おわりに」でも" "も"は要らなくないかな? 他の箇所でアンケートフォームを紹介してたっけ?

全てが「」で括られているようだが場合によっては『』や""等を併用した方が要素が区別出来て読みやすくなるような気がする?


補足用の動画は最初音がしなくてアレ(´・ω・`)?と思ったが、元々無音なのかこれ。
スライドと違って動画は無音だと凄く見にくいというか情報を理解しにくいな。
何処に次の表示が出てくるかわからないし。これはyoutube側で30秒単位くらいで移動出来るようにしてくれれば、スライド代わりに使えるのにな。

"サイドバーは、データ一覧~があります。" ←若干、日本語としておかしいような…

言いたいことをバーっと羅列してる感じがあって非常に見にくい。必要な情報として教えたいことは明確に上部の文章で説明すべきだし、そうでない場合は省いた方がいいんじゃないかなぁ? そもそも上部の文章に注意が行きにくかったりもするようなw

"データを持っている"や"タイタニックの乗客データ"はこの動画で紹介してる手順とは関係ないんだから、余計な表示はすべきではないような。

特徴量として指定した項目が目的変数として使われるってことはあるのかな? あとは目的変数の方が特徴量列の数を上回ることってあるのかな?
もしそうでないとするならば、ラベル列(目的変数)の選択を先にさせてそこで選択された項目は、動的に特徴量列の欄で項目をグレーアウトにするか非表示にする形には出来ないのかね?
一応特徴量列で選択した後にラベル列で同一項目を選択すると特徴量列での選択は外れるみたいだけど。

混同行列"グラフ"を追加します。←なんだろうね(´・ω・`) "グラフ"が抜けてることを指摘したかったんかな?

丁寧語とそうでない表現が入り混じっていたりしていて統一感が微妙。


なんやかんやとケチをつけたけれども、最初の最初はこういう方がいいのかもね。他の機械学習の講座だと機械学習の知識以外にPython等の言語も覚えなくてはいけなくなるし。こういう既存のAIで機械学習の用語に慣れてからPython等の言語習得に進むのも、人によってはいいかもしれない。

今回のpdfはさわりのさわりだけしか触れてないようだけれども、続刊(?)を出す意欲はあるみたいなので待つとしよう(・∀・)ソシテマタケチヲツケル


LinkedinLearning Web開発者になる

全部で30時間くらいかかるらしい…
観る為にはLinkedinにアカウントを作ってクレカ登録しないといけない。
しかも無料なのは一ヶ月だけと…
早く観終えて無料期間中にLearning Premiumを解除せねばお金取られちゃうヽ(`Д´)ノ

取り敢えずJavascriptまでの3コースを観た…
でもあと14時間くらい残りがあるのか…(ヽ'ω`)

相変わらず適当に残したメモというか感想の羅列に多少の補足をしたものなので、若干、意味不明なところもあるが( ゚ 3゚)キニシナイ


HTML5 基本講座 2015/5

2015年の動画らしい。このコースに限らないのだけれども、このパッケージの内容は2~6年前の物のようだ。内容に問題はないのかもしれないが、Web関連技術という足の早い分野なので、出来ればなるべく一~二年くらいで更新してほしい気がしないでもないw

Bracketsって32bitソフトなんかな?
ブラウザ連携は便利だな。

"やまがたかっこ"って山括弧のことか。

3_1_beforeのformat.htmがafterのものと一緒?

bとemとstrongの違いを理解してなかったわ(ノ∀`)
このブログ、滅茶苦茶太字の為のところに<strong>使ってるww
HTML5から意味の変わる要素 ←全然関係ないがHTMLクイックリファレンス、httpsになってないんだな
em・strong・mark・b要素の違いを本気出して調べてみた

わざわざぐぐって上記のサイトなどを眺めたが、3-5「テキストを強調する」で説明があった。

どうでも良いがエディタのタグ補完は有り難いが、いちいち終了タグを後にコピペしないといけないのは面倒くさい。もっとスマートな補完をしてくれるエディタはないのだろうか。

ヘッディング要素とかいい加減に使ってるわぁ(ノ∀`)

ノンブレーキングスペースと言っているけど、文章ではノーブレークスペースとなっているな。 ってそういう意味で使うのかw 普通に空白として使ってたわ(ノ∀`)

外部サイトへのリンクのところで"http://"の使用について述べてるけれども、ここはもう"https://"の方が一般的になると修正しておいてもいいのかも。

download属性とか初めて知ったわw

dl,dt,ddの記述リストも知らんかった(ノ∀`)

何はともあれ、セマンティック系の知識は中途半端にしか認識してなかったのでその部分ではいい勉強になった(・∀・)


CSS 基本講座 2019/4

講師の野中さんという人はHTML5の講師の沖さんより若干早口らしく、1.75はきついので1.5にしたw それでも速いかも。 そもそも動画サービスの限界というか物理法則的な問題なのか、1.75以上辺りになるとかなり音が潰れるかなんかして聞きづらくなる。

@importなんてそう言えばあったなぁ…
@mediaのメディアクエリってレスポンシブデザインにしようと思ってた時に知ったはずなのに完全に忘れていたわw

存在セレクタと完全一致属性セレクタと部分一致属性セレクタの存在を始めて知った(ノ∀`)
擬似クラス、疑似要素、結合子はぐぐって細切れに使ったことがあったので何となく知ってたけど、明確に名前を覚えてなかったわw

hsl関数での色指定って知らんかった。
でもhsl関数って第二と第三の引数に%をつけないといけないんだ? 実数も取るならわかるけど、取らないなら仕様から%を除去してもええんじゃなかろうか( ゜σ・゚)ホジホジ?

!important構文って、他の言語使いの人から見ると"!"が否定演算子に思えるので<aside>的なものに見えてしまうかもw

!importantを複数使った場合はやはりソース順で値が上書きされるんかな? ←後で説明があったが、されるとのこと

「cssボックスにプロパティを定める」でmainにmarginを2つ設定? 後で気づいてpaddingに直したけど、ちょっと前のaの入れ忘れ同様にこういうのは撮り直すべきではなかろうかw?

background-clipは初めて知ったわ。

これまた細切れだった知識が前よりかはつながった感じがした(・∀・) ←但しすぐ忘れる模様

エクササイズファイルの内容が完成形というか最終形のsample.htmlのみなので、演習的に手を動かすことはなかった。html5の講座のようにbeforeとafterでファイルを用意しておいて欲しかったな。せめて同一ファイル内に未完成バージョンを入れて、その下に完成形をコメントアウトして貼り付けておくとか。

html5の講座の方はbeforeとafterのhtmlが用意されていたのは良かったけど、フォルダ名を"1_before"や"2_after"というようにしてbeforeのフォルダが上に来るようにしてくれるともっと良かった。気分的な問題なんだけどw←いちいちうるさい注文をつけたがる(・∀・)


JavaScript 基本講座 2019/4

チャプタークイズの関数定義の答えで、"そして波括弧、中括弧の中に"とあるけど"波括弧(中括弧)"という表記にした方が良いかも。"やりたいコード"も"行いたい処理"とかの方がいいかな。

関係ないけど

JIS Z 8201-1981 においても「小括弧」・「中括弧」・「大括弧」という名称は廃止され、現在は「丸括弧」・「角括弧」・「波括弧」と表記されている。
括弧について

ということらしい。知らんかったわ。

まあJISなので

そもそもJISは工業標準化法によると鉱工業のためのものなので数学者がこれに従う必要はない、というご意見をいただいた。

ともある。教育とか一般では今も「中括弧」等の名は生きているということなのか。

"という風"は"というよう"の方が良いような。
何となく気の所為かチャプタークイズの文章は若干乱れてるというか丁寧さが失われた表現になっているような気がしないでもない。

「変更したフォーム要素のデータを調べる」でもtimeの打ち間違いを修正したりしていたが…
これはライブ配信したものを流用したのだろうか? それならば許容出来るというか許容せざるを得ないが、普通に撮影したものならば、誤入力~修正部分を撮り直した動画で差し替えるべきではなかろうかと思ってしまう。

確かに個人にとって短い秒数のことなのでどうでもいいと言えばどうでもいいのだが、この先、この講座の動画を観る全ての人達の時間を奪うと考えると何だか非常に無駄な部分に思える。

同様にNASAのデータを使う時に何度も同じことに言及するのも何故なんだろうかと疑問に思った。動画単位では異なるけど、コースであると考えれば一回言えばいいし、それ以上にデータの中身そのものは重要ではないし…


以下もクイズチャプターの問題に対するいちゃもん等。
ごっぐる系の動画を観ていて気づいたが、どうも俺氏は手抜きに思えたり言葉足らずな問題文に突っかかりたくなる性分らしい(ノ∀`)

"問2/5「switch-case文で記述した処理は、そのままにしておくとループしてしまうためbreakという命令を記述して処理を抜ける必要があります」という説明は正しいですか。"で"switch-case文で記述した処理は放っておくと、そのまま下の処理も行われてループしてしまいます。"とあったけれどもループはしないんじゃね? フォールスルーじゃないのか?

"「new任意のオブジェクト名()」"
半角空白を入れて括弧が半角でないと正確ではないような。

"配列から値を取り出す時の構文としてfor文があります。"
この書き方も若干引っかかるな(´・ω・`)

"問5/5 フォーム内の要素を取得するにはdocument.forms で[ ]を指定します。"の説明で"フォーム内の要素を取得するにはdocument.formsでname、つまりフォームの名前を指定します。「document.forms.name(任意のフォームの名前)」のように記述して指定します。"とあったけれども、これだとフォームを指定しているだけでフォーム内の要素を取得する前段階の話になるような…

4-1
sample.html const側かlet側をコメントアウトしないと駄目。

チャプタークイズ1
constじゃなくてletの方が良いような。原則としてconstを使えと言ってもそれは作法的なものであって、varに対応するものはletなんじゃないのかな? 違うのかな(´・ω・`)?

"ドキュメント内の[]要素の上にペーストします。"って問題もなんかな。必ずしも最初の段階で<script>要素が存在しているわけじゃないし。

"Javascriptでクラス名の先頭は大文字にする決まりがある。"
決まり…なのかな……"推奨されている"とか"一般的"…くらい?

Promiseはにわかには理解し難かったので、ぐぐって説明ページを眺めたり。
Promiseを使う
とほほのPromise入門 ←"の方が多様されます。" キーッヽ(`Д´)ノ

8 sample.html タイトルがtetch()になってる

fetchの返り値のreponseが解決されるまでPromise?みたいなのはなんか理解しにくいわ(´・ω・`)
つーかきちんと理解してないw

asyncとawaitの説明まで観たけど、やっぱこの超変態言語やべぇな…( ;・´ω・`)ゴクリッ

"オブジェクトの形式を基本にした定め方"…定め方という言葉がしっくり来ないな…定義?

取り敢えずつまみ食い的にしか読んでいないパーフェクトJavaScriptを読み直した方がいいなと思った(ノ∀`)


ここからAngularやReact、vueの動画を観続けるわけだが、Angularの環境構築でなんか上手く行ってるんだか上手く行ってないんだかわからず、時間がかかるかもしれないので、取り敢えずここまでをエントリ化した。

あと21H1がリリースされたらクリーンインストールもしたいんだよなぁ…
そうすると環境構築をし直さないといけないんだよなぁ…
どうしようかなぁ(´・ω・`) 

5/10リリースという記事もあったのに、5/11になってもまだ出て来ない…

覚書 : jQueryを用いた埋め込みデータ表示

きっと未来の俺氏はいつものように過去にやったことをほぼほぼ全部忘れてしまい、「これ、なんだったかのぅ("・ω・゙)」となるに決まっているので、自分の為に覚書を残す。

デザインやらコードやら、色々と手直ししたいところはあるものの、取り敢えずこれでいいか。

このデータ埋め込みだと、コードをそのままコピペすることも出来るし、コメントも埋め込めるので視認性は良いかなぁと思うのだけれどもどうかなぁ…(´・ω・`)

cssでも実現可能なら、いずれはcssのみで実装したいところではある。


disp
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf8">
<meta http-equiv="content-style-type" content="text/css">
<title>embedded_data</title>

<style type="text/css">
div#disp {
white-space: nowrap;
border: solid 1px #808080;
width:100%;
height:150px;
padding: 0.5em;
line-height: 1.8em;
overflow: auto;
background-color:#eeeeee;
}

div#code {
white-space: nowrap;
border: solid 1px #808080;
width:100%;
height:250px;
padding: 0.5em;
overflow: auto;
background-color:#dddddd;
}

.ml-1 {
margin-left: 20px;
}
.ml-2 {
margin-left: 40px;
}
.ml-3 {
margin-left: 60px;
}
.ml-4 {
margin-left: 80px;
}

</style>
</head>
<body>

<div id='disp'>disp</div>

<div id='code'>
<span id='d1' class='dc'>aaa</span><br>
<span id='d2' class='dc'>bbb</span><br>
</div>

<div>
<span id='d_d1' data-con='aaa'></span><br>
<span id='d_d2' data-con='bbb'></span><br>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type='text/javascript'>
jQuery(function () {
let orgColor;
$('span.dc').hover(
function () {
orgColor = $(this).css('color');
$(this).css('color','red');
var id = '#d_' + $(this).attr('id');
$('#disp').html($(id).attr('data-con'))
},
function () {
$(this).css('color',orgColor);
}
);
});
</script>
</body>
</html>















おい、あっち側かよヽ(`Д´)ノ

ゼルダの伝説 ふしぎの木の実 時空の章をクリアしたヽ( ・∀・)ノ

レベル8のラスボスの最終形態の倒し方のみ分からなくて攻略を見てしまった(ヽ'ω`)
だって伸びてる方は掴めなかったから、てっきり違うのかと…(´;ω;`)

まあそれ以外の謎は自力で解いたので良しとしよう。

このゼルダはジャンプが出来るので良かった。
無駄にジャンプして移動するのが好きなので(・∀・)

まだ大地の章をクリアしてないので詳しくぐぐってないのだけれども
カプコンゼルダの裏話とか早く読みたい。

しかしちょっとゼルダ疲れが…(ヽ'ω`)


塗り潰しツールだけでもつけようと思ってハマる。
ペイント・ルーチンで何となくロジックは分かった。

javascriptでのサンプルはないかとぐぐったらあった(・∀・)
JavaScript, Canvas スキャンライン・シードフィル アルゴリズムによる塗り潰し

でも自分のコードで使おうとしたら、うまく描画されない(ヽ'ω`)

更にぐぐったら他のサンプルもあった。
JavaScriptでバケツ塗りつぶし

これは一応描画されるけど、なんか違う色になってしまったり、
何回かやるとエラーになる。これは使い方を間違えてるのかもしれない。
あと何故か塗り潰しが不完全だったりする。これはもしかするとアンチエイリアス絡み?
透明度とかの問題?

画伯によるWeb上で見かけたゴードンのぬいぐるみ写真の模写
gordon01

拡大すると…
gordon02

んーまあ簡易ペイントなのでこれくらいでも良いような気もする…
今週で完成させる予定だったのに、来週になるな…(ヽ'ω`) ゼルダヲヤリスギタカ…

仮面ライダーを観終わった…(ヽ'ω`)

長い戦いだった…_| ̄|○
全98話もあったのでウルトラマンAの時と同じように
最後の方はちょっと流し見っぽくなった(ノ∀`)

ウルトラマン系と違って、なんか時代劇の剣豪みたいな流れがあるように感じた。
戦闘員をバッタバッタとなぎ払う所の爽快感はまさしく時代劇の〆の殺陣だった。

リアルタイムで初めて観た記憶があるのがスカイライダーであり、再放送でも
観たことのない時代の作品だったので色々と面白かった。

wikipediaの仮面ライダーの項に裏話的なものが
結構あって読み応えがあった(・∀・)


本郷猛役の「藤岡弘、」が怪我をして一文字隼人役の佐々木剛が
起用されたのは知っていたが、かなり初期の段階で変わったので
ちょっと笑ってしまった。

佐々木剛がその後の人生が火事を起こしたりして大変だったというのも初めて知った。

FBIの滝和也役の千葉治郎が千葉真一の弟であると知って驚いたΣ(゚∀゚;)
滝が異様に出てると思ったけども「藤岡弘、」の穴を埋めるための
苦肉の策でもあったというのを知り、なるほどなぁと思ってみたり。

緑川ルリコ役の人が良かったのに山本リンダとかに変わってしまって
がっかり(´・ω・`) 山本リンダの話し方というか発声が嫌だった。
ミミーことミミ萩原はなんか美人ではないが何か魅力的な感じだった。

ショッカー戦闘員の衣装は知っていたけどゲルショッカー戦闘員の衣装は
知らなかった。エンディングが逆回しでゲルショッカー戦闘員が飛び上がってくる感じになっていたのは凝ってるなと思った。

ゲルショッカーになってから24回くらい、つまりは2クールしかやってないのはなんでだろう?
もうちょい続ける気があったけど視聴率的な問題があったのだろうか。
短かった所為かゲルショッカーはブラック将軍しか幹部が居なかったな。

少年仮面ライダー隊の通信方法が伝書鳩で笑ったw
読んだことないけど「レース鳩0777」っていう漫画があった時代か。

ちょっと他のを観てからV3を観るか。
仮面ライダーもXからBlackまでが無いんだよな(´・ω・`)
ウルトラマンもタロウから80まで無いのはなんなんだろうか。

※配信終了してるかも


undo
Paintingに以下の2件の記事を参考にしてUndo/Redo機能を追加した。
Undo and Redo with HTML5 Canvas
HTML5でお絵かきツールを作ってみた

無限Undo出来るかなと思ったが、320x240のcanvasを35~36枚くらい
配列に格納した時点で3DSブラウザが灰色表示になって
「メモリ不足です」みたいなエラーメッセージを吐いた(ノ∀`)

余裕を持たせて24回で0に戻るループにした。


もう少しいじったら統合して終わりにしよう…(ヽ'ω`)