斜めに写った画像をCanvasで矩形に補正する - すぎゃーんメモ
将棋駒画像分類の話の続きのような、あんまり関係もないような。 memo.sugyan.com memo.sugyan.com 結局、素材を組み合わせて自動で生成しただけの駒画像ではやはりデータが足りていないようで、「やはりもっと様々な画像から人力でラベル付けしてデータセットを作っていく必要がありそう」ということになった。 とはいえ、インターネットから画像を拾ってこようと思うと、例えば以下のような感じで (引用元: フリー写真素材ぱくたそ) 多少ならともかく 斜めの角度から写っているものは、そのまま矩形に切り出して学習用画像データに利用するのは難しそう。 これらはうまいこと変形して使いたい。 いわゆるperspective projectionの逆変換のような操作が必要になる。 JavaScriptを使ったCanvas APIでの変換では簡単な拡大・縮小などの変換は可能だけど こういったpe
春からはじめるモダンJavaScript / ES2015 - Qiita
春ですね！人の配置がリファクタリングされ、コードもリファクタリングの季節です。 では僕がここでモダンなJavaScriptとES2015の利点を語る役をやるので、みなさんはチームを説得する役をやってください。 JavaScriptの歴史 まず最初にJavaScriptの歴史を踏まえることで、今学ぶべきものとその理由を確認しましょう。 なぜ2016年の記事でES2016ではなく、ES2015なのか、と疑問に思った方もいるかもしれません。それは、ES2015がただの年次アップデートではなく、これから始まる毎年のメジャーバージョンアップの起点となるバージョンであり、またES5から飛躍的に仕様が増えたバージョンであるからです。 簡単に(雑な)歴史を紹介します。 ブレンダン・アイクによってNetScapeに実装/搭載された古の時代〜IE6 (1996~2005) ES3: 一時はシェア7割を誇ったレ
Node.js — Node v4.0.0 (Current)
The collaborators of the Node.js project and the members of the Node.js Foundation are proud to offer v4.0.0 for general release. This release represents countless hours of hard work encapsulated in both the Node.js project and the io.js project that are now combined in a single codebase. The Node.js project is now operated by a team of 44 collaborators, 15 of which form its Technical Steering Com
JavaScript開発者が一度は読むべきStackOverflow - Qiita
10.How do JavaScript closures work? http://stackoverflow.com/questions/111102/how-do-javascript-closures-work JavaScriptのクロージャーについて 結構とっつきにくい「クロージャー」に苦労されている人も多いかもしれませんが、サンプルコードが多いので英語わからなくても助かります 個人的にはQuestionの「Like the old Albert Einstein said: ... 」というくだりが好きw 9. What does “use strict” do in JavaScript, and what is the reasoning behind it? http://stackoverflow.com/questions/1335851/what-does-use
Google流 JavaScript におけるクラス定義の実現方法
目次 2019年追記 はじめに クラス実現のために必要な JavaScript の言語仕様 function this call new 演算子 prototype チェーン プロパティ: prototype Google Closure 流のクラスの実現方法の概要 クラスの宣言とコンストラクタの定義 メンバ変数 (インスタンス変数) メソッド定義と呼び出し private, protected 継承 プロトタイプチェーンを利用してメソッドを親クラスから引き継ぐ 親クラスのコンストラクタの呼び出し メソッドオーバーライドと親クラスのメソッドの呼び出し 多重継承 abstract, interface inherits の実際のコード 良くないクラス実現方法 ES6 のクラス 2019年追記 この記事ではclassが導入されたES6以前のJavaScriptでどのようにクラスに相当するものを
［速報］マイクロソフト、HTML5/JavaScriptアプリをiOS／Android／Windows対応に一括変換する「ManifoldJS」をオープンソースで発表。Build 2015
［速報］マイクロソフト、HTML5/JavaScriptアプリをiOS／Android／Windows対応に一括変換する「ManifoldJS」をオープンソースで発表。Build 2015 マイクロソフトが米サンフランシスコで開催中のイベント「Build 2015」。2日目の基調講演では、iOSやAndroid、Windows 10などクロスプラットフォーム対応のアプリケーションを一括で生成するツール「ManifoldJS」を発表しました。 マイクロソフト チーフエヴァンジェリストのスティーブ・グッゲンハイマー氏。「Windows対応だけではなく、クロスプラットフォーム対応のアプリケーションをどう作ればいいのかとよく聞かれる。2年前、われわれはゲーム向けにUnityを発表し、昨年はiOSとAndroid対応でXamarinの採用を発表した。今年はWebアプリケーションにフォーカスしよう」
JavaScriptを読んでて「なにこれ！？」と思うけれど調べられない記法8選。 - Qiita
JavaScriptを読んでいると、「あれ、、、なにこれ？この書き方。。。」と思うことがたまにあります。この際の厄介なことは、どうやって調べたらいいかわからないことです。Google先生に聞こうにも、その書き方をなんと呼ぶかわからないので聞けない。 そんな「なにこれ？」を厳選してみました。覚えておくと、将来スッキリとする時が来るでしょう。 1. なみなみ、ふにゃふにゃ言ってる
Handling Keyboard Shortcuts in JavaScript
Despite the many JavaScript libraries that are available today, I cannot find one that makes it easy to add keyboard shortcuts(or accelerators) to your javascript app. This is because keyboard shortcuts where only used in JavaScript games - no serious web application used keyboard shortcuts to navigate around its interface. But Google apps like Google Reader and Gmail changed that. So, I have crea
はてなブログにおけるページ表示速度改善の取り組みについて - Hatena Developer Blog
こんにちは、id:hakobe932です。はてなブログではユーザ体験の改善のために、ページ表示速度を向上させるための様々な取り組みを行っています。このエントリーでは、はてなブログで行っている、ブラウザキャッシュの活用、JavaScriptのページ最下部での読み込み、JavaScriptの圧縮、という3つの取り組みについて解説します。 ブラウザキャッシュの活用 同じ内容のJavaScriptやCSSを、ページを表示するたびにダウンロードすると、余分なHTTPリクエストが発生しますし、読み込み時間がかかります。 ブラウザのキャッシュを利用できれば、余分なリクエストを減らすことができます。はてなブログでは、なるべく長い間ブラウザにキャッシュを保存するために、JavaScriptなどの一部の種類のファイルのレスポンスに、以下のようなヘッダを指定しています。 $ curl -I http://hat
JavaScript Garden
JavaScript Garden はJavaScriptというプログラム言語の一番奇妙な部分についてのドキュメント集です。 このドキュメントはJavaScriptという言語に慣れていないプログラマーがこの言語について深く知ろうとする際に遭遇する、良くある間違い・小さなバグ・パフォーマンスの問題・悪い習慣などを避ける為のアドバイスを与えます。 JavaScript GardenはJavaScriptを教える事を目的にしていません。このガイドの項目を理解する為には、この言語に対する前提知識がある事を推奨します。この言語の基礎部分についてはMozilla Developer Networkのガイド がオススメです。 著者 このガイドは愛すべきStack Overflowの2人のユーザーIvo Wetzel (執筆)とZhang Yi Jiang (デザイン)によって作られました。 貢献者 貢献
絶対まねしたい！Chart.jsを使ってフラットデザインぽいグラフを作る方法 | startapp
Chart.jsというのが流行っているみたいなので、もうちょっとフラット感がでないものか、カスタマイズに挑戦してみました。Chart.jsの使い方などは、LIGさんの記事を参考にしてください。 ドーナッツ これを何個か並べればかなりフラット感が出ますね。外側の青い部分のみをChart.jsで描画し、それ以外はCSSで調整しています。2つ目のセグメントを背景色で塗れば、円弧のように見えます。 ※ ドーナッツの幅は、percentageInnerCutout で調整できます。 ラインチャート お次は棒グラフです。フラットに見せるポイントは、グラフや線などを簡略化することでイラストのように見せるところです。また、数字と組みあわせるとかっこ良く見えます。※ 数字の部分は、CSSで組んでいます。 ※ 横軸のラベルは、意図的に減らしています。 バーチャート 棒グラフもフラットにしてみました。こちらも数
Javascript で暗号化
日本マイクロソフト株式会社 Digital Sales 事業本部 Digital Cloud Solution Architect 上坂 貴志 クロスプラットフォームに対応した .NET Core、.NET 5 を得てリリースされた .NET 6は待望の LTS (Long-term Support)です。新規開発であれば .NET 6 での開発を検討できますが、.NET Framework で作成された既存のシステムはどうすれば良いでしょうか。 .NET Framework は version 4.8 を最後に新機能の追加予定は今のところありません。今後のことを考えて .NET 6 へのアップグレードを検討したいところですね。 このセッションでは .NET Framework から .NET 6 へのアップグレードについての様々な情報をお伝えします。
HTML5で組んでるならこの魔法のjsも入れておけっていう話
現在、A!@attripさん発で話題になっている「たった2行でIE5.5～IE8をモダンブラウザの挙動にする魔法のJS」という記事。 Webデザイン界隈では当たり前のものですが、実はもうひとつ追加しておくといいかもしれないjsがあったりします。 Photo:html5 By michael pollak IE8以前のブラウザはどうにもこうにも開発者泣かせなわけですが、ie9.jsとcss3-mediaqueries.jsを突っ込むことで、モダンブラウザと同じ挙動にすることができちゃいます。 もう少し具体的に書くと、ie9.jsを組み込むことで、 position:fixed;に対応 max-width、max-heightに対応 属性セレクタ、擬似クラスに対応 margin:0 auto;でのセンタリングに対応 透過PNGに対応 opacityに対応 といったことが可能になります。要はCS
JavaScriptで正規表現練習ゲーム作った - aike’s blog
特に何か目的があるわけじゃないんですが、JavaScriptの練習のためにゲームを作ってみました。 Regex Of The Dead タイピングゲームのように正規表現を練習するためのシンプルなゲームです。ゾンビと一般人が迫ってくるのでゾンビの名前にだけマッチするように正規表現を入力して倒していきます。 HTML5の流れでオーディオ、グラフィック、フォントがHTML/JavaScriptで簡単に扱えるようになり、さらにenchant.jsのようなゲームエンジンも充実してきて、ゲームもJavaScriptだけで気軽に作れるようになってきたようです。 そんなわけで試しに書いてみたのがRegex Of The Deadです。プログラミングは長いことやっているもののゲームを作ったのは大学のとき以来かもしれません。 最初、何か良さそうなゲームエンジンがないものかいくつか調査しましたが、こういったタイ
Yahoo!がJavaScriptのフレームワーク「Mojito」をオープンソースで公開。同一のJavaScriptコードが、サーバ、ブラウザどちらでも実行可能
Yahoo!がJavaScriptのフレームワーク「Mojito」をオープンソースで公開。同一のJavaScriptコードが、サーバ、ブラウザどちらでも実行可能 Webアプリケーションのためのコードを1つだけ書けば、それがPC上でそのままローカルアプリケーションとなり、Node.jsのサーバへ持っていけばWebブラウザからWebアプリケーションとして利用でき、さらにモバイルデバイスからアクセスすれば、そのデバイスに最適な表示が行われる。米Yahoo!が4月1日にオープンソースとして公開した「Mojito」（モヒート）は、JavaScriptで書かれたアプリケーションフレームワークです。 Mojitoは昨年11月にYahoo!が開発中であることを明らかにし、今年の第1四半期にオープンソースとして公開予定としていました。 米Yahoo!がJavaScriptフレームワーク「Mojito」と、N
ページに仕込まれたJavaScriptのイベントを全部見える化出来るブックマークレット「Visual Event」:phpspot開発日誌
画像スライダーに関することならお任せ！なjQueryプラグイン「Slider Kit... 次の記事 ≫：かなりいい感じのWordPressテーマ２０ Allan Jardine | Reflections | Visual Event ページに仕込まれたJavaScriptのイベントを全部見える化出来るブックマークレット「Visual Event」。 JavaScript で開発していて、jQuery等の各種フレームワークや、on〜 を使ってイベントを埋め込むことは多いですね。 後になって、どこにイベントがあるのかをすぐ見える化し、どのような処理が記述されているのか、確認することのできるブックマークのご紹介です。 当サイトにはそれほどイベントが組み込まれていませんので、Yahoo! Japanのトップページで試してみます。 ブックマークレットを起動すると、グレーアウトされ、エレメントの上
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
WebブラウザでP2Pを実現する、WebRTCのAPIと周辺技術
大規模 JavaScript その設計と実装と現実
Meteor
JavaScript.Next
