Windows10とUbuntu16のデュアルブート環境構築 GPUあり、UEFIモード

はじめに

 Windows10とUbuntuデュアルブート環境を構築しようとしても、以下が問題になってうまくいかないことがある。

これらを回避しつつインストールする方法の説明

目標

  • Windows10・Ubuntu16 のデュアルブート環境
    • Windows10がインストールされたPCにUbuntu16をインストールする。本稿の手順ではUbuntu14はインストールできず。
  • grubUEFIブート
  • WindowsUbuntuともにオンボードGPUともにディスプレイ出力可能
    • 本環境ではマザーボード2ポート・GPU3ポートの最大5ディスプレイ表示可能のはず

筆者の環境

実際の手順

  1. Windowsでの作業
    1. インストールメディアの用意
    2. 空き領域の作成
    3. 高速スタートアップの無効化
    4. シャットダウン
  2. Ubuntuのインストール作業

    1. GPUを取り外す
      • 取り外さないと、Ubuntu16が起動せず画面が真っ暗になる。
    2. インストールメディアの起動・Ubuntuインストール
      • この時点ではブートローダgrub)の起動画面にWindowsが表示されない
      • Ubuntu14はこの時点で起動しなかった。
  3. Ubuntuインストール後の作業

    1. Ubuntuを起動
    2. grubからWindows10を起動できるようにする
      • UEFIWindowsを認識できるかの確認  terminalで以下のコマンドを実行
os-prober

(筆者の環境ではこの時点でWindows Boot Managerを発見できたので次へ。発見できなかったときは↓を参考にして対応)

sharply.hatenablog.com

    - grubのエントリを追加する

 terminalで以下のコマンドを実行

grub-mkconfig -o /boot/grub/grub.cfg
    - Ubuntuを再起動。grubにWindowsが表示されることを確認する。
1. UbuntuでGPUを利用できるようにする
    1. __NVIDIAのドライバをインストール__

 terminalで以下のコマンドを実行

sudo add-apt-repository ppa:graphics-drivers/ppa
sudo apt-get update
sudo apt-get install nvidia-367

参考 askubuntu.com

    1. シャットダウン
    1. GPUを取り付け
    1. BIOSでiGPU Multi-Monitor をEnableに設定

チップセットがH270の場合…  Advanced → System Agent(SA) Configuration → Graphics Configuration → iGPU Multi-Monitor をEnabledに設定

    1. __GPUを認識しているか確認__

 terminalで以下のコマンドを実行

nvidia-smi

 取り付けたGPUを認識しているはず。

    1. マルチディスプレイの設定

参考:

Cloud9のNode.js環境でkeras-jsのデモをビルドする

※Node.jsの基礎知識があれば特別な操作は必要ないです。
 Nodeは初心者でビルドの仕方がわからなかったので、備忘として残します。

概要

keras-jsはブラウザ上でkerasモデル(ニューラルネットモデル)を実行できるライブラリ、GPUも利用できる。 GitHub - transcranial/keras-js: Run Keras models in the browser, with GPU support

keras-jsの公式デモはNode環境でビルドする必要があるが、自前PCにNodeをインストールするのがめんどくさい。 でもCloud9のNode環境なら自前PCの環境を汚すことがないし、IDEも使いやすい。

手順

1. Cloud9でワークスペースを作成

2.クラウドIDEでデモをビルド

IDEの下の方にある「bash」ビューで以下のコマンドを実行する

  • package.jsonで定義されたパッケージのインストー
npm install
  • demosフォルダ内のソースコードをビルド
    • package.jsonの"scripts"にdemoのビルド用コマンドが記述されている。これを実行するのが↓のコマンド。
    • ビルドにはwebpackを利用している。demos/webpack.config.jsの情報を参照してビルドし、demos/dist/bundle.jsに結果を出力する。
    • ビルドに14秒ほどかかる
npm run demos:build

3.demoをビルドできたか確認

  • IDEの左のほうにあるワークスペースビューからindex.htmlを右クリック→Runを選択
  • Apache httpdが起動した旨が、IDEの下のほうのビューに表示される。指示に従って「https://(ワークスペース名)-(Cloud9アカウント名).c9users.io/index.html」へアクセス
  • 公式のデモページ「https://transcranial.github.io/keras-js/」と同じ内容なら成功
    • ビルドに失敗していると、index.htmlにアクセスできても各種kerasデモサンプルが動作しない。

蛇足

demoをビルドする際に、developモードかproductionモードを指定できる。 それぞれのモードでkerasモデルの参照先が異なる。 webpackを引数なしで実行するとdevelopモードでビルドしてしまい、kerasモデルがリンク先に存在せずdemoが動作しない。 productionモードでビルドすると、↓のリポジトリからモデルを読み込むので正常に動作する。
GitHub - transcranial/keras-js-demos-data: Keras.js demos data

