HOME  >  プログラミング

PC 画面を画像解析して、その結果を活用できないか試してみる

「PC 画面を画像解析して、その結果を入力補助やら操作補助に活用できないか?」とふと思い、
画像解析で、ウィンドウの要素をどの程度判別できるのか、試してみました。

使用したもの
ウィンドウの画像を適当にラベリング処理してみたところ、下図のような結果に。
ラベリング処理された領域を赤枠で表示しています。
ボタンとかチェックボックスの領域を認識できています。(ノイズというか不要な領域も多いけど)

labeling.jpg

かなり適当に解析してこの結果なので、文字領域の抽出とかすれば少しマシになりそう。

意外と使えそうな感じなので、次回に続くかも。

# でも、配布を考えると OpenCV のバイナリ (約 20 MB) も一緒に配布せにゃならんわけで。
# この点は微妙かも。

参考

  • OpenCvSharpをつかう その17(NuGetで導入) - schima.hatenablog.com
  • OpenCvSharpをつかう その18(ラベリング・改) - schima.hatenablog.com
    • スポンサーサイト



      2015/05/23 | カテゴリ:プログラミング | トラックバック(0) | コメント(0)

Vichrome の f-Mode (hit a hint) の高速化にチャレンジ

Vichrome の f-Mode (hit a hint) の起動がとても遅い場合があったので、
高速化にチャレンジしてみました。

結論から言ってしまえば、createHints関数が遅いです。
酷い場合だと、処理時間の約 9 割をその関数が占めていました。

対処すると、サイトにもよりますが、 7 〜 20 倍くらい速くなる場合があります。
(1100ms ぐらいかかっていたのが 66ms になったりします)
# ただし、高速化の代償として、設定に関係なく、起動時のアニメーション処理は必ず無効になります。

遅い原因

createHints関数の遅い箇所ですが、
ざっくり記述すると、以下のような構造になっています。
for(...){
  ...
  hintElement.hide();
  hintElement.show();
  ...
}
この一要素ずつヒントを作成している箇所で、
hide()show() を実行しているのが遅い原因です。

ソースを見たかぎりだと
アニメーション処理のため、こんなことをしているみたいです。

高速化の方法

高速化はhide()show()を消すだけで終わりです。
(実際のソースだとshow()showFunc()内で行なわれているので、その呼び出しを削除します)
Windows の場合
C:\Users\[ユーザ名]\AppData\Local\Google\Chrome\User Data\Default\Extensions\gghkfhpblkcmlkmpcpgaajbbiikbhpdi\0.12.0_0\mode.js

Mac の場合
~/Library/Application Support/Google/Chrome/Default/Extensions/gghkfhpblkcmlkmpcpgaajbbiikbhpdi/0.12.0_0/mode.js
※バージョン等は環境依存なので、各自で読みかえてください。

下記の 16、20 行目が修正する箇所です。
      for (_j = 0, _len1 = _ref.length; _j < _len1; _j++) {
        hint = _ref[_j];
        offset = hint.target._offset_;
        top = offset.top - 7;
        left = offset.left - 7;
        if (top < 0) {
          top = 0;
        }
        if (left < 0) {
          left = 0;
        }
        elem = tmpElem.clone().css("top", top).css("left", left);
        _ref1 = hint.key;
        for (_k = 0, _len2 = _ref1.length; _k < _len2; _k++) {
          c = _ref1[_k];
          elem = elem.append($('<span id="vichromehintchar" />').html(c)).css("color", g.model.getSetting("hintColor")).hide();
        }
        hint.elem = elem;
        $('html').append(hint.elem);
        _results.push(this.showFunc.call(hint.elem));
      }
      for (_j = 0, _len1 = _ref.length; _j < _len1; _j++) {
        hint = _ref[_j];
        offset = hint.target._offset_;
        top = offset.top - 7;
        left = offset.left - 7;
        if (top < 0) {
          top = 0;
        }
        if (left < 0) {
          left = 0;
        }
        elem = tmpElem.clone().css("top", top).css("left", left);
        _ref1 = hint.key;
        for (_k = 0, _len2 = _ref1.length; _k < _len2; _k++) {
          c = _ref1[_k];
          elem = elem.append($('<span id="vichromehintchar" />').html(c)).css("color", g.model.getSetting("hintColor"));
        }
        hint.elem = elem;
        $('html').append(hint.elem);
        _results.push(hint.elem);
      }
※修正したソースの配布はしません。Vichrome のライセンスがわからないので……。
高速化したい方は各自ソースを編集してください。
ソース編集後は、 Chrome を再起動すれば修正が反映されます。
(他にも反映する方法はありますが、これが一番手軽だと思います)

高速化した結果

遅いと感じていたページで実行してみたところ、
だいたい 7 〜 20 倍程度の高速化に成功

計測したページ: https://github.com/u338steven
ヒントの数: 31
before : 352 ms
after : 51.3 ms

計測したページ: https://github.com/u338steven/ViChrome
ヒントの数: 69
before : 975 ms
after : 99.3 ms

計測したページ: https://twitter.com/u338steven
ヒントの数: 37
before : 1131.7 ms
after : 66.3 ms

