OmniAICreator/Qiita-1.07M huggingface dataset:
ShoeBox：ビットマップフォント書き出し設定の解説 (#4詳細編)

最後にまだ解説していない設定項目についての投稿です。
なお、カーニング関連については実際に試していないので間違っているかもしれません。

![19.42.58.png](https://qiita-image-store.s3.amazonaws.com/0/8302/60fa8c72-9e27-12e4-a6b0-1f8b0c8c23b5.png)

#File Format
書き出し fnt(XML)ファイルの各部分別のテンプレートになります。XMLでもfnt(テキスト)でも大枠の設定があり、各文字数の分だけ個別設定があるのは変わらないので、どちらもここで設定するようです。テンプレート例の部分はXML書き出しで解説してあります。なお蛇足ですがテンプレート中の文字で\tがタブ、\nが改行の意味になります。

* File Format Loop
	各文字の設定部分です。基本いじらなくて良いです。@letter部分でidに対応する実際の文字が挿入されるので目視での確認がわかりやすくなっていますね。ファイルサイズが気になるなら削除しましょう。
	`\t\t<char id="@id" x="@x" y="@y" width="@w" height="@h" xoffset="@sx" yoffset="@sy" xadvance="@advanceX" /><!-- @letter -->`

* File Format Loop Kerning
	カーニングの設定のループ部分です。２つの文字の関係を設定するので、ID２つと幅調整の値が入ります。
	`\t\t<kerning first="@kernPairIdA"  second="@kernPairIdB"  amount="@kernPairAmount" />\n`

* File Format Outer
	フォント全体の設定です。フォントface名、基本サイズ、縦幅、テクスチャの縦横大きさ、画像名などが設定できます。ページ対応(複数の画像を扱う)は対応していないようですね。kernings周辺は変更しなくて良いです。
	`<font>\n\t<info face="@fileName" size="@advanceY" />\n\t<common lineHeight="@advanceY" scaleW="@texW" scaleH="@texH" pages="1" />\n\t<pages>\n\t\t<page id="0" file="@fileName.png" />\n\t</pages>\n\t<chars count="@count">\n@loop\t</chars>\n\t<kernings count="@kernPairCount">\n@kernLoop\t</kernings>\n</font>`

* File Genarate 2x
	２倍解像度の画像も書き出す場合にtrueにします。（自分は試していません。）

* File Name
	フォントおよび画像のファイル名設定です。画像では拡張子がpngに置き換わります。
	デフォルトでは`@fileOriginalName-export.xml`ですが、自分は利便性のため、`@fileOriginalName.fnt`に書き換えています。その場合は元pngファイルの上書き消去に注意。

#Kerning設定
カーニング関連の設定がならんでいます。

* Kerning Build Pairs
	文字個別の自動カーニング設定を有効にするか否かです。

* Kerning Pairs
	自動カーニング設定を行う文字のペアをスペースで区切って羅列します。`あい あう あえ `といった感じです。２つの文字の並び順はとくに意識しなくて良いようです。（そのままの順序で書き出されます。）

* Kerning Rays
	数を大きくすると自動カーニング計算の質が上がりますが、処理が遅くなります。デフォルト8のままで良いでしょう。

* Kerning Value
	テキストをレンダリングする際の余白ピクセル数です。Kerning Build Pairsがfalseの場合でも適用されます。


#Merge Blob Size
不明です。そのままにしておきましょう。。

#Message
プレビューで表示されるサンプル文字列です。日本語も入ります。書き出しファイルには影響しません。プレビューを眺めながらの更新もできます。

#Texture設定
テクスチャのパッキング関連の設定が並んでいます。

* Tex Extrude Size
	テクスチャーのExtrudeサイズ、でしょうか？ヘルプに記載がないので不明です。そのままの0にしておきましょう。

* Tex Max Size
	テクスチャの縦横マックスサイズです。2048のままで良いでしょう。

* Tex Padding
	各文字の余白設定です。問題なければ1のままで良いでしょう。文字表示にゴミが入るなどの場合数値を大きくしましょう。

* Tex Power Of tWo
	書き出し画像の縦横ドットを2の倍数にするかの設定です。わからなければtrueで。自分はさらに別途のパック処理を入れるので、falseにしています。

#Text関連の設定
文字関連の設定がならんでいます。

* Txt Chars
	書き出す文字列一覧です。ここで直接編集せずに、書き出したい文字を羅列したテキストファイルのドラッグ＆ドロップで設定しましょう。

* Txt Line Height
	フォントのラインハイト（行の縦幅＝文字＋余白を含んだ縦幅）設定です。プレビュー画面でオート設定もできますが、手動で設定したほうが良いでしょう。文字サイズの120%程度がオススメとされています。

* Txt MonoSpace
	固定幅フォントにするかどうかの設定です。ヘルプにはそのようにできると解説がありますが、試してみた限り固定フォント書き出しにはなってくれませんでした。。File Format Loop設定のadvanceX設定を固定値にしてしまえば近い感じにではできます。

* Txt Space Width
	スペース文字の横幅です。テクスチャには書き出されませんが、フォント設定にはこの値が書き出されます。文字の大きさと同じかそれより小さい程度で設定しましょう。

* Txt Tab Size Spaces
	タブ文字をスペース何文字換算にするかです。4または8になると思います。タブ文字設定自体、場合によってはなくても良い気がしますが、書き出しをしないということはできないようです。

#おわりに
結構、不明なのがありますね。下記のヘルプを読みながら、実際に試した際にわかったことを追記する感じでまとめてあります。不明点疑問点あればヘルプ側でも確認してみてください。
http://renderhjs.net/shoebox/bitmapFont.htm

![spr_shoeboxLogo.png](https://qiita-image-store.s3.amazonaws.com/0/8302/0d53ac51-84bc-3265-e926-ddf80ad8de46.png)


以上です！エンジョイ！
ionic(cordova) iOSで実機テストできないエラー

ionic runでエラー喰らいました。


***
** BUILD FAILED **


The following build commands failed:
	Check dependencies
(1 failure)
Error: Error code 65 for command: xcodebuild with args: -xcconfig,パス,プロジェクト.xcodeproj,ARCHS=armv7 arm64,-target,プロジェクト,-configuration,Debug,-sdk,iphoneos,build,VALID_ARCHS=armv7 arm64,CONFIGURATION_BUILD_DIR=パス,SHARED_PRECOMPS_DIR=パス
***


よくわからないけど、
platforms/ios/内のxcodeprojファイルを直接開きました。

xcodeでRunすると実機を登録しろ的なエラーが出たのでこちらはGUIで設定。
GUIで言ってくれるとわかりやすい！

んなわけで動きました！
ios-deployがインストールできないエラー


ionic runで実機テストしてみようと思ったら


```
ios-deploy was not found
```

というエラー喰らいました。


で、面倒なことに

```
sudo npm install -g ios-deploy
```

のでios-deployをやろうとするもまたもエラーでできない。。


StackOverflowで調べると


```
sudo npm install --global --unsafe-perm ios-deploy
```

で行けるとこのことで、意味はわからずトライしてみたらいけました。
Ubuntu 16.04 でeclipse がハングアップしたりコンポーネントの境界が表示されないといった不具合の仮対応

# 経緯 
Ubuntu を16.04 LTS にアップデートしてからeclipse mars のボタンの境界が消えてしまったり、一定時間操作しているとハングアップしてしまったりといった動作をするようになりました。
調べたところUbuntu 16.04 LTS から使用ているGTK 3 とeclipse の組み合わせがまだ安定動作できないようです。
![EclipseGTKIssueOnUbuntu16.04_0000.png](https://qiita-image-store.s3.amazonaws.com/0/70152/e0cc57d7-baba-cbfd-b7fe-021f8a2ec080.png)

# 暫定対処 
暫定対処の内容としてeclipse 起動時にGTK3 が無効となるように設定します。

## 暫定対処法 1: eclipse.ini に記述する方法 
`eclipse.ini` の`--launcher.GTK_version` に`2` を指定するようにします。


```text:eclipse.ini
...
# 以下の定義を"--launcher.appendVmargs" よりも手前に定義します
--launcher.GTK_version
2
...
```


`eclipse.ini` に上記定義を追加したら、いつもどおりeclipse を起動すればOK です。

## 暫定対処法 2: eclipse 起動時に環境変数SWT_GTK3=0 を設定する 
eclipse を起動するときに環境変数SWT_GTK3=0 を設定するようにします。


```console:例1)exportで環境変数を設定する
$ export SWT_GTK3=0
$ ./eclipse
```

```console:例2)eclipseコマンド実行時に環境変数を設定する
$ SWT_GTK3=0 ./eclipse
```

デスクトップから検索できるように`~/.local/share/applications/*.desktop` に起動の定義がされている場合、`Exec` に以下のように`SWT_GTK3=0` を追加します。


```text:例)~/.local/share/applications/eclipse.desktop
Exec=env SWT_GTK3=0 /path/to/eclipse-jee/eclipse
```


# 対処後 
対処後はボタンの境界線も見えるようになり、ハングアップもしなくなります。暫くはこの状態で使っていく必要がありそうです。

![EclipseGTKIssueOnUbuntu16.04_0001.png](https://qiita-image-store.s3.amazonaws.com/0/70152/854c7c4b-3e11-4587-70cf-596ef43ddb52.png)


# 参考 
- Eclipse not working in 16.04
    - http://askubuntu.com/questions/761604/eclipse-not-working-in-16-04

- Bug 492379 - Welcome screen is empty on Ubuntu 16.04 unless SWT_GTK3=0 is set in the environment.
    - https://bugs.eclipse.org/bugs/show_bug.cgi?id=492379
Pythonによる機械学習入門のためのWindows7環境構築

技術評論社の「データサイエンティスト養成読本　機械学習入門編」のPythonによる機械学習入門のためのWindows7環境構築の手順を記載しています。(2016/5/4現在)

1. Windows用Python 3.5をダウンロードする。
・[python.orgのダウンロードページ](https://www.python.org/downloads/)をウェブブラウザで開く。
・「Download Python 3.5.1」ボタンをクリックするとダウンロードが開始される。（32ビット版がダウンロードされた。）

2. Python 3.5をインストールする。
・python-3.5.1.exeを実行する。
・「このファイルを実行しますか？」と聞かれるので「実行」をクリックする。
・インストーラの画面が表示されたら、「Add Python 3.5 to PATH」をチェックしてから「Install Now」をクリックする。
・インストールが完了したら、「Close」をクリックする。

3. ライブラリをインストールする。
・[Christoph Gohlke氏のページ](http://www.lfd.uci.edu/~gohlke/pythonlibs/)からNumpyとSciPyをダウンロードする。
　numpy-1.11.0+mkl-cp35-cp35m-win32.whl
　scipy-0.17.0-cp35-cp35m-win32.whl
・「スタート」→「すべてのプログラム」→「アクセサリ」→「コマンドプロンプト」を右クリックして「管理者として実行」する。
・コマンドプロンプトでcdして、whlのあるフォルダに移動する。
・pipそのものを最新版にする。(version 8以上にしないとwhlファイルのインストールでエラーになる。)
　pip install --upgrade pip
・Numpyをインストールする。
　pip install "numpy-1.11.0+mkl-cp35-cp35m-win32.whl"
・SciPyをインストールする。
　pip install scipy-0.17.0-cp35-cp35m-win32.whl
・matplotlibをインストールする。
　pip install matplotlib
・scikit-learnをインストールする。
　pip install scikit-learn

4. Python 3.5を起動する。
・「スタート」→「すべてのプログラム」→「Python 3.5」→「Python 3.5 (32-bit)」をクリックして起動する。
railsで複数画像を一度にアップロードする方法

# railsのプロジェクトで複数ファイルを一度にアップロードしたい時があります!

そんなときにはこんな感じでやればうまくいく。という一例をまとめておきます。

## ①まずアップロードに使うviewを編集します

といっても、
`:multiple => true`をつければOK!

```rb:_form.html.slim
= form_for @photo do |f|
  - if @photo.errors.any?
    #error_explanation
      h2 = "#{pluralize(@photo.errors.count, "error")} prohibited this photo from being saved:"
      ul
        - @photo.errors.full_messages.each do |message|
          li = message

  .field.mb_20
    = f.label :content
    = f.file_field :content, :multiple => true
  .field.mb_20
    = f.text_field :title
  .actions = f.submit

```

ちなみ今回は、`:title`も一緒にアップロードすることにします

## ②次にControllerのStrong Parametersをmultipleに対応させます

hashっぽく{}でくくって、配列が入る事を指定します

```rb:controller.rb

def photo_params
  params.require(:photo).permit( :title, {content: []})
end

```

これで、photo_paramsでcontentの配列までとれるはずです。

## ③次にModelにメソッドを用意します

```rb:photo.rb

def self.create_photos_by(photo_params)

/* そもそも一枚も上がってきてない時のためのvalidate */
  return false if photo_params[:content].nil?
  
/* 途中でエラった時にRollbackするようにTransaction */
  Photo.transaction do 

/* アップロードされた画像を一枚ずつ処理 */
    photo_params[:content].each do |photo|
      new_photo = Photo.new(title: photo_params[:title], content: photo)
      return false unless new_photo.save!
    end
  end

  true
end

```

## ④じゃあ、作ったModelメソッドにparameterをぶん投げます

```rb:controller.rb

def create
  @photo = Photo.new(photo_params) /* ここはformatの部分で使うインスタンス変数用 */

  respond_to do |format|
    if Photo.create_photos_by(photo_params)
      format.html { redirect_to photos_path, notice: 'Photo was successfully created.' }
      format.json { render :show, status: :created, location: @photo }
    else
      format.html { render :new }
      format.json { render json: @photo.errors, status: :unprocessable_entity }
    end
  end
end

```

これで完成！
Gemfile にある Gem の説明を自動でコメントとして追記してくれる Gem

[AnnotateGem](https://github.com/ivantsepp/annotate_gem)

Gemfile に書かれている Gem の概要と Web サイトの URL を自動でコメントしてくれる Gem。チーム開発していて、全ての Gem が把握できていない場合とか便利そう。

# 使ってみる

AnnotateGem を入れて、

```
gem install annotate_gem
```


例えば以下のような Gemfile を用意してみる。

```rb:Gemfile
source 'https://rubygems.org'

gem 'rails'
gem 'jquery-rails'
gem 'haml-rails'
gem 'mysql2'
gem 'aws-sdk'
```

AnnotateGem を実行！

```
$ annotate-gem
Fetching gem metadata.......
```

すぐ終わった。
Gemfile を確認すると

```rb:Gemfile
source 'https://rubygems.org'

# Full-stack web application framework. (http://www.rubyonrails.org)
gem 'rails'
# Use jQuery with Rails 3 (http://rubygems.org/gems/jquery-rails)
gem 'jquery-rails'
# let your Gemfile do the configuring (http://github.com/indirect/haml-rails)
gem 'haml-rails'
# A simple, fast Mysql library for Ruby, binding to libmysql (http://github.com/brianmario/mysql2)
gem 'mysql2'
# AWS SDK for Ruby (http://github.com/aws/aws-sdk-ruby)
gem 'aws-sdk'
```

おー！コメントが追記されている！

# 中を見てみる

```rb:spec_finder.rb
module AnnotateGem
  module SpecFinder
    extend self
    ...
    def find_matching_specs_for(gem_lines)
      gem_lines.each do |line|
        matching_specs = Gem::Dependency.new(line.name).matching_specs
        # TODO: need to find latest
        line.spec = matching_specs.first if matching_specs.any?
      end
    end
```

```rb:gem_line.rb
module AnnotateGem
  class GemLine
  ...
    def description
      "#{spec.summary}" if spec
    end

    def website
      "#{spec.homepage.to_s}" if spec
    end

    def description_and_website
      output = "#{description}"
      output << " (#{website})" unless website.nil? || website.empty?
      output
    end
```

中を見てみると `find_matching_specs_for` メソッドで `Gem::Specification` を取得して、 Gem の summary と homepage を取得＆出力しているだけですね。

なるほどー。こういう使い方があったか。
ちょっとのアイディアで便利なライブラリが作れるもんですね。

あと

```
% tree annotate_gem-0.0.10/
annotate_gem-0.0.10/
├── Gemfile
├── LICENSE.txt
├── README.md
├── Rakefile
├── annotate_gem.gemspec
├── bin
│   ├── annotate-gem
│   └── annotate_gem
...
```

こういう風に Gem の bin 下に実行可能なファイルを置いておくと、コマンドラインから実行出来るようになるんですね。知らなかった！
設定ファイルのシンボリックリンクをホームディレクトリーにつくるツールをつくったはなし

新環境セットアップというのはいくらでもある。そのたびにホームディレクトリーにシンボリックリンクをはりまくるとかもうイヤだ、ということで作ってみた。

https://github.com/januswel/dotor

一応 sh や bat や powershell なんかでスクリプトを書いていたんだけど、これもいまさらどうなのよということで簡単にクロスコンパイルできる golang で書き直してみた。

1. https://github.com/januswel/dotor/releases から OS / アーキテクチャーにあったものを選んでダウンロード
2. ↑ページから dotor.yml も一緒にダウンロード
3. dotor.yml の中をながめて、足りないファイルがあったら書き足す
4. 使うマシンに設定ファイル群を持ってくる
    - github から clone でもいいし、古いマシンからコピーでもいい
5. dotor 実行
    - `dotor_<youros>_<yourarch> dotor.yml /path/to/your/dotfiles`

dotor.yml の書き方は中身をみて察してください。一応それ自体がすべての書き方が載ったサンプルなので。リンク元がなければ無視するし、リンク先がすでにあればこれも無視するという挙動なので多少雑でも環境が変になったりしない。

提供しているバイナリーの OS / アーキテクチャーは次。

- linux/amd64
- linux/arm
- darwin/amd64
- windows/amd64

OS / アーキテクチャーはいまさら 32bit を使いはじめるとかないだろうと思ったので amd64 と、 Linux は特殊なマシン使うこともあるかもなと思ったので arm を選択してる。追加して欲しいものがあれば↑の github のページから新しく issue たててください。

もちろん、デフォルト dotor.yml にこの設定もいれて、というのも issue で対応します。お気軽にどうぞ。
WordPress大好きな自分がPowerCMSで行政サイトを制作した時に役立った情報

普段はWordPress大好きで、中規模くらいまでだったらWordPress使いまくっている私ですが、とある事情でPowerCMSで行政サイト（大規模）を制作する事になりました。
その時に役立ったサイトや情報をメモに残しておきたいと思います。

#WPとの違いとMTの現状
CMSのシェア争いにはすでに負けているのでネット上でカスタマイズの情報はほとんど出てきません。コピペプログラマには地獄です。プラグインはWPで標準機能、又は無料プラグインでできるような事は大体有料プラグインで存在します。再構築の時間が長すぎて煙草一本吸えます。MT単体で考えると選定の段階で消滅します。
ただ、企業向けに寄り添ってきた過去から大規模サイト向けのプラグインが存在しており、そこを考慮すると選定の中に入ってくるのではないでしょうか。特に「JIS X 8341」あたりがポイントになります。

#[PowerCMS](http://www.powercms.jp/)
[http://www.powercms.jp/](http://www.powercms.jp/)
MovableTypeの有料拡張パックみたいなものです。
有料で高いですが、基本性能で何世代か遅れているMTを行政サイトで使えるレベルまで引き上げてくれます。

|プラン|ライセンス|料金|
|:--|--:|--:|
|Standard|1サーバ/5ユーザー|300,000円（税抜）|
|Professional|1サーバ/無制限ユーザーライセンス|600,000円（税抜）|
|Enterprise|1サーバ/無制限ユーザーライセンス|900,000円（税抜）|
|Advanced|マルチサーバ/無制限ユーザーライセンス|1,800,000円（税抜）|

機能によってプランに差がありますが、おすすめはEnterpriseか、ひとつ下のProfessionalです。

更に「JIS X 8341」の要件に対応する為に下のプラグインも導入します。ユーザーが投稿した記事に対してチェックする機能が目的です。
[PowerCMS 8341](http://www.powercms.jp/news/powercms-8341.html)

    Movable Type + PowerCMS 8341 : 27万円
    PowerCMS Standard + PowerCMS 8341 : 48万円
    PowerCMS Professional + PowerCMS 8341 : 76万円
    PowerCMS Enterprise + PowerCMS 8341 : 100万円
    PowerCMS Advanced + PowerCMS 8341 : 180万円(無償バンドル)



##インストール
プラグインを大量に使うため、コンソールから必要なperlのライブラリを入れないといけません。WordPressしか知らないと管理画面からインストールが完結しない事に驚くかもしれないですが、どうしようもありません。**社内にサーバーに強い人がいないとこの時点で積みます。**

##サポート
現在MTでのサイト構築はネット上のブログ記事が古いものばかりで苦労します。PowerCMSにはアルファサード社のサポートがついているので、「こんな機能を実現したいんだけども」「この機能がうまく動かない」とかメールで送るとサンプルコードを添えて答えてくれたりします。これは製作時かなり助かりました。

##公式ドキュメント
[http://www.powercms.jp/document/](http://www.powercms.jp/document/)
ここが情報源のメインになります。一応ほぼおなじ内容の紙のテキストがライセンス購入時に頂けます。５センチくらい厚さがあります :sweat_smile: 

##カスタマイズ
Junnama Online
アルファサード株式会社 代表 野田純生 のプライベートなBlog。
[http://junnama.alfasado.net/online/](http://junnama.alfasado.net/online/)
PowerCMSを作っている社長様のブログです。現場からよく要求されるようなカスタマイズが書かれており助かりました。

##プラグインを探す
Build Best MT Ever.
[https://plugins.movabletype.jp/](https://plugins.movabletype.jp/)
古いブログ記事からプラグインを探すより速いと思います。

Movable Type プラデミー賞 2015 発表！
[http://www.movabletype.jp/blog/2015-pludemy-goes-to.html](http://www.movabletype.jp/blog/2015-pludemy-goes-to.html)
ランキングに入っているものは定番プラグインばかりなので、ほとんどインストールすることになります。

***
#まとめ
有料CMSという事で、詰みそうな時のメールサポートは助かりました。WordPressでプラグインが必要な場面も標準でついており、マニュアルまであるというのは工数の時間短縮に繋がります。ただ**WordPressと比較してしまうと、有料プラグインだよりだったりする事がかなり多いように感じました。**サイトの規模、特に管理者アカウントが少ない場合使うメリットは低いように思います。
WordPressの本番環境をローカル環境に構築


本番にあるWordPress環境をローカル環境に置くには、5つの手順があります。

- 本番の「wp-admin、wp-content、wp-includes」がある全てのファイルをダウンロード
- ローカル環境のWordPressテスト環境をXamppまたは、Mampで設定
- phpMyAdminを本番からsqlファイルをエクスポート（レンタルサーバーのケースの場合は、パスをローカル環境に変更。）
- ローカルのphpMyAdmin「http://localhost/phpmyadmin/」 アクセスしてデータベースを作成。
- 作成したデータベースにsqlファイルをインポート。
- ダウンロードしてきた本番環境のファイル「wp-config.php」をでローカルのデータベースに合わせる。（ここではまりました。。）

```php
define('DB_NAME', '作成したデータベース名');

/** MySQL のユーザー名 */
define('DB_USER', 'root');

/** MySQL のパスワード */
define('DB_PASSWORD', '');

/** MySQL のホスト名 (ほとんどの場合変更する必要はありません。) */
define('DB_HOST', 'localhost');

/** データベーステーブルのキャラクターセット (ほとんどの場合変更する必要はありません。) */
define('DB_CHARSET', 'utf8');

/** データベースの照合順序 (ほとんどの場合変更する必要はありません。) */
define('DB_COLLATE', '');
```
ローカル環境では、MySQLのIDはデフォルトのrootで、パスワードはローカルでは不要。そしてホスト名はlocalhostと。これでどんだけ困ったか。。

上記を設定後には、仮想サーバーで設定したローカルのパスで表示されます！

Windows環境ですが、以下のブログにはかなり助けられました。ありがとうございます！

引用：<a href="http://www.virment.com/duplicate-local-server-wordpress/#wordpress_Bwp-configphp" target="_blank">Wordpressの本番サイトをローカル環境に再構築するための６ステップ</a>
引用：<a href="http://yutasano.com/2014/02/21/wordpress-rocal-xampp/" target="_blank">WordPressの本番環境をそのままローカル環境に移行する方法！まじ大変でした。。</a>
黒い窓使うよりConEmu使うのが便利だよ、PuTTYも超絶いいよ

# GWって美味しいの？
世間様では10?11?連休らしいですねGW。美味しいのかな？それｗ
と、なんだかGW休めたので久しぶりにネタ帳からの投降です。ちなみにwindowsす。

# コンソールエミュレータ
コンソールエミュレータなにそれ？ってなるですよね。私も上手い事説明できないですがこのConEmu端的に言うと「裏面のコマンド同じだけど、表面を便利にするツール」ってことで思ってればOK。エミュレータ自体「模倣、疑似」とかあるけどConEmuは実際に裏でコマンド実行してるからねｗ

# ConEmuダウンロード
[ConEmu公式サイト](http://www.fosshub.com/ConEmu.html#clickToStartDownload)からダウンロードする。バージョン新しいのがどうしても使いたい！！ぜ！！って以外はStable を選択する。よろし。インスコも英語でなんだか問われるがNext, okでok。起動するとまた問われるけどまあ普通にokでいい。

# Ricty Diminished フォント
日本語フォントがださいので、[Ricty Diminished フォント](http://qiita.com/murachi1208/items/513ffa243a879ee250f2)をダウンロード＆インスコする。

# やることは１つ！！！だぜ！！
ウィンドウの左上マークを右クリックし「Settings」を選択。
![image](https://qiita-image-store.s3.amazonaws.com/0/44540/d291d63a-451e-9d98-71f8-4107be9d1075.png)

そうしたら「Main」の画面設定がでるので「Main console font」をRicty Diminishedに変更。Monospaceのチェックを外す。これだけ！！

![image](https://qiita-image-store.s3.amazonaws.com/0/44540/8b1b2f7a-e75e-5800-7680-a5154451a466.png)

# PuTTYもConEmuで使うことができる
[ConEmu + PuTTYでSSHクライアントを快適に使う（Windows版）](http://kuroeveryday.blogspot.jp/2015/10/ConEmu-PuTTY.html)を見て設定すればよろし。

```
"C:\Program Files (x86)\PuTTY\putty.exe" -new_console -load "yoursavedsession"
```

![image](https://qiita-image-store.s3.amazonaws.com/0/44540/01f6007d-207c-f4e4-2022-237dd174e33a.png)

# 縦横に分割画面にしたい
「+」のマークをクリックする。
Create new console 部分が判りずらいんだけども。そんときはこの[記事を参考](http://system.normalblog.net/conemu/download_install_settings/)にしてみる。ぐれいと！だぜ！

![image](https://qiita-image-store.s3.amazonaws.com/0/44540/1abc452b-3069-3093-d574-59520c09d623.png)
gcloud-pythonを使って、GCSを経由せずにデータをBigQueryに投入する 

ちょっとしたデータを、ローカルからGCS経由せずにBigQueryにデータをアップロードしようとするなら、普通はGoogle Cloud SDKのbqコマンドを使うと思います。

ただ、[EC2のスポットインスタンスで動かしている日次バッチから自動でアップロードしたい](http://qiita.com/pyr_revs/items/c7f33d1cdee3118590e3)とか考えた時に、Cloud SDKのセットアップ自動化と認証の設定が存外面倒な感じがしておりまして。

pythonのgcloudパッケージを使うと、少なくともセットアップ自動化・認証の設定は楽に行けたので、メモを残しておきます。

> Google Cloud Python Client
> https://github.com/GoogleCloudPlatform/gcloud-python

# 準備

## サービスアカウントの設定

GCPのサービスアカウントを設定して、認証用のjsonを予め取得しておくことが必要。

詳細は「GCP サービスアカウント」等で検索していだければ。

## gcloudパッケージのインストール

pipで一発で入ってくれるはず。

```shell-session
pip install gcloud
```

# Code

以下を保存して`python -u upload.py`で実行。タブ区切り、一行目はheader、同じ名前のテーブルが既にあったら消すの設定になってますので、適宜変更していただければ。

```py:upload.py
from gcloud import bigquery
from gcloud.bigquery import SchemaField

json_key = '/my-folder/my-project-xxxxxxxxxxxx.json'
project_name = 'my-project-1234'
dataset_name = 'my-dataset'


def run():
    schema = [
        SchemaField('Col1', 'INTEGER', mode='required'),
        SchemaField('Col2', 'BOOLEAN', mode='required'),
        SchemaField('Col3', 'STRING', mode='nullable'),
        SchemaField('Col3', 'FLOAT', mode='nullable'),
    ]
    input_file_path = '/my-folder/input.txt'
    header_rows_to_skip = 1
    table_name = 'MyTable'
    csv_delimiter = '\t'
    delete_existing_table = True
    upload_one_csv_to_bq(input_file_path, csv_delimiter, header_rows_to_skip, table_name, schema, delete_existing_table)


def upload_one_csv_to_bq(local_csv_file_path, delimiter, header_rows_to_skip, 
                         table_name, table_schema, delete_existing_table):
    client = bigquery.Client.from_service_account_json(json_key, project=project_name)
    dataset = client.dataset(dataset_name)
    table = dataset.table(name=table_name)
    if delete_existing_table:
        if table.exists():
            print 'Delete existing table: ' + table_name
            table.delete()
    table.schema = table_schema
    table.create()
    with open(local_csv_file_path, 'rb') as file_obj:
        table.upload_from_file(file_obj, 'CSV', field_delimiter=delimiter, skip_leading_rows=header_rows_to_skip, ignore_unknown_values=False)
    print 'Done'


###########
# Entry Point
###########
if __name__ == "__main__":
    run()

```

Amazon Linux 2016.03のpython2.7.10と、手元のwindowsに入っているpython 2.7.11では動きました。日本語含むデータでもUTF-8なら行けますね。


# 余談

最初は適当にぐぐって出てきた以下を見ながらやってたんですが(Inserting data (synchronous)の項)、Windowsでは動くのに、EC2に持ってくと`table.insert_data(rows)  # API request`のあたりで「broken pipe」などと嫌なエラーが。

> https://googlecloudplatform.github.io/gcloud-python/stable/bigquery-usage.html

で、いろいろ回り道した挙句`table.upload_from_file`を使うという形に。まあ、問題が出たら諦めてコード読むことをお勧めします

> https://github.com/GoogleCloudPlatform/gcloud-python/tree/master/gcloud/bigquery
VSCODE my tips

my environment
windowns7 64bit
***
[debugger-for-chrome] Cannot connect to the target: connect ECONNREFUSED 127
![image](https://qiita-image-store.s3.amazonaws.com/0/64462/6c74e658-8cd5-1af3-2665-4618a01ed430.png)

対応 : chromeを一旦全て閉じる。その後 [デバッグ] 押下でchrome自動起動してつながる。
原因 : 未調査
solve : before debugging close all chrome tabs,after run debug button
[ref.Cannot connect to the target (github)](https://github.com/Microsoft/vscode-chrome-debug/issues/111)

```json:launch.json
{
	"version": "0.2.0",
	"configurations": [
		{
			"name": "Launch localhost",
			"type": "chrome",
			"request": "launch",
			"url": "http://localhost/myApp/",
			"sourceMaps": false,
			"webRoot": "${workspaceRoot}"
		}
	]
}
```

***
react-modalでUncaught TypeError: Cannot read property 'appendChild' of null

# react-modalでUncaught TypeError: Cannot read property 'appendChild' of null
## Documentには...

Githubの[公式Document](https://github.com/reactjs/react-modal)にはデフォルトではdocument.bodyがしていされるとのこと

```js
/*
By default the modal is anchored to document.body. All of the following overrides are available.

* element
Modal.setAppElement(appElement);

* query selector - uses the first element found if you pass in a class.
Modal.setAppElement('#your-app-element');

*/
```

ただ、やってみると空でダメだった。前に使った時は特に何もせずとも動いていたので原因がわからなかった。なんとなく、DOMとｊｓの読み込みのタイミングの差かなと思っていろいろ調べてみたが、DOMはきちんと読み込まれているのにModal

## 解決策
jsxでModalの記述を行う直前に手動でdocument.bodyをセットしてあげると動いた。
ドキュメントを読むのをサボっていたのでかなり時間を食った。。。
コードを読むより、ReadMeがあるなら先にそっちをちゃんと読みましょう。。。。

```js
Modal.setAppElement(document.body)
```
xibでCustomCellを作成した際のエラー


#問題のエラー
カスタムセルをXibで作ったところ実行時に下記のエラーが出てハマりました。
**'NSInternalInconsistencyException', reason: 'invalid nib registered for identifier (AddMenuCell) - nib must contain exactly one top level object which must be a UITableViewCell instance'**


#原因
原因はカスタムセルのXibファイルの中。
位置を考えながら移動しているうちにひとまずCellの外に置いたLabelが残っており、これを別のViewとして認識されたいたのが原因。



![スクリーンショット](https://qiita-image-store.s3.amazonaws.com/0/99711/c2e98036-3ebc-fe64-3fbd-624064a88b5d.png)

#解決策
Labelを消せば問題なく動作しました


#参考情報

[stackoverflowの情報](
http://stackoverflow.com/questions/20442311/invalid-nib-registered-for-identifier-cellname-nib-must-contain-exactly-one)
既存コードをRxJava対応する際に気をつけるべきこと

Grokking RxJava, Part 4: Reactive Androidを読んでいたら、前にこういう誤った実装をしていたところがあったので書いてみました。

## Old, Slow Code

RxJavaにサポートしていないライブラリや、Observableを返したい既存コードがあった場合にどのように対応しますか？大体の場合は、既存の古いコードをそのままに、新規コードから古いコードを呼び出すようにするかと思います。

下記の例のように、殆どの場合は```Observable.just()```または```Observable.from()```で```Observable```を作るだけで十分です。

```java
private Object oldMethod() { ... }

public Observable<Object> newMethod() {
    return Observable.just(oldMethod());
}
```

ですが、この```oldMethod```の処理が軽いものであれば問題なく動きますが、とても重たい時間のかかる処理だったらどうでしょうか？その場合に問題が発生します。なぜなら```Observable.just()```を通る前に、```oldMethod()```を呼び出すためスレッドをブロックしてしまうからです。

この問題を回避するには、重たい処理を```defer()```でラップして返すようにしてください。

```java
private Object slowBlockingMethod() { ... }

public Observable<Object> newMethod() {
    return Observable.defer(() -> Observable.just(slowBlockingMethod()));
}
```
これで、```slowBlockingMethod()```はsubscribeされるまで呼ばれず、```Observable```が返されます。

## 参考
Grokking RxJava, Part 4: Reactive Android
http://blog.danlew.net/2014/10/08/grokking-rxjava-part-4/
IEでmargin:autoが効かない（センターに寄らない）

詰まったのでメモ。
どこ調べてもtext-align:centerのこと言われますが、
自分はそれでは治りませんでした。。

## 1.不具合内容

IEで表示したときだけ一部の要素が真ん中に寄らない。

<b>header
main
footer</b>

とあって、mainだけ中央に寄らない。

### 1-1.IEのバージョン
２つで試しました。

| OS | IE version | Result |
|:--|:----|:---|
|Windows8.1 | 11.0.9600 | 中央に寄らない |
|Windows10 |Edge　　　　|中央に寄る|


### 1-2.ページの構造(html)
```index.html
<header>
  <div class="center">
  </div>
  <nav class="center">
  </nav>
</header>
<main class="center">
  <!--  ★この領域がセンターに寄らない  -->
</main>
<footer>
  <div class="center">
  </div>
</footer>
```

### 1-3.ページの構造(css)
```style.css
.center {
	width: 960px;
	margin:0px auto;
}
```

## 2.原因
bodyタグ内の１階層目には margin:0px auto; センター寄せができないみたい。
ちなみに text-align:center も効きませんでした。

## 3.対策
単純に２階層目にズラしました。

```index.html
<header>
  <div class="center">
  </div>
  <nav class="center">
  </nav>
</header>
<main>
  <div class="center">
  <!--  ★header, footerのようにセンターに寄る！！  -->
  </div>
</main>
<footer>
  <div class="center">
  </div>
</footer>
```

## 4.原因
<del>わからない（笑）</del>

有識者の方々にコメントいただき、判明しました。
（myakura@githubさん、tsuyoshi_choさん、ありがとうございます！）

<b>myakura@github さんより</b>

> IEでは「mainという名前のついた見知らぬ要素」として扱われています。
> で、こうした要素のスタイルはdisplay: inlineとして扱われるので、
> margin: 0 autoによるセンタリングがききません。

<b>さらにtsuyosh_choさんより</b>

コメントいただいていた[別の方のIE向け別対策](http://qiita.com/koichi_amami/items/b70f0015ccb4b4c4eae9)でも取り上げられていましたが、
IE11では、mainにブロック要素を指定しないと
デザインが崩れてしまうケースがあるみたいです。

Web屋さんは大変だなと痛感しました…
というわけで、別対策をば。

## x.追記:別対策
別の対策がありました。


このmain要素に display:block; とするだけで解決です。
（本当はIE11にだけ適応するのがベストだと思います）

```style.css
.center {
	width: 960px;
	margin:0px auto;
}

/* ★追加 */
main {
	display:block;
}
```
typescriptはクラスをインターフェイスとして使えるらしい

# typescriptはクラスをインターフェイスとして使えるらしい

## はじめに

あるオブジェクトに機能を追加したい場合に、委譲するコードを書くことがある。
それそのものとしてのインターフェイスが欲しい場合にはクラスをインターフェイスとして使える

例えば以下の様なオブジェクトがあるとする。

```typescript
class Container {
  constructor(public value: number) {}

  display() {
    return `node: ${this.value}`;
  }
}

console.log(new Container(10).display());
// "node: 10"
```

この `Container` オブジェクトに対して何らかの機能を追加したオブジェクトを作りたい。継承ではなく委譲を使った場合のコードについて考えてみる。

## まじめにインターフェイスを定義する

通常は以下の様にインターフェイスを書く(`implements` を明示的に指定する必要はないかもしれない)

```typescript
interface IContainer {
  value: number;
  display(): string;
}

class PositiveContainer implements IContainer {
  constructor(public c: Container) {}

  get value(): number {
    return this.c.value;
  }

  set value(value: number) {
    if (value < 0) {
      throw new Error(`${value} is not positive.`);
    }
    this.c.value = value;
  }

  display() {
    return this.c.display();
  }
}
```

明示的にimplementsをしたい理由として、委譲元のオブジェクトに機能が追加された時にコンパイルの時点でそれをみつけて欲しいというのがある。

まじめにインターフェイスを定義した場合には、元のオブジェクトと定義したインターフェイスの同期がとれていないとコンパイルエラーにはならない。

## クラスをインターフェイスとして使う

`implements` の後にクラスを指定した場合に、指定したクラスがインターフェイスとして扱われる。
デコレーター的なオブジェクトを作ろうとした時には便利なような気がしている。
(もっとも、元のオブジェクトと異なるインターフェイスを定義したいという場合もあるのでそのような場合は真面目にインターフェイスを定義するべき)

```typescript
// IContainerを定義せずに`implements Container` と書いている
class PositiveContainer2 implements Container {
  constructor(public c: Container) {}

  get value(): number {
    return this.c.value;
  }

  set value(value: number) {
    if (value < 0) {
      throw new Error(`${value} is not positive.`);
    }
    this.c.value = value;
  }

  display() {
    return this.c.display();
  }
}
```

# 参考

typescriptのhandbookにクラスをインターフェイスとして使う例としてmixinを行う例があった

- [Mixins · TypeScript](https://www.typescriptlang.org/docs/handbook/mixins.html)

Wrote by [PileMd](https://pilemd.com/)
Webサービス・クライアントの作成

Webサービス・クライアントについて、主に以下の３つのコーディング方法があります。
　- ディスパッチ・クライアント
　- 動的プロキシー・クライアント
　- Spring JaxWsPortProxyFactoryBeanの利用

# ディスパッチ・クライアント

ディスパッチベースのWebサービスクライアントの実装例です。

```java
// サービス名
QName serviceName = new QName("sample.test.co.jp:wsdl","SampleService");
// ポート名
QName portName = new QName("sample.test.co.jp:wsdl","SamplePort");
// WSDL URL
URL wsdlLocation = new URL("http://localhost:8080/Sample/SampleImp?wsdl");

// リクエストSOAPMessageインスタンスの作成
MessageFactory mf = MessageFactory.newInstance(SOAPConstants.SOAP_1_2_PROTOCOL);
SOAPMessage requestMessage = mf.createMessage();
requestMessage.getSOAPBody().addDocument(requestXmlDoc);
requestMessage.saveChanges();

// Webサービスインスタンスの作成
Service service = Service.create(wsdlLocation, serviceName);
// ディスパッチインスタンスの作成
Dispatch<SOAPMessage> dispatch = service.createDispatch(portName, SOAPMessage.class, Service.Mode.MESSAGE);
// メッセージの送信
SOAPMessage responseMessage = dispatch.invoke(requestMessage);
```

# 動的プロキシー・クライアント

動的プロキシーベースのWebサービスクライアントの実装例です。

```java
// サービス名
QName serviceName = new QName("sample.test.co.jp:wsdl","SampleService");
// ポート名
QName portName = new QName("sample.test.co.jp:wsdl","SamplePort");
// WSDL URL
URL wsdlLocation = new URL("http://localhost:8080/Sample/SampleImp?wsdl");

// Webサービスインスタンスの作成
Service service = Service.create(wsdlLocation, serviceName);
// プロキシインスタンスの作成
SampleService port = service.getPort(portName, SampleService.class);
// メソッドの呼出
OutputBean result = port.execute(inputBean);
```

# Spring JaxWsPortProxyFactoryBeanの利用

Webサービスの動的プロキシを公開するためにSpring JaxWsPortProxyFactoryBeanを利用する実装例です。

```xml
<bean class="org.springframework.remoting.jaxws.JaxWsPortProxyFactoryBean" id="sample">
    <property name="serviceInterface" value="jp.co.test.wsdl.Sample />
    <property name="wsdlDocumentUrl" value="http://localhost:8080/Sample/SampleImp?wsdl" />
    <property name="namespaceUri" value="sample.test.co.jp:wsdl" />
    <property name="serviceName" value="SampleService" />
    <property name="portName" value="SamplePort" />
    <property name="lookupServiceOnStartup" value="false" />
</bean>
```

動的プロキシを実行する。

```java
@Component
public class SendProductInfo {
	
    @Autowired
    private Sample sample;

    @Override
    public OutputBean execute(InputBean inputBean) {
        // プロキシの実行
        OutputBean result = sample.execute(inputBean);
    }
}
```
Ipythonを使ってみた


###Ipython NoteBook(jupyter)の使い方

##1. Ipythonの立ち上げ
	
	```
	$ ipython
	```
	terminal上でと打ち込むと
	
	```
	$ ipython
	Python 3.5.1 |Anaconda 2.5.0 (x86_64)| (default, Dec  7 2015, 11:24:55)
	Type "copyright", "credits" or "license" for more information.
	
	IPython 4.0.3 -- An enhanced Interactive Python.
	?         -> Introduction and overview of IPython's features.
	%quickref -> Quick reference.
	help      -> Python's own help system.
	object?   -> Details about 'object', use 'object??' for extra details.
	
	In [1]:
	```
	
	
このように出てくる
ここでいつも通りpythonのインタラクティブモードと同じように使える
	
##2. Ipython notebook(jupyter)の立ち上げ


teminalで入力
	
	```
	$ ipython notebook
	[I 18:53:37.307 NotebookApp] The port 8888 is already in use, 	trying another random port.
	[I 18:53:37.373 NotebookApp] Serving notebooks from local 	directory: /Users/hoge/test
	[I 18:53:37.374 NotebookApp] 0 active kernels
	[I 18:53:37.374 NotebookApp] The Jupyter Notebook is running at: 	http://localhost:8889/
	[I 18:53:37.374 NotebookApp] Use Control-C to stop this server 	and shut down all kernels (twice to skip confirmation).
	```


こんな感じにteminalがなる
そしてブラウザ上にjupyterが起動する
	


![スクリーンショット 2016-03-03 18.54.24.png](https://qiita-image-store.s3.amazonaws.com/0/89142/0962b614-51cd-56ef-e38d-73c924d7c8d0.png "スクリーンショット 2016-03-03 18.54.24.png")

次に1.と同じような画面を出します

![スクリーンショット 2016-03-03 19.10.01.png](https://qiita-image-store.s3.amazonaws.com/0/89142/0a43379f-3c2b-73a2-5c65-775c356ab053.png "スクリーンショット 2016-03-03 19.10.01.png")
Notebooksのところのpythonのバージョンが書いてあるところをクリック
ここでは、 *python3* をクリック

![スクリーンショット 2016-03-03 19.13.27.png](https://qiita-image-store.s3.amazonaws.com/0/89142/efcec868-c099-4e30-3afa-f6760eff6312.png "スクリーンショット 2016-03-03 19.13.27.png")
このようになり、ここで、pythonのコードを打ち込み作業をしていきます
書いたものは自分のipython notebookを起動したディレクトリに保存されていきます
ブラウザ上で実行とセルフやしを同時に行うには[ *Command + return* ]で可能です

終了するときは [ *Command + C* ] で終了できる。
FileZillaの各設定


### FileZillaの転送速度を上げる

- [編集]→[設定]
- [転送]→[最大同時転送数]を10に変更。

引用：<a href="http://bashalog.c-brains.jp/11/02/03-210950.php" target="_blank">FileZillaにてファイル転送を高速にする方法 | バシャログ。 | 横浜でWeb制作を行うシーブレインスタッフによる技術情報ブログ</a>
historyコマンドの設定


これで時間が表示されるようになります

```bash
vi ~/.bashrc
```

```bash:.bashrc
HISTTIMEFORMAT='%y/%m/%d %H:%M:%S '
```

履歴のサイズを変更します

```bash
echo $HISTSIZE
```

```bash
HISTSIZE=10000
```

これで10,000に変更されました

```bash
echo $HISTSIZE
```

これでls、historyのコマンドはhistoryから除外されます

```bash
HISTIGNORE=ls:history       
```
Transform.RotateやTransform.Translateで思うように動かない時の対処法

Transfrom.RotateやTransform.Translateで思うような挙動にならない時はだいたいこれなのでまとめます．

# 症状の例
- オブジェクトを前に飛ばしたいのに，変な方向へ行ってしまう．
- x軸で回転させた後,y軸で回転させると思うような方向へ回転しない．


# 原因
デフォルトがローカル座標である．
<img width="1010" alt="スクリーンショット 2016-05-04 14.48.48.jpg" src="https://qiita-image-store.s3.amazonaws.com/0/113504/c075f2c4-9aa3-cdd9-7175-59cf6026a3e7.jpeg">

# 解決策
speedとangleはあらかじめ宣言しておく．
## 正面(キャラクターのZ軸正の方向)に進みたい時

```csharp:GoStraight1.cs
this.transform.Translate(Vector3.forward * Time.deltaTime * speed);
```

もしくは

```csharp:GoStraight2.cs
this.transform.Translate(this.transform.forward * Time.deltaTime * speed, Space.World);
```

## ワールド座標のx軸で回転したい時
```csharp:ObjectRotate.cs
this.transform.Rotate(Vector3.right * angle, Space.World);
```
# 参考
リファレンス
[Transform.Translate]
(http://docs.unity3d.com/ja/current/ScriptReference/Transform.Translate.html)
[Transform.Rotate]
(http://docs.unity3d.com/jp/current/ScriptReference/Transform.Rotate.html)
UITextView 文字高に合わせてサイズ変更

```
sampleText.text = "適当な長さの文字を設定・・・・・"
print("sampleText Size = \(sampleText.frame)")
sampleText.sizeToFit()
print("sampleText Size after sizeToFit = \(sampleText.frame)")
```

ログ出力結果。sizeToFit後の実際のテキスト量だけのサイズになっている。
sampleText Size = (0.0, 0.0, 1024.0, 768.0)
sampleText Size after sizeToFit = (0.0, 0.0, 326.0, 133.0)
モノの数を数える変数名の命名 は fooCount の形式が良いみたい

数えるモノの名前を仮に foo として「foo の個数」を、プログラミングの文脈ではなく素朴に英訳すると「number of foos」になるが、これを元に変数名にすると長いし何か落ち着かない。などと以前から思いつつ何となく流していた。ふと、少し調べてみた。

英語ネイティブの言語感覚で fooCount が比較的多くの人が合意しうる案のようだ。


##ざっと読んでの要点メモ

* number では foo に関する何の数字か分からない。count ならば個数のことであることが示唆される。（書籍「CODE COMPLETE」にこの曖昧さについて記述があるらしい。）
* number には名詞、count には動詞の感じがある。が、辞書的には両方ともどちらにも使えて（動詞）「数える動作」（名詞）「そうやって得た数」の意味がある。
* count には数え上げて総計を求める動作の感じを伴う。数え上げた結果の数ならこれが自然。
* この数え上げ動作の感じがあるので、定数の場合には不自然と見る向きもある。この場合の別案としては MAX_FOOS があり。
* length や size という手もある。ただし個数というよりは物理的な長さの印象が伴う。foo を収めている集合構造（配列、リストなど）についてならばあり。
* 場合によっては foos もありだが、foo の集合構造を保持する変数と間違われる可能性がある。個々の foo の中身に興味がない場合などに限定される。
* "number of foos" をベースとする流儀での命名例: numFoo,  nFoo, nrFoo
* Quantity (qty) 派は命名に言及している英語記事を見つけられなかった。


##参考にしたページ

-[Naming conventions for “number of foos” variables](http://stackoverflow.com/questions/3742650)
-[How to name a variable: numItems or itemsCount or itemCount?](http://stackoverflow.com/questions/6358588)
-[variable naming: count vs. number vs. numberOf vs n vs. length, ...](https://www.reddit.com/r/readablecode/comments/21tvjj/variable_naming_count_vs_number_vs_numberof_vs_n/)
-[「～の数」という変数名はどうつけますか？](https://teratail.com/questions/12285)


２ちゃんねる プログラム板「クラス名・変数名に迷ったら書き込むスレ。」にも何回か話題が出ているが、ちょっと残念な感じなので省略。
RHEL 7でkickstart

VirtualboxにRHEL 7を自動インストールする為にkickstartを使ってみました。
yumによるインストールの例でDockerを入れています。
`YOUR_USERNAME`と`CLEAR_TEXT_PASSWORD`は自分のRed Hatのサブスクリプションに合わせて修正して下さい。

このファイルをhttpでアクセス出来る場所に置いてRHELのCD ROMを入れて立ち上げた起動画面でTABキーを押し、最後に`ks=http://192.168.0.5:8000/anaconda-ks.cfg`のように定義ファイルを指定します。
![kickstart.jpg](https://qiita-image-store.s3.amazonaws.com/0/101760/fc187a8b-ff5c-1c1c-5a46-4f8eea569b7a.jpeg)

``` anaconda-ks.cfg
#version=DEVEL
# System authorization information
auth --enableshadow --passalgo=sha512
repo --name="Server-HighAvailability" --baseurl=file:///run/install/repo/addons/HighAvailability
repo --name="Server-ResilientStorage" --baseurl=file:///run/install/repo/addons/ResilientStorage
# Use CDROM installation media
cdrom
# Use graphical install
graphical
# Run the Setup Agent on first boot
firstboot --enable
ignoredisk --only-use=sda
# Keyboard layouts
keyboard --vckeymap=jp --xlayouts='jp'
# System language
lang ja_JP.UTF-8

# Network information
network  --bootproto=dhcp --device=enp0s3 --ipv6=auto --activate
network  --hostname=rhel7

# Root password is PASSWORD
rootpw --iscrypted $6$37a5ec68c43d0522$8lqJNDajgg362q9pBFWWWztFLELotDEbwTaRjX3Zvz37Hq/2VViawgl0IZxSFTQdJ9y7sUUY8cXjt.ZBS834m/
# System timezone
timezone Asia/Tokyo --isUtc
# password is PASSWORD
user --groups=wheel --name=rhel7 --password=$6$a58429ffe28bf988$aB52XqWFRhmXf2LGkDFVujcgZjGZr44cuGoCv1OEF2Ou2Iw7R7E7Ip8FDNRmQxjNS.cBCh/uSDB1pJl1kzu9T/ --iscrypted --gecos="Red Hat"
# System bootloader configuration
bootloader --append=" crashkernel=auto" --location=mbr --boot-drive=sda
autopart --type=lvm
# Partition clearing information
clearpart --all --initlabel --drives=sda

%packages
@^minimal
@core
kexec-tools

%end

%post --log=/root/registration_results.out
subscription-manager register --auto-attach --username=YOUR_USERNAME --password=CLEAR_TEXT_PASSWORD

subscription-manager repos --enable=rhel-7-server-extras-rpms
subscription-manager repos --enable=rhel-7-server-optional-rpms
# Docker
yum install -y docker docker-registry
yum install -y device-mapper-libs device-mapper-event-libs
systemctl start docker.service
systemctl enable docker.service

%end

%addon com_redhat_kdump --enable --reserve-mb='auto'

%end

# Reboot after installation
reboot --eject
```

# ハッシュされたパスワードの設定

* Macの場合
  `php -r 'echo crypt("PASSWORD","$6$".sha1(uniqid(mt_rand(),true))), PHP_EOL;'`

* RHELの場合
  `python -c 'import crypt, random, hashlib; random.seed(); print crypt.crypt("PASSWORD", "$6$" + hashlib.sha1(str(random.random())).hexdigest())';`

* RHEL7の場合、こっちの方が簡単でした
  `grub2-mkpasswd-pbkdf2`

# 参考
* [perl, php, python の標準モジュールで /etc/shadow の hash を生成する方法](http://tkuchiki.hatenablog.com/entry/2015/01/21/203017)
* [Anaconda kickstart and rootpw option](http://serverfault.com/questions/588532/anaconda-kickstart-and-rootpw-option)
機械学習の森、数学の剣～探索者による憧憬～

注：私は数学も機械学習も専門家ではありませんので、誤りがある可能性があります。

# 機械学習の基礎を固めるための数学
* 微分積分、線型代数、確率統計（など継続予定）

# 最新の流行を追うための数学
* [トポロジカルデータアナリシスに必要な数学](http://qiita.com/aokikenichi/items/8c86e0b498e5fbe5776a)
* 情報幾何（など継続予定）

---
# 本記事のめあて
数学の入門は微分・積分と線型代数であり、数学の3大分野は解析、代数、幾何だということは分かるのですが。じゃぁ、そのあとどう学んで行くのだ？現代数学の基礎である集合はどこに位置づけられるのだ？となると曖昧模糊としてくる。大学のシラバスを探しても大学毎に、同内容で科目名が異なったり、同じ科目名で内容が異なったりしている。集合も大抵の本の1章か巻末にちょろっと記載されていて、どの時期に本気で学ぶのか分からない。
岩波講座現代数学への入門、基礎、展開と応用数学が入門から最先端まで網羅しているようなので、それを足がかりに調べてみる。

幸い、岩波現代数学への入門の『現代数学の流れ１』に現代数学への入門シリーズを読んでいく順番の推奨の図が示されている。ただ図では『微分と積分２』の前提は『微分と積分１』だけとなっているのだが、『微分と積分２』の巻頭を見ると『微分と積分１』と『行列と行列式１』を前提知識としている……

既にこのシリーズを読んだ方が推奨の順番を図にしてくださっている。[現代数学への入門](http://ufcpp.net/study/math/miscmath/gendai/)。でも『現代数学の流れ１』の図とも違うなぁ……

また、WEB上の文書をまとめてくださっている方もいる。[大学の理工系の講義ノートPDFまとめ （数学・物理・情報・工学）](http://language-and-engineering.hatenablog.jp/entry/20140620/PDFLectureNotesOnUniversity)。すばらしい。

……というわけで、まー一生理解できないだろうけど、「あそこの先にはあれがあるな」くらいは知りたいという酔狂者、かといって全部の分野は無理なので機械学習に関連するところから自分なりにまとめて行こうとしていきます。
機械学習の森、数学の剣～探索者による憧憬～：トポロジカルデータアナリシスに必要な数学

注：私は数学も機械学習も専門家ではありませんので、誤りがある可能性があります。

2025年版Update記事を書きました

https://qiita.com/aokikenichi/items/b9fface07816dd8acc8e


# トポロジカルデータアナリシス
## トポロジカルデータアナリシスとは
* [位相的データ解析（Topological Data Analysis）について](http://blog.albert2005.co.jp/2016/02/12/%E4%BD%8D%E7%9B%B8%E7%9A%84%E3%83%87%E3%83%BC%E3%82%BF%E8%A7%A3%E6%9E%90%EF%BC%88topological-data-analysis%EF%BC%89%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6/)にほんのさわりだろうけど簡単な解説がある。
* [Deep Learning の次は、TDA 「トポロジカル・データ・アナリシス」 (Topological data analysis) が来る ? ～ その概要と、R言語 / Python言語 実装ライブラリ をちらっと調べてみた](http://qiita.com/HirofumiYashima/items/b07483af7ef31c30dacc)によると、なんでもディープラーニングの次はトポロジカルデータアナリシスらしいのだが情報幾何学とはまた違うらしい。これによるとTDAの道具として下記が上げられている。
    * TDAにおける道具
        * グラフ理論
        * 単体的複体
        * ホモロジー代数
        * パーシステントホモロジー
        * モース理論

## トポロジカルデータアナリシスに必要な数学とは

上記のTDAににおける道具を参考にトポロジカルデータアナリシスに必要な数学を調べてみた。

* グラフ理論
これは一般的だろう。離散数学－グラフ理論という感じ。

* 単体的複体
[Wikipedia:複体](https://ja.wikipedia.org/wiki/%E8%A4%87%E4%BD%93)や[単体的複体とは？](http://infoshako.sk.tsukuba.ac.jp/~hachi/math/csc2/complex.html)によると、組合せ論やグラフ理論寄りの話らしい。

* 位相空間－位相幾何学
    * 『岩波講座 現代数学の基礎〈13〉位相幾何』には前提知識として、『岩波講座 現代数学への入門 8　(15)曲面の幾何』の「位相空間」とある。
    * [「代数的トポロジー」（代数的位相幾何学）の講義ノートPDF。ホモトピー・ホモロジーを使った幾何の入門](http://language-and-engineering.hatenablog.jp/entry/20140705/AlgebraicTopologyPDFLectureNotes)によると、下記で圏論も関わってくるみたいだ。

```
群環体－－
　　　　｜－代数的位相幾何学（「ホモロジー代数」を含む）
微分幾何－
```

* パーシステントホモロジー（持続性ホモロジー）
    * [パーシステント・ホモロジーの双対性](http://www.math.sci.hokudai.ac.jp/~ohmoto/habu2013.pdf)によると、「データサイエンスへの代数トポロジーの本格的な応用」らしい。とりあえず代数的位相幾何学の範疇ということか。
    * [トポロジーは応用できるか?
](http://mathsoc.jp/publication/tushin/1604/1604tamaki.pdf)によると、ホモロジーだと穴が一つである円と三角形を区別できないがパーシステントホモロジーだと区別できるとのこと。

* モース理論
    * [Wikipedia:モース理論](https://ja.wikipedia.org/wiki/%E3%83%A2%E3%83%BC%E3%82%B9%E7%90%86%E8%AB%96)によると、微分位相幾何学の範疇のようだ。

----
上記を岩波講座現代数学への入門、現代数学の基礎でたどると（離散数学、グラフ理論や組み合わせ論は現代数学への入門や現代数学の基礎にはないので、別の本で）

```
微分と積分１　　　　　　　　　　　　　　　代数入門１　　　幾何入門１
　　｜－－－－－－－－－｜　　　　　　　　　　｜　　　　　　　｜
　　｜　　　　　　　　　｜　　　　　　　　代数入門２　　　幾何入門２
微分と積分２　　　　行列と行列式１　　　　　　｜　　　　　　　｜
　　｜　　　　　　　（いわゆる線型代数）　　　｜－－－？－－－｜
　　｜　　　　　　　　　｜　　　　　　　　　　　　　　？
曲面の幾何　　　　　行列と行列式２　　　　　　　　　　？
（いわゆる微分幾何　（同上）　　　　　　　　　　　　　？
　位相空間含む）　　　　｜　　　　　　　　　　　　　　？
　　｜　　　　　　　　　｜－－－－－－－－－－？？？？｜
　　｜　　　　　　　　　　　　　　　　　　　　　　　　｜
　位相幾何　　　　　　　　　　　　　　　　　　　　代数幾何１（圏論含む）
　　｜　　　　　　　　　　　　　　　　　　　　　　　　｜
Morse理論の基礎　　　　　　　　　　　　　　　　　代数幾何２（コホモロジー含む）

微分位相幾何は？
```
こんな感じか？
---
v.1.0
bashでロングオプションとショートオプションの両方に対応する

getoptsを利用します。
getoptsの引数の後ろに`:`をつけるとOPTARG変数にその値が保持されるので、`-`の後ろにつけてロングオプションに対応します。

```bash:sample.sh
#!/bin/bash

help() {
	echo help
}

version() {
	echo version
}

while getopts ":vh-:" opt; do
	case "$opt" in
		-)
			case "${OPTARG}" in
				help)
					help
					;;
				version)
					version
					;;
			esac
			;;
		h)
			help
			;;
		v)
			version
			;;
	esac
done
```

実行

```sh
$ ./sample --help
help
$ ./sample -h
help
$ ./sample --version
version
$ ./sample -v
version
```

以下の記事を参考にさせていただきました。

[bash によるオプション解析 - Qiita](http://qiita.com/b4b4r07/items/dcd6be0bb9c9185475bb)
Node.jsで、Wit.aiをテストする


# 必要な環境

| パッケージ | Version |
|:--|:--|
| Node.js | V4.4.3 |

https://nodejs.org/en/

v4.4.3をインストールしておく　

> $ node -v
  v4.4.3

# wit-nodeのインストール

> npm install --save node-wit

# Wit.aiの設定

https://wit.ai/home

![wit001.png](https://qiita-image-store.s3.amazonaws.com/0/63450/659b14ab-387a-6227-c1e7-4e64d42b44b9.png)

![wit002.png](https://qiita-image-store.s3.amazonaws.com/0/63450/d3748e1c-e70e-c0f7-62fe-1c66f6f12636.png)

![wit004.png](https://qiita-image-store.s3.amazonaws.com/0/63450/bd43f763-dbf0-96e1-d016-532e85c6015c.png)

![wit005.png](https://qiita-image-store.s3.amazonaws.com/0/63450/b82d304c-9772-6335-3de6-f091adee7d9b.png)

~を実行すると、chatのテストができる。

![wit101.png](https://qiita-image-store.s3.amazonaws.com/0/63450/42a07f72-f8f5-5f6c-a895-f1d986162741.png)

# Wit.aiのClientトークンを取得

![wit201.png](https://qiita-image-store.s3.amazonaws.com/0/63450/bc477bd7-fcf7-7d40-a1e3-e9def13dcf3d.png)

# Node.jsからWit.aiを実行

```shell-session
node examples/template.js Clientアクセストークン
> こんにちわ
Executing merge action
Executing say with message: こんにちわ!!
こんにちわ!
```
canvasで画像の合成


デモ：http://mo49.tokyo/qiita/20160504/

canvas.width, canvas.heightでcanvasのサイズ、
drawImage()で画像のサイズを決める。

デモでは風景、フレーム、文字の3枚を合成。

```javascript:javascript
// 読み込みたい画像のパスの配列 後ろが上にくる
var fileAry = ['img/test1.png', 'img/test2.png', 'img/test3.png'];

var numFiles = fileAry.length;
var loadedCounter = 0;
var imgAry = [];

var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');

canvas.width = canvas.height = 500;

window.onload = function() {
	loadImgs();
};

function loadImgs(){

	var img = new Image();

	img.addEventListener('load', function(){
		loadedCounter++;
		imgAry.push(img);
		if(numFiles == loadedCounter){
			display(); // 画像をすべて読み込んだら描画
		} else {
			loadImgs();
		}
	}, false);
	
	img.src = fileAry[imgAry.length];
}

// 参照が残っているとガベージコレクトされないため、
// 明示的にImageオブジェクトを解放
function display(){
	for (var i in imgAry){
		ctx.drawImage(imgAry[i], 0, 0, canvas.width, canvas.height);
		imgAry[i] = null;
	}
}
```


> 参考
[Canvasに画像を複数枚重ねて描画するには](http://www.riaxdnp.jp/?p=1570)
canvasで画像をトリミングする


デモ：http://mo49.tokyo/qiita/20160504/trim.html

imgは読み込んだ後でないとwidth, heightがとれないので、` img.onload `の中で描画する。
もしくはdomとしてあらかじめ用意。`display:none;`で消しておく。

```javascript:trim.js
// トリミングしてcanvas要素に描画して返す関数
function trimImage (imgSrc) {

    var TRIM_SIZE = 300;
    var canvas = document.createElement('canvas');
    var ctx = canvas.getContext('2d');

    canvas.width = canvas.height = TRIM_SIZE;
    canvas.id = 'canvas-photo';

    var img = new Image();
    img.src = imgSrc + '?' + (new Date).getHours(); // IE対策

    // imgは読み込んだ後でないとwidth,heightが0
    img.onload = function() {
	    // 横長か縦長かで場合分けして描画位置を調整
	    var width, height, xOffset, yOffset;
	    if (img.width > img.height) {
	        height = TRIM_SIZE;
	        width = img.width * (TRIM_SIZE / img.height);
	        xOffset = -(width - TRIM_SIZE) / 2;
	        yOffset = 0;
	    } else {
	        width = TRIM_SIZE;
	        height = img.height * (TRIM_SIZE / img.width);
	        yOffset = -(height - TRIM_SIZE) / 2;
	        xOffset = 0;
	    }
    	ctx.drawImage(img, xOffset, yOffset, width, height);
    };
    
    return canvas;
}

// トリミングしたcanvasを追加
var imgSrc = './img/test.jpg';
$('body').append( trimImage(imgSrc) );
```

正方形に切り抜くのではなく、画像の比率を保ったまま縮小させる場合は以下のようにやる。

```javascript:resize.js
img.onload = function() {
	//縦横の縮小率を求める	
	var ratioWidth = canvas.width / img.width;
	var ratioHeight = canvas.height / img.width;
	//縮小率の小さい方を使う
	if (ratioWidth <= ratioHeight) {
		var ratio = ratioWidth;
	} else {
		var ratio = ratioHeight;
	}
	
	//リサイズ後のピクセル数を計算（縦横に同じ比率をかける）	
	var sizeWidth = Math.round(img.width * ratio);
	var sizeHeight = Math.round(img.height * ratio);		
	//中央値を求める
	var drawX = Math.round((canvas.width - sizeWidth) / 2);
	var drawY = Math.round((canvas.height - sizeHeight) / 2);
	
	//写真をcanvasに表示する
	ctx.drawImage(img,drawX,drawY,sizeWidth,sizeHeight);
}
```


> 参考
[drawImage() メソッド](http://www.html5.jp/canvas/ref/method/drawImage.html)
[ canvasに画像を描画しよう（トリミングやクリッピングも）](http://honttoni.blog74.fc2.com/blog-entry-187.html)
MeCabとPerlバインディングをインストール on Mac

もはや10年位前のインストール方法ですが…。

# MeCabを動かすまで

## MeCabをインストール

http://taku910.github.io/mecab/#download から、mecab-0.996.tar.gzをダウンロードして、自分のホームディレクトリの下にインストール。

```
$ ./configure --with-charset=utf8 --prefix=/Users/yourAccount/local
$ make
$ make install
```

/Users/yourAccount/local/binにパスを通す

```
export PATH=$HOME/local/bin:$PATH
```

.bash_profileに書いておけばOK

## 辞書のインストール

MeCabはソースからインストールしたのに、辞書はUniDicのバイナリを使うという…

https://osdn.jp/projects/unidic/releases/58338 から、unidic-mecab-2.1.2_bin.zipをダウンロードし、適当な場所に展開する。

## .mecabrcの作成

```
cp ~/local/etc/mecabrc ~/.mecabrc
```

.mecabrc内のdicdirに、UniDic辞書を展開したパスを指定する

```
;
; Configuration file of MeCab
;
; $Id: mecabrc.in,v 1.3 2006/05/29 15:36:08 taku-ku Exp $;
;
dicdir =  /Users/yourAccount/foo/bar/unidic-mecab-2.1.2_bin

; userdic = /home/foo/bar/user.dic

; output-format-type = wakati
; input-buffer-size = 8192

; node-format = %m\n
; bos-format = %S\n
; eos-format = EOS\n
```

## MeCab試し

```
$ mecab -Owakati
MeCabとPerlバインディングをインストール
```

と入力すると、

```
MeCab と Perl バインディング を インストール 
```

と、形態素ごとにスペースが入って出力されます。

# Perlで形態素解析をするまで

## Perlバインディングのインストール

MeCab本体と同じく、 http://taku910.github.io/mecab/#download の「perl/ruby/python/java バインディング」のダウンロードをクリックすると、Google driveにつながるので、mecab-perl-0.996.tar.gzをダウンロード。適当なディレクトリに展開。

```
$ perl Makefile.pl PREFIX=/Users/yourAccount/local
make
make install
```

## 使ってみる

```pl
use lib '/Users/yourAccount/local/lib/perl5/site_perl/5.18.2/darwin-thread-multi-2level';
use MeCab;
use strict;

my $m = new MeCab::Tagger ("-Owakati");
my $w = $m->parse ("分かち書きのテストです。");
print $w;
```

```
$ perl test.pl 
分かち書き の テスト です 。 
```

# とりあえず動かせるけど…

homebrewを使うなど、もっといいインストール方法はあると思いますが、自分のやりやすい方法ということで、備忘録でした…。