SuperDevModeでデバッグしているがページ右下にリロードボタンが表示されないとき

  1. http://localhost:9876/ にアクセス
  2. ページの内容に従い、「Dev Mode On」のブックマークレットをブックマークバーに登録
  3. 該当ページで「Dev Mode On」を実行
    • (「Can't find any GWT Modules on this page.」と表示される)
  4. ページ再読み込み
    • これをしなかったためにうまくいっていないと勘違いした。

参考:http://stackoverflow.com/questions/24235669/gwt-superdev-cant-find-gwt-modules

GWTでString.format("%.2f",value)をしたい

概要

JavaでDoubleの桁数を制限してStringに変換するときは

//double値を小数点2桁でStringに変換
String.format(“%.2f”,value)

とするが、GWTJRE EmurationはString.format()に対応していない
参考:http://www.gwtproject.org/doc/latest/RefJreEmulation.html

そこで、NumberFormatクラスで代替する。
参考:http://stackoverflow.com/questions/7214377/limiting-number-of-decimal-places-in-gwt
NumberFormatの仕様:
http://www.gwtproject.org/javadoc/latest/com/google/gwt/i18n/client/NumberFormat.html


サンプル

*.java

    public static String getFormatted(double value) {
        NumberFormat decimalFormat = NumberFormat.getFormat(".##");
        return decimalFormat.format(value);
    }

GWTアプリでキーボードショートカットを設定

概要

キーボードショートカットを実装するには、画面のどの要素がアクティブな時でもキーイベントをハンドルする必要がある。
widget.addKeyDownHandler(...)では実装できない。

EventクラスにNativePreviewHandlerを追加することで実現する。

参考:https://groups.google.com/forum/#!topic/google-web-toolkit/Pmq8OF77RTM

Main.java

    public void onModuleLoad() {
        Event.addNativePreviewHandler(new Event.NativePreviewHandler() {
            public void onPreviewNativeEvent(NativePreviewEvent event) {
                NativeEvent ne = event.getNativeEvent();
                if (KeyUpEvent.getType().getName() != ne.getType())
                    return;
                switch (ne.getKeyCode()) {
                case KeyCodes.KEY_A:
                    fireCommand1();
                    break;
                case KeyCodes.KEY_ENTER:
                    fireCommand2();
                    break;
                }
            }
        });
}

GWTとBootstrapの併用でレスポンシブWebデザイン

概要

GWTとBootstrap3でレスポンシブWebデザインをするときのサンプルと注意事項

GWTBootstrapなるオープンソースもあるけど日本語資料が少ないので今回は使用しない。
GWT-Bootstrap

メリット

javaコードに画面のレイアウト情報が入ってこないので、ビジネスロジックがすっきりする。
(画面レイアウトのためにFlexTableなどを使用する必要がない。)
レイアウト情報はhtmlファイルに集中するので再編集しやすい。
日本語資料の多いBootstrapで画面レイアウトを行うことができる。

サンプル

GWTとBootstrap3を通常通り使用する。
HTMLは普通にBootstrapを使用するときと同じ。
GWTモジュールではidに対応するdiv要素を探して、クリックハンドラを追加。

Main.html


<!-- BootstrapのCSS読み込み -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery読み込み -->
<script
	src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<!-- BootstrapのJS読み込み -->
<script src="js/bootstrap.min.js"></script>

<!-- gwtアプリ読み込み -->
<script type="text/javascript" language="javascript"
	src="main/Main.nocache.js"></script>

<!-- 中略 -->

<div class="container">
  <div class="col-md-1 btn btn-default">
    <div id="btnPanel1">
    <img src="/img/1.png">
    <div>ボタン1</div>
    </div>
  </div>
  <div class="col-md-1 btn btn-default">
    <div id="btnPanel2">
    <img src="/img/2.png">
    <div>ボタン2</div>
    </div>
  </div>
</div>

Main.java

public void onModuleLoad() {

        {
            RootPanel.get("btnPanel1").addDomHandler(
                new ClickHandler() {
                    public void onClick(ClickEvent event) {
                        fireBtn1Event();
                    }
                },
                ClickEvent.getType());
        }
}

注意事項

  1. HTMLの記述は、先にbootstrap関連を読み込み、次にGWT関連を読み込む

以下のエラーが出るとき

Uncaught TypeError: Cannot read property 'appendChild' of null

javascript - How do I solve this "Cannot read property 'appendChild' of null" error? - Stack Overflow

Windowsバッチファイルをプログラミングレスで作れるWebアプリを作りました

Windowsバッチファイルをプログラミングレスで作れるWebアプリを作ったので紹介します。
バッチファイルに実装したい機能をクリック選択して、テキストボックスにファイル名などを入力していくことでバッチファイルが作成できます。

知らなくても作れるWindowsバッチファイルジェネレータ

普通にバッチファイルを作るときは?

  1. Googleで記述の仕方を探す
  2. エディタにコピー&ペーストする
  3. 必要な箇所を修正する

という手順を踏むと思います。

でも、

  • サンプル文を見つけてもどの部分を修正したらよいかわからない
  • ブラウザとエディタをいったりきたりが面倒

という経験はありませんか?
本Webアプリは

  • 修正箇所があらかじめテキストボックス形式になっているので変更すべき箇所がすぐわかる
  • 探した機能をすぐにエディタに追加できる

ので、簡単にすばやくバッチファイルを作成することができます。

f:id:black-skin:20150429231839p:plain

拡張性

本Webアプリはまだ情報量が未熟で、ほしい機能が見つからないということもあるでしょう。
そんなときは自分でほしい機能・構文を追加してください。
あなたが作成した構文はサーバに送信され、他のユーザにも共有されます。
あなたが本Webアプリを使い込むことで、多くの方々にも使いやすいものになっていくでしょう。

さいごに

本Webアプリは

を使用して作成しました。
あと「プログラミングレスで作れる」と謳ってますが、多少のバッチファイルに関する知識は必要です。「レス」というのは「ない」ではなくて「少ない」という意味ですから。