before :修正前の createHints 関数の平均処理時間
after :修正後の createHints 関数の平均処理時間
2014/06/04 | カテゴリ:プログラミング | トラックバック(0) | コメント(0)

Chrome でキャレットモード(モドキ)を実現する方法

Chrome を使っていると、キャレットモード(キャレットブラウジングモード)で
使いたい時がたまにあります。(キーボード使いの人だけだろうけど)
なので、できないのかちょっと調べてみました。

その結果、

  1. Chrome 自体にはキャレットモードはない!
  2. 拡張機能 Caret mode があった
  3. ショートカットキーが機能せず、使用できなかった
  4. ソースいじくってショートカットキーを変更して使用できるようにした
  5. 個人的に上記の拡張機能が使いにくかったので、ViChrome を改造した
ということに。
……調べるだけのはずが、
最後には、いつもの無ければ作ればいいじゃない理論になっていたという恐怖。

拡張機能 Caret mode があった

それがこれです↓
Chrome Web Store - Caret mode

この拡張機能なんですが、マシンによっては大きな問題が……。

ショートカットキーが機能せず、使用できない

拡張機能 Caret mode はショートカットキーでキャレットモードに移行するんですが、
僕の環境では移行できませんでした。
実は事前に Chrome ウェブストアのレビューを見ていたので、
動かない理由はなんとなく理解していました。

Chrome ウェブストア上の Caret mode のレビューには、
キーボードによってはショートカットキーCtrl+~が機能しないから
キーバインドを変更すれば使えるよという情報が書き込まれてます。(とてもいいレビュー)

ということで、ソースをいじることに。

ソースいじくってショートカットキーを変更して使用できるようにした

いじるファイルは、以下。
C:\Users\<ユーザ名>\AppData\Local\Google\Chrome\User Data\Default\Extensions\hcmlibpbehgginnkmlpfclioiljefejk\0.0.2_0\src\inject\inject.js
なお、hcmlibpbehgginnkmlpfclioiljefejkの部分は変わるかもしれません。

            $(document).bind('keydown', function(e) {
                if (e.ctrlKey && e.which == 192) {
                    if(caret_mode == false)

F7で起動するように変更します。この辺は好みですが Firefox にあわせました。

            $(document).bind('keydown', function(e) {
                if (e.which == 118) {
                    if(caret_mode == false)

# ソースを見ると何故か IE 用の処理まで書かれてたりしますが、その辺はスルー。
# 見るかぎり影響なさそうなので。
# なんで書いてあるんだろ??


これで使えるようにはなりました。
が、キャレットモードに移行すると、キャレットは必ずドキュメントの先頭付近に出現します。
なので、ドキュメントの下部にキャレットを移動したい場合、かなりメンドウです……。

keysnail + hok + caret-hint のようにキャレット移動したい!

個人的に上記の拡張機能が使いにくかったので、ViChrome を改造した

というわけで、Hit-a-hint 機能をもつ拡張機能を改造することに。

ソースが公開されてるし、ちょうど自分が使ってるから ViChrome を改造しようということで、
改造してプルリクエスト投げてみました。

どんな改造なのか気になる方は GitHub 見てください。
CoffeeScript で記述されています。
https://github.com/u338steven/ViChrome

ちなみに ViChrome のライセンスがよくわからないので、js にして配布とかする気はないです。

# というかライセンス的に問題が無くてもしないと思います。
# 気になる人は CoffeeScript でごにょごにょしてください。

2014/04/06 | カテゴリ:プログラミング | トラックバック(0) | コメント(0)

Hit a Hint for Windows 0.5.16.3 公開

ログオン時に自動起動する際、稀に発生していた微妙な動きを修正。
ダウンロードはこちらから

Version.0.5.16.3

  • ログオン時の自動起動がオンのとき、稀にウィンドウがタスクバーの裏に隠れ、ヒントが見えない状態になってしまうのを修正。

2014/01/05 | カテゴリ:プログラミング | トラックバック(0) | コメント(0)

設定、オプション、プロパティ画面の作成

今、公開しているソフトウェアに設定画面をつけようとして、
いろいろとどんな UI にするかを試してます。
今の最有力候補がこんな感じです↓
settingform.jpg
雑感
なんだかんだで、既存のコンポーネントをうまく使い倒したほうがやりやすい……。
PropertyGrid だなんて初めてつかったけど、これは面白い。
Visual Studio 以外で使われてるところをあまり見たことないけどなんでだろ。
みやすさ、わかりやすさとかその辺りの問題かな。
PropertyGrid で値を True, False で設定するより、
チェックボックスの on/off の方がわかりやすいとかそんなんかな。
なんだか気に入ってしまった PropertyGrid。
2013/11/22 | カテゴリ:プログラミング | トラックバック(0) | コメント(0)
外部リンク

カンパのお願い
公開しているソフトウェアはフリーウェアなので無料でご利用いただけます。 気に入ってくださった方は、Amazon でお買い物をする際に下記のリンクを経由して頂ければ励みになります。

検索BOX・タグ一覧