JavaScirpt でマウス座標（位置）を取得する JavaScirpt でマウス座標（位置）を取得方法をメモ。取得する方法は2 種類あるようです。 (clientX, clientY) と (pageX, pageY) の違いと、 (getBoundingClientRect().left[top], getBoundingClientRect().top) …

Git Bash の文字化けを解消してみる 成功したのでメモとして残しておきます。 Git Bash の文字化けを解消してみる 環境 Git Bash 日本語化 文字化け 「?」表示の解決 「豆腐文字」の解決 まとめ 参考リンク

JavaScript で加速度センサーの値を取ってみる motiondevice のイベントで取れる加速度センサーの値を取ってみました。 JavaScript で加速度センサーの値を取ってみる サンプル コード コード解説 X, Y, Z軸 加速度 accelerationIncludingGravity（生の加速…

BinarySearch（二分探索）を可視化してみる BinarySearch アルゴリズムの復習ということで可視化してみました。 BinarySearch（二分探索）を可視化してみる 可視化サンプル JavaScript C/C++ 参考リンク 関連リンク 可視化サンプル 可視化部分には、display:…

JavaScript で位置情報を取得してみる JavaScript の位置情報取得API geolocation を使ってみたのでメモ。 JavaScript で位置情報を取得してみる サンプル コード geolocation について geolocation に対応しているかチェック getCurrentPosition watchPosit…

Canvas に図形を描画し、矢印キーで移動させる 矢印キーを入力したら、clearRect(x, y, w, h) で描画をクリアし、移動した分を描画するというものです。 今回は、キーを入力したら再描画ですが、無限ループやsetInterval(setTimeout) で繰り返し描画するよう…

FileAPI でカメラを起動し、Canvas 上に画像を描画させる File API でカメラを起動し（今のところPC では画像選択のみ）、その画像をCanvas 上に描画させます。 なお、iPhone Safari では、カメラで撮影したような 2[MB]以上の画像は、そのままではCanvas に…

JavaScript でUserAgent を用いた端末判別 UserAgentを使ったモバイル、タブレット、PC を判別するものです。 なお、MDNでは、UserAgent は読み書きできるので、UserAgent による端末識別は推奨されてないようです。 <a href="https://developer.mozilla.org/ja/docs/Web/API/NavigatorID/userAgent" data-mce-href="https://developer.mozilla.org/ja/docs/Web/API/NavigatorID/userAgent">window.n…</a>

heroku コマンドで「Your version of git is X.X.X.. Which has serious security vulnerabilities.」という警告の対処 heroku コマンドを打ったところ、以下の様な警告が出た。 単刀直入に言うと、msysgit のversionが古くてセキュリティ的によくないらしい…

FileAPI で画像を読み取り、Canvas 上に画像を描画 FileAPI で画像を選択またはドラッグ&ドロップで画像を表示 - はしくれエンジニアもどきのメモ の時は、<img> タグで画像を表示させてましたが、今回は、FileAPI で読み取った画像をCanvas 上に表示させてみます…

無料で学べる 統計・R・機械学習・データマイニング まとめ 無料で学べる統計関係の資料をまとめておきます。 無料で学べる 統計・R・機械学習・データマイニング まとめ 統計に関する数学 数学：物理を学び楽しむために [2015-02-08] 『統計を始める前に』 …

Canvas 基礎（線・図形・テキスト） Canvas を触ってみたのでメモ。 Canvas 基礎（線・図形・テキスト） 線・図形 ブラウザがCanvas に対応してるかチェック 四角形（塗りつぶしなし） 四角形（塗りつぶしあり） 一部clear する四角形 線の太さ（幅）を変え…

無料で学べるライティング まとめ 勉強になりそうなライティング系の記事が増えてきたので、まとめておきます。書籍は除いています。 無料で学べるライティング まとめ 「シンプルな文章の書き方」 ― 読まれなかった文章をカイゼンしてわかったこと テキスト…

Swift をWindowsで試してみる （Webブラウザ） 本日あった WWDC 2015 で Swift 2.0 がオープンソースになると発表がありました。 興味をもったWindows ユーザーの私としては、どうにかWindows で動かせないか調べたところ、Webサービス(Webブラウザ)で動作す…

FileAPI で画像を選択またはドラッグ&ドロップで画像を表示 FileAPI を用いて、画像を選択またはドラッグ&ドロップで、画像を表示させるものをつくりました。 また、画像のwidth, heightとDataURLを表示させるもの FileAPI で画像を選択またはドラッグ&ドロ…

Git の submodule を使ってみる submodule を使ってみたのでメモ。 複数のリポジトリを1つにまとめて管理できないかと調べてみたところ、submodule が近そうなので使ってみました（他にもっといい方法があるかもしれませんが）。 Git の submodule を使って…

GitHubでWebページを公開してみる git にまだ不慣れなのでメモとして残しておきます。 GitHubでWebページを公開してみる GitHubでWebページを公開 「index.html」という名前で公開したいhtmlファイルを作る。 GitHubユーザページに新しいリポジトリを作成す…

デザイン基礎（配色） デザインの基礎的な配色関係のリンクが溜まってきたので、保存しておきます。 自分なりにまとめたノートっぽいものを後日まとめておきたいと思います。 「フォント」、「余白」や「レイアウト」の話は別の記事に今後書きたいと思います…

Webサイトにおけるアクセシビリティについてのメモ Webサイトにおけるアクセシビリティ関連の情報をまとめておきます。 Webサイトにおけるアクセシビリティについてのメモ アクセシビリティ・ツール miChecker HTML_CodeSniffer colorsafe WCAG2.0 とは？ 参…

CSS3 で球(sphere) と転がっているようなアニメーション CSS3のみ で球(3次元)を作ってみました。 CSS3 で球(sphere) と転がっているようなアニメーション 球 + アニメーション 参考リンク 球 + アニメーション codepen.io

CSS3 flex(box) メモ CSS3 のflex(box) を使ってみたのでメモ。 flexを使うことで，floatで悩んでいた水平方向の揃え，垂直方向の揃え，wrap後の揃え方などを調整でき，フレキシブルなレイアウトが可能になる． CSS3 flex(box) メモ サンプル（codepen） 対…