OmniAICreator/Qiita-1.07M huggingface dataset:
ElectronでSocket.ioを導入してみる [テスト編]

# ElectronでSocket.ioを導入するテスト編です。

参考にしたところ

- [Node.jsとSocket.IOによるPCとスマホブラウザのペアリングデモ](https://ics.media/entry/4320)
- [Electron で jQuery をスマートに読み込む方法](http://phiary.me/electron-jquery-script-tag-load/)

やりたいこと

- スマホでリモート操作
- Electronアプリと連動すること

## とりあえず、動かしてみる

前提条件:
Node.jsやElectronのあれこれが済んでいること。
まだの場合は、[コチラ](https://ics.media/entry/7298/2)を参照するといいでしょう。

さっそく、[Node.jsとSocket.IOによるPCとスマホブラウザのペアリングデモ](https://ics.media/entry/4320)のコードをダウンロードし、適当な箇所に解凍します。
組み込み予定のElectron内に、先ほど解凍したコード全部コピーし、Electronのメインファイルへ「server.js → index.js」へ移植します。

```js:index.js
...
// ここから
// サーバー構築
var http = require("http");
// fsモジュールの読み込み
var fs = require("fs");
// pathモジュールの読み込み
var path = require("path");
// httpサーバーを立てる
var server = http.createServer(requestListener);
// httpサーバーを起動する。
server.listen((process.env.PORT || 5000), function() {
    console.log((process.env.PORT || 5000) + "でサーバーが起動しました");
});
...
    // コントローラーからmouseUpFromControlerというデータを受信
    //（コントローラでマウスアップイベントが発生）
    socket.on("mouseUpFromControler", function(data) {
        socket.to(roomID).broadcast.emit("mouseUpToMain", data);
    });
});
// 接続エラー
io.sockets.on("connect_error", function(socket) {
    console.log("connect_error");
});
// 接続終了
io.sockets.on("disconnect", function(socket) {
    socket.emit("disconnectEvent");
    console.log("disconnecth");
});
// ここまで
// server.js内のスクリプトを移植し、追加します。
```

また、上記に加えて、ElectronでjQueryを動作させるために、以下を追加する。
なお、よくスマホアプリで使われているような、
Help実装をWebViewで表示したりするタイプなどにも適応が可能。

```js:index.js
...
app.on('ready', function() {
  // Create the browser window.
  mainWindow = new BrowserWindow({width: 950, height: 600, 'node-integration': false});
 // 'node-integration': false これを入れることで、jQueryの読み込みが通常のWebと同様になる。
...
```

これくらいの手間だけで、webアプリの移植が完了です。

### 起動時の画面
![Socket.IOデモ_Electron_ss_001.png](https://qiita-image-store.s3.amazonaws.com/0/12007/93a3fbef-8394-92c5-a00a-64213d7a164f.png)


## その他に実装したもの
IPアドレスを表示&取得してみたかったので、下記の内容も実装してみた。

- Node.jsのModule OS側のネットワーク情報を取得するやつ 
- [QRコード生成js](http://jeromeetienne.github.io/jquery-qrcode/)

```js:index.js
...
var os = require('os');
var ifaces = os.networkInterfaces();
var ipAddress;

Object.keys(ifaces).forEach(function (ifname) {
  ifaces[ifname].forEach(function (iface) {

    if ('IPv4' !== iface.family || iface.internal !== false) {
      // skip over internal (i.e. 127.0.0.1) and non-ipv4 addresses
      return;
    }

    console.log(ifname, iface.address);
    // en0 192.168.1.NNN
    ipAddress = iface.address;

  });
});
...
```

　このモジュールと[QRコード生成js](http://jeromeetienne.github.io/jquery-qrcode/)を組み合わせ、IPアドレスを取得した後、QRcodeジェネレーターと連携させることで、QRリーダーで読み込めば、入力せずにブラウザ起動が可能。<br />
　これでIPアドレスが自動で変わっても遊べますね。

```html:index.html

    <script>
        // デモ用コード
        $(function() {
            $("#controllerURL").text(location.origin + "/controller.html");
            $('#qrcode').qrcode({width: 90,height: 90, text: location.origin + "/controller.html"});
        });
   </script>
```

また、進展したら、投稿します。
Raspberry Pi セットアップマニュアル（備忘録）Part 3

今後の再セットアップやメンテ時に役立つよう、作業記録をマニュアル化したいと思い作成した自分用の備忘録メモ的な記事です。
##**Raspberry Pi セットアップマニュアル（備忘録）Part 3**
#####**〜SSHの設定と接続〜**
-----
######使用機種・環境（2016年3月現在）
```
Raspberry Pi 2 B+
OS:Raspbian Jessie（NOOBS 1.8.0にてインストール）
microSDカード：32GB（class10）
USBキーボードとUSBマウス（インストールおよび初回起動時に必要）
USBメモリ(16GB) （外付けhdd的用途で使用予定）
micro USBケーブルとUSB電源アダプタ
※電源アダプタはスマホ充電用のものとかでOK。あるいはPCのUSB端子でもいける。

母艦PC／Mac mini (Late2012)
OS:OS X El Capitan 10.11.3
```
-----

今回、母艦MacとSSH接続できるようにします。
まずはRaspberty Pi本体のIPアドレス固定するところから始めます。

-----

#####**Raspberry Pi のローカルIPアドレスを固定化する**

Raspberry Pi の LXTerminal で " ip a " と入力してルーターから現在割り当てられているIPアドレスを確認する。

```
pi@raspberrypi:~$ ip a
```

以下の内容で eth0 の項目の " inet " の行に表示されている _192.168.1.4/24_ が現在割り当てられているIPアドレスになる。
（注：ルーターに接続している端末の数や順番によって末尾が異なる場合がある）


```
1: lo: <LOOPBACK~ （略）
　　　　　　　〜（略）〜
2: eth0: <BROADCAST~ （略）
   　link/ether 〜（略）〜
   inet 192.168.1.4/24 brd 192.168.1.255 scope global eth0
   ↑この行の 192.168.1.4/24 が現在のIP
   〜（以下略）〜
```

LXTerminal内で、nanoエディタのモードに入り /etc/dhcpcd.conf を編集。

```
pi@raspberrypi:~$ sudo nano /etc/dhcpcd.conf
```

以下の内容を文末に追加
" static ip_address " で _192.168.1.210/24_ にする。末尾の _.210_ 部分はルータがどの端末にも割り当てていない数字であれば任意の数字でよい。
(_192.168.1.1_ は現在使用しているルーターのIPアドレス）

```
interfaces eth0
static ip_address=192.168.1.210/24
static routers=192.168.1.1
static domain_name_servers=192.168.1.1
```

キーボード操作 Ctl+O で保存、Ctl+X で nanoエディタのモードを終了して sudo reboot で再起動。

```
pi@raspberrypi:~$ sudo reboot
```

もう一度 " ip a " でIPアドレスが変更されているか確認して
_inet 192.168.1.4/24_ の部分が _192.168.1.210/24_ になっていればOK。

```
1: lo: <LOOPBACK~ （略）
　　　　　　　〜（略）〜
2: eth0: <BROADCAST~ （略）
   　link/ether 〜（略）〜
    inet 192.168.1.210/24 brd 192.168.1.255 scope global eth0
   〜（以下略）〜
```
**ここまで出来たら、やっとキーボードとマウスを取っ払ってもOK。**
念のため一旦シャットダウン後、入力機器を外して、電源用USBを差し込み直して起動。
ログインはせず、デスクトップも立ち上げなくてよい。
次に母艦MacからのSSH操作に移る。

-----

#####**母艦MacのターミナルからSSHで接続する**

**_ここから Mac での操作_**
Macのターミナルで _ssh pi@(先ほど設定したRaspberry Piの固定IP)_ を入力する。
_192.168.1.210/24_ に設定したので _pi＠192.168.1.210_ になる。（_/24_ 部分はいらない）

```
~ (user名)$ ssh pi@192.168.1.210
```

```
(注）　もしも、この時点で

@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
@    WARNING: REMOTE HOST IDENTIFICATION HAS CHANGED!     @
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@

このようなエラーが出たら、 _ssh-keygen -R (IPアドレス) を実行後にログインできるようになる。

~ (user名)$ ssh-keygen -R 192.168.1.210
```


初回は

```
Are you sure you want to continue connecting (yes/no)?
```

と出るので、続けて " yes" と入力。

```
pi@192.168.1.210's password:
```

pi ユーザのパスワードを入力。

Macのターミナル上に

```
pi@raspberrypi:~ $
```

と表示されたら Raspberry Pi への接続成功。
このままMacのターミナルのCLI操作で Raspberry Pi のアップデートインストールやファイル操作など全てが可能になる。

-----

次回はこのSSH操作で、VNCサーバシステムをインストールして、Macで画面共有します。
回路シミュレーション LTspice の使い方(3) 「ウィーンブリッジ発振回路」

## 概要
シミュレーションツール LTspice で「ウィーンブリッジ発振回路」の挙動を調べる。

## はじめに
LTspiceの練習のために、オペアンプを使ってサイン波を発生させて、その挙動を確認する。
オペアンプでサイン波といえば「ウィーンブリッジ発振回路」だ。


なお、LTspice については、下記も参考にしてください。

 - 回路シミュレーション LTspice の使い方(2) 部品の追加<br>
http://qiita.com/exabugs/items/5bfb3a575ce05bb6cbde
 - ESP8266 (ESP-WROOM-02) 回路シミュレーション・ツール LTspice (無料) の使い方 まとめ<br>
http://qiita.com/exabugs/items/59536e2a52aa460087d5


## ウィーンブリッジ発振回路

![スクリーンショット 2016-03-21 17.17.31.png](https://qiita-image-store.s3.amazonaws.com/0/69410/ff687616-442a-f44c-c9f8-a48d66d44667.png)
計算通り、ピッタリ増幅率が 3 (R4:10kΩ, R3:20kΩ)の場合だと、LTspiceでは発振しなかった。
そのため、R5(100Ω) を足して、増幅率を 3 より少しだけ大きくしている。

### シミュレーション結果
![スクリーンショット 2016-03-21 17.16.04.png](https://qiita-image-store.s3.amazonaws.com/0/69410/2f3953d4-e47b-b79c-7124-01705c72c06b.png)

### 拡大図
頂点で波形が歪んでいないか確認。しかし、微妙に潰れている。。
(結果グラフ上で、拡大したい部分をマウスでドラッグすると拡大される)
ウィーンブリッジ発振回路は、全く歪まずには発振しないのではないかと思うが、どうなのだろう。
![スクリーンショット 2016-03-21 17.16.15.png](https://qiita-image-store.s3.amazonaws.com/0/69410/cf4adfa6-b843-e8c5-1018-eec2a3b95a98.png)

以下で「ウィーンブリッジ発振回路」を詳細に見ていく。

「ウィーンブリッジ発振回路」は、以下二つの部分から構成されている。

- 非反転増幅回路
- バンドパス・フィルター回路

つまり、特定周波数(ここでは 1KHz)だけ1/3、他は1/3以下にフィルタして、その後、増幅回路で3倍する、ということ。

## 非反転増幅回路

ウィーンブリッジ回路の負帰還部分は、(全体として)非反転増幅回路を形成している。

増幅度 = (R3 + R4) / R4 = 3

### 検証回路
![スクリーンショット 2016-03-21 16.17.25.png](https://qiita-image-store.s3.amazonaws.com/0/69410/cf9fbb1f-d25b-4132-e956-034fe6df4604.png)

### シミュレーション結果
![スクリーンショット 2016-03-21 15.02.42.png](https://qiita-image-store.s3.amazonaws.com/0/69410/f032a5d8-9f03-e590-1ea8-1ddbaf02dcd9.png)
確かに、3倍 になっている。

## バンドパス・フィルター

ウィーンブリッジ回路の正帰還部分は、以下のフィルタを組み合わせた、バンドパス・フィルターを形成している。

 - R1,C1 で構成されるローパス・フィルター
 - C2,R2 で構成されるハイパス・フィルター

どちらも、遮断周波数（カットオフ周波数） は 994.718394324[Hz]

このバンドパス・フィルターの周波数特性を検証してみる。

### 検証回路

![スクリーンショット 2016-03-21 15.52.28.png](https://qiita-image-store.s3.amazonaws.com/0/69410/25e8bbcf-5cf2-ca9c-926b-86859431a284.png)




周波数特性をみるためには、入力信号を以下のように設定する。
![スクリーンショット_2016-03-21_15_33_24.png](https://qiita-image-store.s3.amazonaws.com/0/69410/d1fef06f-8f2f-4330-3d13-a10fb5e32a5d.png)

また、「SPICE directive」を以下のように設定する。
![スクリーンショット 2016-03-21 15.36.43.png](https://qiita-image-store.s3.amazonaws.com/0/69410/7ad50749-dcbd-4020-2c52-3e2169f0d1ec.png)

上記の各値は以下の意味を持つ

|キー|値|
|----|:---:|
|Type of Sweep| Decade|
|Number of points pr decade| 20|
|Start Frequency| 10|
|Stop Frequency| 100k|

### シミュレーション結果
![スクリーンショット 2016-03-21 15.31.27.png](https://qiita-image-store.s3.amazonaws.com/0/69410/6a5a7b4d-f855-3b41-0115-ce5afb207ba3.png)

1KHz付近の拡大図
![スクリーンショット 2016-03-21 16.02.18.png](https://qiita-image-store.s3.amazonaws.com/0/69410/13c2c6d6-5984-605b-cdda-75322e8b1b84.png)
1KHz を中心に、-9dB (0.355倍) 〜 -10dB (0.316倍) 、つまり、約 1/3 倍 になっていることがわかる。

## まとめ
 - やっと、LTspice にも慣れてきた。
 - 今後、実際の回路を作った時に、机上の計算との誤差が、気になってくる。

## 参考文献
 - http://www.rlc.gr.jp/project/e_circuit/analog/opamp/wien_bridge/genri/genri.htm
Goのプログラムでどういうリクエストを飛ばしているのか見たい

Goとかで外部にリクエストを投げるようなプログラムを書くと、実際にどういうリクエストを投げて、どういうレスポンスを受けているのか一見分かりません。

WebアプリケーションならChromeのDeveloper Toolsを使えば簡単にいい感じに見ることができます。リクエストを投げるプログラムでもChromeのDeveloper Toolsを使って飛ばしているリクエストとレスポンスが見れるととても便利そうです。そんなことが実現できてしまう方法を紹介します。

[kdzwinel/betwixt: Web Debugging Proxy based on Chrome DevTools Network panel.](https://github.com/kdzwinel/betwixt)

今流行りのElectronアプリです。READMEに貼られているGifアニメを見れば全て察せるでしょう。[Releases · kdzwinel/betwixt](https://github.com/kdzwinel/betwixt/releases)ここからビルド済みのものをダウンロードできるのでインストールをしておきます。

Betwixtをインストールしたら、とりあえず起動します。デフォルトで8008番ポートを使ったプロクシサーバーを起動してくれます。なので本家のREADMEに書いてある方法でOSのネットワーク設定をいじって、localhost:8008をプロクシサーバーに指定することでどういうリクエストを送っているのか手軽に確認できます。

特定のプログラムでどういうリクエストを流しているのか見たい場合も同様です。例えばGoなら以下のようなプログラムを書きます。

```go:main.go
proxyURL, _ := url.Parse("http://localhost:8008")
myClient = &http.Client{
	Transport: &http.Transport{
		Proxy: http.ProxyURL(proxyURL),
	},
}
```

`http.Get()`のような`DefaultClient`を使う実装にしている場合は以下のようにするとできます。

```go:main.go
proxyURL, _ := url.Parse("http://localhost:8008")
http.DefaultTransport = &http.Transport{Proxy: http.ProxyURL(proxyURL)}
```

もちろんGo以外でもプロクシサーバーを通す設定にすれば、プログラムがどういうリクエストを飛ばしているのか見ることができます。

めっちゃ便利なのでおすすめです。

ところで『Betwixt』ってなんて読むんですかね。知っている方いたら教えてください！
[解決済み] Raspbian Jessie GNU/Linux 8 で L-02C を eject するまで

Raspbian GNU/Linux 8 で Raspberry Pi に L-02C をつないで SORACOM につなごうとしたんですが、L-02C のCD自動マウント機能によりCD-ROMが認識してしまい、そのCD-ROMをイジェクトしようとしたけど、手間取ったという話です。(解決しています)

以下のようにしてください。

# 1. L-02Cをイジェクトする
## 1. eject コマンドをインストールする。 

```lang:shell
$ sudo apt install eject
```

## 2. lsubs コマンドをインストールする(Raspbianにはデフォルトで入っている)。

```lang:shell
$ sudo apt install usbutils  
```

## 3. /etc/modulesに以下の行を追加する。

```lang:shell
$ sudo vi /etc/modules
```
***
usb_storage
***

## 4. 再起動する。
```lang:shell
$ sudo reboot
```

## 5. ejectする
```lang:shell
$ eject sr0
```

# 2. ※次回からCDROMでマウントしないようにする

## 1. cu コマンドをインストールする。
```lang:shell
sudo apt install cu
```

## 2. modemにつなぐ
```lang:shell
cu -l /dev/serial/by-id/usb-NTT_DOCOMO__INC._docomo_L02C-if02-port0
```

## 3. modemをリセット
```
ATZ
```

## 4. CD-ROMをマウントしないように設定変更
```
AT%USBMODEM=0
```

## 5. 設定を保存
```
ATZ0
```

## 6. cu コマンド終了
```
~.
<Enter>
```

※参考URL
L-02Cを最初からUSBモデムで認識させる／手動でAPN登録する - /dev/stkinosh
http://trtr.hatenablog.jp/entry/2014/11/27/011913

L-02C でインターネット接続する方法: Linuxist の Debian-Ubuntu 拾い食い日記
http://balachi.sblo.jp/article/174518387.html

usb drive - Sandisk USB not detected by Ubuntu 14.04 but detected by Windows 7 - Ask Ubuntu
http://askubuntu.com/questions/522515/sandisk-usb-not-detected-by-ubuntu-14-04-but-detected-by-windows-7

<余談>
cu コマンドつかったのなんて、15年ぶりぐらいかも。。
AWSCLI作業用EC2インスタンスの作成

# AWSCLI作業用EC2インスタンスの作成
これは主にウィンドウズ利用者向けのもので、ハンズオンに必須ではありません。
既にAWSCLIを実行可能な作業環境をお持ちの場合はそれで構いません。

##マネジメントコンソールへのログイン
* https://console.aws.amazon.com/ からマネジメントコンソールへログインします。
* 左上のEC2をクリック
* 「インスタンスの作成」（青い）をクリック
* 一番上のAmazon Linux AMI...の右側にある「選択」（青い）をクリック
* 何もせず右下の「確認と作成」（青い）をクリック
* 続いて右下の「作成」（青い）をクリック
* キーペアの選択画面になるので１つ目の選択肢から「新しいキーペアの作成」を選択
* ２つ目のキーペア名入力欄に適当な名前を入力して、その下にある「キーペアのダウンロード」をクリックしてキーペアを任意の場所に保存します。
* 右下の「インスタンスの作成」（青い）が押せるようになるのでクリック
* 数分待ってから右下の「インスタンスの表示」（青い）をクリック
* インスタンス一覧画面になるので、右下の方にある「パブリックIP」のIPアドレスをメモします。

##クレデンシャルの作成
* 左上の四角いオレンジをクリック
* 真ん中ぐらいにある「Identity & Access Management」をクリック
* 左側から「ユーザー」をクリック
* 「新規ユーザーの作成」（青い）をクリック
* ユーザー名の入力で 1. に適当な名前を半角英数字で入力し、右下の「作成」（青い）をクリック
* 右下の「ユーザーのセキュリティ認証情報を表示」をクリック
* 画面に認証情報が表示されます。アクセスキーIDとシークレットアクセスキーをメモします。
* 右下の「閉じる」（青い）をクリック
* ユーザ一覧画面になるので、作成したユーザー名をクリック
* 「アクセス許可」をクリック
* 「ポリシーのアタッチ」（青い）をクリック
* ポリシー名一覧の一番上にある「AdministratorAccess」の左側の四角をクリック
* 右下の「ポリシーのアタッチ」（青い）をクリック

以上でマネジメントコンソールでの作業は終了です。


##作業用EC2インスタンスへのログイン
* TeraTermなどSSHログイン可能なアプリケーションを開きます。
 * 接続先 先ほどメモしたIPアドレス
 * ユーザ名 ec2-user
 * ログイン方法は秘密鍵を選択して先ほど保存したキーペアを選択（パスワードによるログイン不可）
 * 以上の情報でログインします。

##インスタンス上での作業
* 以下、ログインしたコマンドラインでの作業です。
* sudo yum install jq -y
* sudo yum install npm --enablerepo=epel -y
* sudo npm install -g jsonlint
* sudo pip install --upgrade awscli
 * （画面が流れます。awscliをバージョンアップしています）
* aws configure
 * AWS Access Key ID [None]:の問いに先ほどメモしたアクセスキーIDを入力
 * AWS Secret Access Key [None]:の問いに先ほどメモしたシークレットアクセスキーを入力
 * Default region name [None]:の問いに us-east-1 と入力
 * Default output format [None]:の問いには何も入力せずリターンキーを押す
* aws configure list

```
      Name                    Value             Type    Location
      ----                    -----             ----    --------
   profile                <not set>             None    None
access_key     ****************GNTQ shared-credentials-file
secret_key     ****************zftY shared-credentials-file
    region                us-east-1      config-file    ~/.aws/config
```
こんな風に出れば作業完了です。ハンズオンに臨みましょう。
Sidekiq::Webの更新処理ができない

背景
---

* Railsのジョブ実行サーバである[Sidekiq](https://github.com/mperham/sidekiq)にはかっこいいジョブ管理のWebインターフェイスがもれなくついてきます

![](https://github.com/mperham/sidekiq/raw/master/examples/web-ui.png)

* 下記のような感じでroutes.rbに追記するだけ

```
mount Sidekiq::Web => '/sidekiq'
```

環境
---

* Puma
  * Clusterで複数プロセス起動
  * 複数サーバ

問題
---

* この画面を使ってジョブの参照をしているには問題なかったのですが、
* ジョブの削除とかリトライのような更新をしようとするとなぜか```403 forbidden```が発生することがありました

原因
---

* Sidekiq::WebひいてはSinatraがデフォルトではマルチプロセスでセッション管理できない
* 結果的にRack::ProtectionのCSRFチェックにひっかかっていたのが原因です
  * [Sidekiq::Web](https://github.com/mperham/sidekiq/blob/master/lib/sidekiq/web.rb)はsinatraで書かれた簡易なRackアプリです
  * Sinatraは一部独自のセッション管理をしている場所があり、[session_secretをプロセス起動時にランダムに指定](https://github.com/sinatra/sinatra/blob/master/lib/sinatra/base.rb#L1845)します
  * 結果的にプロセスごとに異なるsession_secretが指定され、セッション値の復号化に失敗していました
  * セッション管理できないと、[Rack::Protectionに脆弱性として検出](https://github.com/sinatra/rack-protection/blob/master/lib/rack/protection/authenticity_token.rb#L27)されて落ちていました

対応
---

* 下記の対応をroutes.rbに入れてsinatraのsession_secretを固定すれば治ります

```
require 'sidekiq/web'
Sidekiq::Web.set :session_secret, 'secret secret'
mount Sidekiq::Web => '/sidekiq'
```
【Electron】タレントの出演番組を一括検索できるデスクトップアプリを作りました


### 作ったもの
[TV-kko](https://github.com/re-fort/TV-kko)
TV-kkoは登録したタレントから出演番組を一括検索できるデスクトップアプリです。

詳細リンクを押すとCHAN-TORUの番組詳細ページに飛ぶので、番組を録画することも可能です。

### デモ
![screenshot](https://raw.githubusercontent.com/re-fort/TV-kko/master/demo/TV-kko.gif)

### パッケージ
使っているパッケージです。

* vue
* cheerio-httpcli


開発当初は、
『Electron + Vue.js + babel + webpack + Stylus + Jade』
みたいな流行りの構成でやろうとしてたんですが、
cheerio-httpcliをwebpackする方法が分からず、、、、

最終的に、
『Electron + Vue.js』
の最小構成っぽくなりました。

[Vue.js](http://jp.vuejs.org/)は初めて使ってみましたが、すごく使いやすいですね。
公式読めば大体分かるし。
これで私もinnerHTMLっ子から卒業ですね。

[cheerio-httpcli](https://www.npmjs.com/package/cheerio-httpcli)も大変便利でした。
画像や番組情報のfetchやらに使わせてもらってます。
jQueryのセレクタと似てるので、直感的にシュババッと出来ます。

### その他
* OSXからelectron-packagerでのパッケージングは、Win向けにWineだけ入れとけばOKでした。アイコンも特に問題なく設定できてた。(v5.2.1)
* API Docの翻訳版あるの気づかなかったので、開発前に[コレ](https://github.com/atom/electron/tree/master/docs-translations/jp/api)一通り見とくといいかも。特にapp,ipc-main,ipc-renderer,menu,remoteあたり。
pecoでdocker machineを選んでeval

もう既にありそうですが以下の通り。(zsh)

```
 eval $(docker-machine env `docker-machine ls | peco --initial-index 1 | awk '{print \$1}'`)
```

~~TODO:ローカルに戻す方法。~~
教えていただきました！
<blockquote class="twitter-tweet" data-lang="ja"><p lang="ja" dir="ltr"><a href="https://twitter.com/Noboruhi">@noboruhi</a> evalしたenvのアンセットならeval “$(docker-machine env -u)”でどうでしょう？<a href="https://t.co/z7xyV9kX50">https://t.co/z7xyV9kX50</a></p>&mdash; yamamoto@雇ってください (@yamamoto_febc) <a href="https://twitter.com/yamamoto_febc/status/711835262800691200">2016年3月21日</a></blockquote>
Goodfellow,Bengio,CourvilleさんのDeep Learning本の13章のまとめ

# Goodfellow,Bengio,CourvilleさんのDeep learning本の13章のまとめ

* 重要と思った部分だけ独断で抽出しています.
* 本当にメモ書き程度なので本を読まずにいきなりこれを読んでもわからない可能性がかなりあります.すみません.
* 間違っている記述があるかもしれません.
* 心眼で書いている部分があるかもです.

## 13 Linear Factor Models

linear factor modelはstochasicなlinear decoderである.
またhを潜在変数するとき

$x = Wh + b +noise$

となる. hのpriorやnoiseののせ方の違いがバリエーションとなる.

### 13.1 Probabilistic PCA and Factor analysis

* Factor analysis ではhはunit variance Gaussianとなる. 
そしてnoiseは対角行列を分散にしたGaussianとなる.
$x\sim N(x;b,WW^{T}+\phi)$($\phi$は対角行列)
となる.
* Probabilistic PCAではそれぞれの成分の分散が同じと仮定する.よって
$x\sim N(x;b,WW^{T}+\sigma ^{2}I)$
となる.
* 分散が0に近づく時Probabilistic PCAはPCAに近づいていく.

### 13.2 ICA

* 最も古いrepresentation learning algorithmである.
潜在変数をできるだけindependentにしたいという信号分解のモチベーションから生まれた.
* $x=Wh$という関係がある.($x$は観測変数,$h$は潜在変数) あと$p(h)$が与えられている. ($p(h)$は独立) このとき$W$を求めたいというのがICA.
* またICAは生成モデルとは言えない.なぜならxとh間の関係を求めるし,p(h)は仮定するがp(X)は仮定しないから. 
そもそも生成モデルとしてのモチベーションはない.
* ICAの重要な特徴としてpriorをnon-Gaussianとすることがある. なぜならGaussianにするとWが定まらないから.

### 13.3 Slow Feature Analysis

* 時系列から不偏な特徴量を抽出しようというモチベーションで作られたlinear factor modelである.
* Slowness principle によると下のような正則化項をつける.

$ \lambda \sum_{t} L(f(x^{t+1}),f(x^{t}))$

* Lとしては２乗誤差とかが選ばれる. 実際,不偏にしたいモチベーションのある正則化項である.

### 13.4 Sparse Coding

* Unsupervised feature learningとしてかなり研究されてきたもの.
* $p(x|h) = N(x;Wh+b,\frac{1}{\beta}I)$で$p(h)$というpriorが与えられている.
このとき事後確率$p(h|x)$を最大化するhを求めたい.
* hのpriorとしてfactorized  Laplaceやstudent-tが選ばれる.
* 最尤法は直接扱えないため繰り返しのアルゴリズムとなる.
変分ベイズの文脈で正当化される.(hの近似分布としてDirac分布を想定する)
* PCAと違ってparametricなencoderを用いるのではなくposterior最大化の文脈で$h$を求める.
* モデルをtrainするためにはhの最小化とWの最小化を繰り返すことになる.
* またgenerative modelとしてはsparseにならずにfeature extractorとしてsparseになることに注意.
* Non-parametricなencoderとしての利点は特徴量抽出の面がある.一方, よくない点としてxが与えられてhを計算するときに多大な計算量を要することがある.
* またgenerative modelとしてはあまりよくないことに注意. priorをnon-factorialにするとかdeepにしなければいけない.

### 13.5 Manifold Interpretation of PCA

* PCAにはreconstruction error最小化としての面と潜在変数の分散の最大化という解釈がある.

## 参考文献
http://www.deeplearningbook.org/
ons-toolbar-buttonでMaterialDesignを使うと色が透けてしまう事を回避する

##序文
事の発端として、現在monacaはonsenui2.0の実装が進んでいるが、β6になってから、挙動がだいぶ変わった。その中でここまで修正ができなかった、ons-toolbar-buttonがmodifierのmaterialが指定しているHEX#26a69aがクリックイベント時に透けてしまう問題を解決する手法を以下に記す。

##修正箇所及び修正方法
```
/components/monaca-onsenui/onsen-css-components.css
```

の2624行目に記載している、

```
.toolbar-button-material:activeをstyle.css
```

等に記載しopacity（透過率設定）上書きする。

##具体的な修正方法

###修正前
/components/monaca-onsenui/onsen-css-components.css側

```lang:onsenui
.toolbar-button--material:active {
  opacity: 1;
  background-color: #26a69a;
}
```

###修正後

css/style.css

```lang:onsenui
.toolbar-button--material:active {
  opacity: 0;
  background-color: #26a69a;
}
```

opacityは透過率の設定で0〜1の間で0.1刻みで設定する。
matrix > 逆行列を求めるツール

http://qiita.com/7of9/items/f0e22eeb584dbe144e31
でつまづいた逆行列の計算

以下を見つけた。
http://matrix.reshish.com/inverse.php

一応計算できているが、使い勝手はまだよく分からない。

ツール作成者に感謝。
ズンドコ学園入試問題 > 答案 by 7of9

[ズンドコ学園入試問題](http://qiita.com/mpyw/items/321c5485236615ca4664)

# 1. 状態遷移図

http://madebyevan.com/fsm/
を利用

![qiita.png](https://qiita-image-store.s3.amazonaws.com/0/32870/8c2e17d1-2b43-48e7-befd-7a9d94023328.png)


# 2. 平均状態遷移回数 N および平均文字列長 L

参考 [吸収的マルコフ過程](http://sysplan.nams.kyushu-u.ac.jp/gen/edu/SystemsDesignEngineering/2006/kougi08/kougi08.pdf)

2000年にポーランドで仕事に行った後、ユーレイルパスで乗り継ぎながら南フランス Antibesへ行った。そこで会った INRIA の教授が道路の画像解析にマルコフ連鎖モンテカルロを使っていて１時間近く個人レッスンを受けたが、何ひとつ分からなかった。果たしてそのマルコフと関係あるのかどうか。

余談になるが、この時TOEIC900であったが、ポーランドの列車乗り場の人が英語が通じず途方に暮れていたら、横にいたおじさん（英語通じず）が全面的に協力してくれて無事ポーランドから列車に乗れた。
これをきっかけとして、日本で道に迷っている外国人がいれば一日一組限定で道案内する、ということにした。 皆さんもどうぞ。

## 上記資料の「推移確率行列」
|  | S | A | B | C | D | Kiyoshi |
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
| S  | 1/2 | 0 | 0 | 0 | 0 | 0 |
| A  | 1/2 | 0 | 1/2 | 0 | 0 | 0 |
| B  | 1/2 | 0 | 0 | 1/2 | 0 | 0 |
| C  | 1/2 | 0 | 0 | 0 | 1/2 | 0 |
| D  | 0 | 0 | 0 | 0 | 1/2 | 1/2 |
| Kiyoshi  | 0 | 0 | 0 | 0 | 0 | 1 |

`Kiyoshi列` x `S..D行` が行列Uになるのだろうか。 (行列でなく、列ベクトルか）。
その左側が Q になるのだろう。

基本行列

```math
M = (I - Q)^{-1}
```

5x5の逆行列を求めるのがすごく面倒くさそうだということが分かった。

~~Octave?やMatlab使いでないので、降参。~~

http://www.cg.info.hiroshima-cu.ac.jp/~miyazaki/knowledge/tech23.html

~~Gauss-JordanやLU分解、特異値分解(SVD)など使えばいいらしいが、これらの計算には慣れていない。~~


## 行列 M

以下のツールを利用。
http://matrix.reshish.com/inverse.php

|   | S | A | B | C | D |
|:-:|:-:|:-:|:-:|:-:|:-:|
| S  | 2  | 0  | 0  | 0  | 0  |
| A  | 1.75 | 1  | 0.5 | 0.25 | 0.25  |
| B  | 1.5 | 0  |  1 | 0.5  | 0.5  |
| C  |  1 | 0  | 0  | 1  | 1  |
| D  | 0  | 0  | 0  | 0  | 2  |

 思った以上に値が見やすい行列になった。

## 平均吸収時間 Mg

列ベクトル 

```math
g = ( 1, 1, 1, 1, 1, 1 )^{TR}
```

を行列Mの右側に作用させればいいのだろうか。

これは手計算でできる。

| | Mg |
|:--:|:-:|
|S| 2 |
|A| 3.75 |
|B| 3.5 |
|C| 3 |
|D| 2 |

合計14.25だが、これは「平均状態遷移回数N」なのだろうか。
そうであったとしても、「平均文字列長L」の求め方は分からない。

投げっぱなしジャーマンスープレックス。

<hr>

## 計算やり直し

@mpyw さんの[コメント](http://qiita.com/mpyw/items/321c5485236615ca4664#comment-adb7fba3e87b85b4c18e)によるとRubyで行列計算が簡単にできるようだ。

ideoneでも計算できた。
http://ideone.com/XS2Mzc

### 推移確率行列

S->Aの部分が0でなく1/2だった。

|  | S | A | B | C | D | Kiyoshi |
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
| S  | 1/2 | 1/2 | 0 | 0 | 0 | 0 |
| A  | 1/2 | 0 | 1/2 | 0 | 0 | 0 |
| B  | 1/2 | 0 | 0 | 1/2 | 0 | 0 |
| C  | 1/2 | 0 | 0 | 0 | 1/2 | 0 |
| D  | 0 | 0 | 0 | 0 | 1/2 | 1/2 |
| Kiyoshi  | 0 | 0 | 0 | 0 | 0 | 1 |


### I-Q

|   | S | A | B | C | D |
|:-:|:-:|:-:|:-:|:-:|:-:|
| S  | 0.5 | -0.5 | 0  |  0 | 0  |
| A  | -0.5  | 1  | -0.5  | 0  | 0  |
| B  | -0.5  | 0  | 1  | -0.5  | 0  |
| C  | -0.5  | 0  | 0  | 1  | -0.5  |
| D  | 0  | 0  | 0  | 0  | 0.5  |


### (I-Q)^(-1)

http://ideone.com/XS2Mzc
と同じになってきた。

|  | S | A | B | C | D |
|:-:|:-:|:-:|:-:|:-:|:-:|
| S  | 16  | 8  | 4  | 2  | 2  |
| A  | 14  | 8  | 4  | 2  | 2  |
| B  | 12  | 6  | 4  | 2  | 2  |
| C  | 8  | 4  | 2  | 2  | 2 |
| D  | 0  | 0  | 0  | 0  | 2  |


### Mg

| | Mg |
|:--:|:-:|
|S| 32 |
|A| 30 |
|B| 26 |
|C| 18 |
|D| 2 |

ここで読み方はSのところの32というのが「SからスタートしてKiyoshiになるまでの平均長さ」ということのようだ。

@mpyw さんのコメント

> これよりL=N*2+3=67であることも同時に分かる

上記よりLも求まるようだ。

自分は「行と列って縦横どっちだったっけ？状態」だったり「手計算が面倒そう」などの理由から行列を扱う計算は避けてきた。今回の入試問題で行列を扱う良い環境があることを知りよかったと思う。

感謝。
[備忘]さくらVPSにRailsをインストールする

#はじめに
外部アクセスが必要な小さなアプリを作る必要があり、さくらVPSでつくることにしました。
今後、同様の案件が増えそうなので、備忘の為にもまとめておきます。

#さくらVPSの準備
さくらVPSの準備に関しては他のページに譲ります。
私は公式サイトを参考にさせて頂きました。
[さくらのVPS　サーバの初期設定ガイド](https://help.sakura.ad.jp/app/answers/detail/a_id/2429/~/%E3%81%95%E3%81%8F%E3%82%89%E3%81%AEvps%E3%80%80%E3%82%B5%E3%83%BC%E3%83%90%E3%81%AE%E5%88%9D%E6%9C%9F%E8%A8%AD%E5%AE%9A%E3%82%AC%E3%82%A4%E3%83%89)

#RubyとRailsのインストール
今回は、rbenvにてインストールします。
主にこちらの記事を参考にさせていただきました。
**注意**
Railsのバージョンによっては、mysqlとの接続でエラーがでます。
MySQLを使う場合は、バージョン指定が無難です。
gem install --no-ri --no-rdoc rails --version="4.1.5"
[rails環境構築（CentOS + ruby on rails）](http://qiita.com/shinyashikis@github/items/3501c5f7f71a8e345c3d)

#MySQLのインストール
1.デフォルトMySQLの削除
最初にインストールされているMySQLを削除します。

```
$ sudo yum list installed | grep mysql
$ sudo yum erase mysql-libs
```
2.RPMのダウンロード
[http://downloads.mysql.com/archives/community/](http://downloads.mysql.com/archives/community/)からRPMをダウンロード
バージョンは好きなものに置き換えてください。

```
wget http://downloads.mysql.com/archives/get/file/MySQL-client-5.5.47-1.el7.x86_64.rpm
wget http://downloads.mysql.com/archives/get/file/MySQL-server-5.5.47-1.el7.x86_64.rpm
wget http://downloads.mysql.com/archives/get/file/MySQL-shared-compat-5.5.47-1.el7.x86_64.rpm
wget http://downloads.mysql.com/archives/get/file/MySQL-devel-5.5.47-1.el7.x86_64.rpm
```

3.インストールします

```
yum install MySQL-client-5.5.47-1.el7.x86_64.rpm
yum install MySQL-server-5.5.47-1.el7.x86_64.rpm
yum install MySQL-shared-compat-5.5.47-1.el7.x86_64.rpm
yum install MySQL-devel-5.5.47-1.el7.x86_64.rpm
```

4.myconfの設定
my-*.cnf 名前はサイズによって複数のものが用意されていますが、今回はSmallで。
```
$ sudo cp /usr/share/mysql/my-small.cnf /etc/my.cnf
$ sudo vi /etc/my.cnf
```
以下を最終行にコピーします。

```
[mysqld]
datadir=/var/lib/mysql
socket=/var/lib/mysql/mysql.sock
user=mysql
# Disabling symbolic-links is recommended to prevent assorted security risks
symbolic-links=0
character-set-server = utf8
```

5.インストールしたバージョンの確認

```
mysql --version
```
下記のエラーがでたので、
>libgcc_s.so.1 must be installed for pthread_cancel to work

libgcc_s.so.1をインストールする。
```
yum install libgcc_s.so.1
```

6.MySQLの起動
```
$ sudo service mysql start
```

エラー発生
エラーログをみると、
>Fatal error: Can't open and lock privilege tables: Table 'mysql.host' doesn't exist

とのことなので、ホームディレクトリの認識を
```
mysql_install_db --datadir=/var/lib/mysql --user=mysql
```
改めて、起動でOKでした。

7.MySQLの初期設定
```
$ sudo mysql_secure_installation
```

8.MySQLへのログイン
```
sudo mysql -u root -p
```
JMeter の Request パラメータの文字化けをソースコードを修正せずに解消する方法

JMeter の Proxy を使って HTTP Request を記録する場合、クライアント端末が Windows だと文字コードが Shift_jis のため、文字化けして記録されてしまう。
これを解消する方法として、Server 側で ServletFilter を用いる方法など、サーバ側の設定、ソースコードの修正で解消する方法はあるが、できるだけ、クライアント側でなんとかしたいので、その方法をメモ。

## 結論
ローカルに Reverse Proxy を立て、文字コード変換を行う。

## 構成
`ブラウザ -> local Reverse Proxy -> JMeter Proxy -> サーバ`

##例
* Reverse Proxy に [delegate](http://www.delegate.org/delegate/) を使用 
* delegate port:8888 
* JMeter port:8080

で動作させる例　　↓
`con32-dg9_9_13.exe -P8888 SERVER=http CHARCODE=UTF-8:tosv ADMIN=foo@bar.baz PROXY=localhost:8080`

参考ページ
http://dechnostick.hatenablog.com/entry/2015/01/24/001446
異なるデバイス間でのGoogle Chromeの同期項目設定

####手順
1.Googleアカウントにサインイン
2.Chromeを立ち上げ、ツールバー右端の3本線のアイコンをクリックし、開いたメニューから『設定』を選択
3.設定画面が開くので、『同期の詳細設定』ボタンをクリック
4.同期したい項目を選択
2016年度ズンドコ学園入試問題

「ズン」「ドコ」「ドコキヨシ」の3つの語を持つ言語を考える．開始記号および非終端記号$S$，非終端記号$A,B,C,D$を用いると，状態遷移の定義$d$およびその生起確率$P(d)$は以下のように示される．

```math
\begin{eqnarray}
P(&S & \rightarrow & ズン A & ) = \frac{1}{2} \\
P(&S & \rightarrow & ドコ S & ) = \frac{1}{2} \\
\\
P(&A & \rightarrow & ズン B & ) = \frac{1}{2} \\
P(&A & \rightarrow & ドコ S & ) = \frac{1}{2} \\
\\
P(&B & \rightarrow & ズン C & ) = \frac{1}{2} \\
P(&B & \rightarrow & ドコ S & ) = \frac{1}{2} \\
\\
P(&C & \rightarrow & ズン D & ) = \frac{1}{2} \\
P(&C & \rightarrow & ドコ S & ) = \frac{1}{2} \\
\\
P(&D & \rightarrow & \mbox{ドコキヨシ} & ) = \frac{1}{2} \\
P(&D & \rightarrow & ズン D & ) = \frac{1}{2} \\
\end{eqnarray}
```

このとき，以下の問に答えよ．途中経過も併せて示せ．

1. 状態遷移図を示せ．
2. 言語が終端するまでの平均状態遷移回数$N$および平均文字列長$L$を求めよ．
3. 言語が終端するまでの状態遷移回数が$n$になる確率$P_n$を求めよ．<br>但し$n$は$n\ge5$を満たす自然数とする．

なお問題作成者は2番までしか理解していない．
Spring FrameworkのDI調査

# Spring FrameworkのDependency Injection
Spring FrameworkのDependency Injectionはモジュール間の関係を疎にするために非常に有効です。それによりソフトウェアの再利用性や保守性の向上につながります。

アノテーションだけで簡単に実現ができるのですが、より詳しく理解をしていないと今後の開発において問題が発生するため、Dependency Injectionについて調査をしました。

まず、基本となるWeb Applicationは以下のようになります。単純にアクセスする度にcountをインクリメントして返します。

```http
http://localhost:8080/count

{
  count: 3
}
```

Rest ControllerからはCountService I/Fを実現したBeanに@Autowiredを使用して接続し、利用しています。

CountRestController.java

```java
@RestController
@RequestMapping("/count")
public class CountRestController {
    @Autowired
    private CountService service;

    @RequestMapping(method = RequestMethod.GET)
    public Count getCount() {
        return service.count();
    }
}
```

CountService.java

```java
public interface CountService {
    Count count();
}
```

CountService I/Fを実現したクラスには、@Serviceアノテーションを付加して、Spring FrameworkのDIコンテナに登録をしています。

CountServiceIncrement.java

```java
@Service
public class CountServiceIncrement implements CountService {
    private int counter;

    public CountServiceIncrement() {
        counter = 1;
    }

    @Override
    public Count count() {
        Count count = new Count(counter);
        counter++;
        return count;
    }
}
```

# 複数のコンポーネントの登録
CountService I/Fを実現した別のサービスをDIコンテナに登録します。

```java
@Service
public class CountServiceDouble implements CountService {
    private int counter;

    public CountServiceDouble() {
        counter = 1;
    }

    @Override
    public Count count() {
        Count count = new Count(counter);
        counter = counter * 2;
        return count;
    }
}
```

この場合、DIコンテナは、CountRestControllerの@Autowiredで指定された変数にどちらを紐付ければ良いか分からないため以下のようなエラーを発生します。

```java
 failed; nested exception is org.springframework.beans.factory.BeanCreationException: Could not autowire field: private jp.gr.java.conf.ulexite.spring.multicmp.service.CountService jp.gr.java.conf.ulexite.spring.multicmp.controller.CountRestController.service; nested exception is org.springframework.beans.factory.NoUniqueBeanDefinitionException: No qualifying bean of type [jp.gr.java.conf.ulexite.spring.multicmp.service.CountService] is defined: expected single matching bean but found 2: countServiceDouble,countServiceIncrement
```

これを解決するためには@Qualifierアノテーションを用います。

まず二つのサービスにそれぞれ名前をつけます

```java
@Service("increment")
public class CountServiceIncrement implements CountService {
...
}

@Service("double")
public class CountServiceDouble implements CountService {
...
}
```

次に使用するCountRestController側で@Qualifierでサービスの名前指定を行います。

```java
public class CountRestController {
    @Autowired
    @Qualifier("double")
    private CountService service;
```

これでCountServiceDoubleを使用することができます。

以下にソースコードがあります
https://github.com/yokobonbon/spring-di-sample/tree/master/multicmp

# Scope
@Scopeアノテーションで、コンポーネントの生成タイミングを制御することが可能です。@Scopeを付ける位置は、@Service, @ControllerなどDIコンポーネントの定義の下に記述します。


Scopeには以下の４種類が指定可能です。Scope指定しない場合は、デフォルトで"singleton"になります。

|Scope |Description  |
|---|---|
|singleton  |インスタンスをSingletonとする（デフォルト）|
|prototype  |利用する都度、インスタンス化する |
|request  |Servlet APIのリクエストスコープの間だけインスタンスが生存する|
|session  |Servlet APIのSessionスコープの間だけインスタンスが生存する|
Pythonでk-db.comから時系列データを取得する

**k-dbですが2017/12/31でサービス終了とのことです。**

# はじめに
k-dbから国内先物、指数、個別株、市場統計の時系列データを取得するクラスを書きました。pandas_datareaderだと米国株のデータしか取れないもんで。
[sawadyrr5/PyKDB: k-dbからのデータ取得スクリプト](https://github.com/sawadyrr5/PyKDB)

# 更新履歴
2016/5/12 k-db.comのサイト構成更新に対応しました。先物、指数、個別株、統計ごとにクラス分けしました。内部処理を整理しました。

# 使用方法
まずインスタンス化します。

```py3:PyKDB
from PyKDB import Futures, Indices, Stocks, Statistics

myFutures = Futures() # 先物データ取得用
myIndices = Indices() # 指数データ取得用
myStocks = Stocks() # 個別株データ取得用
myStatistics = Statistics() # 統計データ取得用
```

## Futuresクラス
### プロパティ
```py3:
# 銘柄コードのリストを返す
Futures.symbols

# {銘柄コード: 銘柄名称}の辞書を返す
Futures.names

# {銘柄コード: 限月}の辞書を返す
Futures.contracts
```

### メソッド
#### 指定銘柄の時系列データ取得
```py3:
Futures.price(date_from, date_to, symbol, freq)
```
date_from, date_to 期間を指定(datetime型)
symbol 銘柄コードを指定
freq 頻度を指定('1d', '4h', '1h', '30m', '15m', '5m')

#### 全銘柄の時系列データ取得
```py3:
Futures.price_all(date_from, date_to, session)
```
date_from, date_to 期間を指定(datetime型)
session セッションを指定(None=全部, 'e'=夜間) 省略時は全部


## Indicesクラス
### プロパティ
```py3:
# 銘柄コードのリストを返す
Indices.symbols

# {銘柄コード: 銘柄名称}の辞書を返す
Indices.names
```

### メソッド
#### 指定銘柄の時系列データ取得
```py3:
Indices.price(date_from, date_to, symbol, freq)
```
date_from, date_to 期間を指定(datetime型)
symbol 銘柄コードを指定
freq 頻度を指定('1d', '4h', '1h', '30m', '15m', '5m')

#### 全銘柄の時系列データ取得
```py3:
Indices.price_all(date_from, date_to, session)
```
date_from, date_to 期間を指定(datetime型)
session セッションを指定(None=全部, 'a'=前場, 'b'=後場) 省略時は全部


## Stocksクラス
### プロパティ
```py3:
# 銘柄コードのリストを返す
Stocks.symbols

# {銘柄コード: 銘柄名称}の辞書を返す
Stocks.names
```

### メソッド
#### 指定銘柄の時系列データ取得
```py3:
Stocks.price(date_from, date_to, symbol, freq)
```
date_from, date_to 期間を指定(datetime.datetime型)
symbol 銘柄コードを指定
freq 頻度を指定('1d', '4h', '1h', '30m', '15m', '5m')

#### 全銘柄の時系列データ取得
```py3:
Stocks.price_all(date_from, date_to, session)
```
date_from, date_to 期間を指定(datetime.datetime型)
session セッションを指定(None=全部, 'a'=前場, 'b'=後場) 省略時は全部


## Statisticsクラス
### プロパティ
```py3:
# 銘柄コードのリストを返す
Statistics.symbols

# {銘柄コード: 銘柄名称}の辞書を返す
Statistics.names
```

### メソッド
#### 指定銘柄の時系列データ取得
```py3:
Statistics.price(date_from, date_to, symbol, freq)
```
date_from, date_to 期間を指定(datetime.datetime型)
symbol 銘柄コードを指定
freq 頻度を指定('1d')

#### 全銘柄の時系列データ取得
```py3:
Statistics.price_all(date_from, date_to, session)
```
date_from, date_to 期間を指定(datetime.datetime型)
session セッションを指定(None=全部) 省略時は全部
Bitbucketのissue(課題)を一括で登録する

個人でbitbucketのissue機能を使っているのですが、issueを一つずつ登録するのが大変でした。
一括で登録できないか調べてみたところ、jsonをupすれば一括で登録ができるらしく、やってみました。

作業としては以下になります。
1:所定の書式に沿ったjsonを用意する
2:zipにする(zipにしないとエラーになる)
3:upする


##1:所定の書式に沿ったjsonを用意する
https://confluence.atlassian.com/bitbucket/issue-import-export-data-format-330796872.html
こちらを参考にjsonを作成していきます。
公式?が間違っているのか、issueに関するjsonを作成するときはcontentのkeyも必要になります。(Requiredって書いてないのに・・・)
加えてmetaも必要になるようです。

10回くらいupとエラーを繰り返し、最終的にこうなりました。

```lang:hoge.json
{
    "issues": [
        {
            "content": "Some **issue**.", 
            "content_updated_on": "2013-01-22T15:55:13.573339+00:00", 
            "created_on": "2013-01-22T15:55:13.573339+00:00", 
            "id": 1, 
            "kind": "task", 
            "priority": "major", 
            "status": "new", 
            "title": "Test", 
            "updated_on": "2013-01-22T15:55:13.573339+00:00"
        }
    ], 
    "meta": {
        "default_assignee": "Yoshimaru Shirakawa", 
        "default_component": "ui", 
        "default_kind": "task", 
        "default_milestone": null, 
        "default_version": null
    }
}
```
これ以上何かを削るとエラーが起きてupできないと思います。
ポイントは
- idは自前でつけてね(idがかぶったら上書きするよ)
- meta忘れないでね
- contentも必須だよ
- jsonの名前はなんでもいいよ
って感じです。

##2:zipにする
ターミナルを開き、

```lang:コマンド
zip -j hoge.zip /Users/UserNameHoge/Downloads/hoge.json 
```
等を実行してhoge.jonをzipにしています。
-jコマンドでディレクトリ構成を保たずにファイルだけzipにしています。


##3:upする
<img width="1367" alt="スクリーンショット 2016-03-21 14.41.52.png" src="https://qiita-image-store.s3.amazonaws.com/0/67575/40ddff17-ebc6-a414-88a1-54fd5b649b02.png">
**Settingsの課題/インポート&エクスポート**からzipをインポートすることができます。
インポートした時にエラーが発生すればここでエラーが表示されると共に、登録しているメールアドレスに結果が送られます。


##やってみて
jsonを自前で作成するととても面倒くさいのでpythonやElectronとかでクライアントを作成してみようと思います。
titleだけ指定すれば勝手にzipにして出力してくれる的な・・・
Zurb Foundation 6 Sassバージョンを使用する上で、理解すべき2つのscssファイル

![スクリーンショット 2016-03-21 12.04.49.png](https://qiita-image-store.s3.amazonaws.com/0/116223/36f7be0a-07cf-e0c8-7860-1d0bfceaa78b.png)

前回は、[Zurb Foundation 6 SassバージョンのCLIインストールとサイト制作までの準備](http://qiita.com/kohki-shikata/items/1abe8d79388ab90e3730)ということで、Foundationを使ったサイト制作開始直前までを解説しました。

ここからは、実際にサイト制作を行う上で、どう行っていけばいいか、特にそのスタイル制作（CSSコーディング）について説明します。

---

# app.scssと_settings.scssの理解を深める
前回、

>細かい説明はすっとばして、app.scssの最終行から、ユーザー自身のスタイルを記述していきます。

と書きましたが、ここではその「細かい説明」を行います。

## ユーザー自身のスタイル記述はapp.scssの最後に

重複しますが、とても大事なことなのでもう一度いいます。

Foundationが持たないスタイル、つまりそのサイトがもつ**オリジナルのデザインスタイルを記述するのは、常にapp.scssの最終行以降**です。これが原則となるお約束。

## Foundationが持つスタイルを変更する時は、_settings.scssを編集する

これが二つ目の大事なお約束です。

例えば、Foundationにはボタンのスタイルがあらかじめ用意されていますが、

```html:sample.html
<!-- Anchors (links) -->
<a href="about.html" class="button">Learn More</a>
```

と書けば、下記のように表示されるわけです。

![スクリーンショット 2016-03-21 13.53.25.png](https://qiita-image-store.s3.amazonaws.com/0/116223/14af11ff-fb3d-c025-5a9b-be0b2bcdc00f.png)

しかし、このボタンの青色が気に入らない、もっと別の色にしたい… せや、黒にしたろ！　という時があると思います。

しかし、こう書くのはFoundation的にはナンセンス。

```css:app.scss
.button {
  background-color: #000;
}
```

正しくは、_settings.scssを開き、233行目あたり

```css:_settings.scss
// 11. Button
// ----------

$button-padding: 0.85em 1em;
$button-margin: 0 0 $global-margin 0;
$button-fill: solid;
$button-background: $primary-color;
$button-background-hover: scale-color($button-background, $lightness: -15%);
$button-color: $white;
$button-color-alt: $black;
$button-radius: $global-radius;
$button-sizes: (
  tiny: 0.6rem,
  small: 0.75rem,
  default: 0.9rem,
  large: 1.25rem,
);
$button-opacity-disabled: 0.25;
```

がありますので、`$button-background: $primary-color;'を`$button-background: #000;`に書き換えればOK。

その他の変数も、見ているとなんとなく理解できると思います。

すなわち、**Foundationが持っている機能のスタイルを変更したい時は、まず_setting.scssを読み、それっぽい変数があれば、それを書き換える**というのが、Foundation流です。

# まとめ
![Foundation 6 scss編集ガイド1.png](https://qiita-image-store.s3.amazonaws.com/0/116223/7fc67755-fb8a-27e8-3db8-7ac6c84514fb.png)

要は、上記のようにすればOK。

では、実現したいスタイルがFoundationのコンポーネントにあるのかどうか、そういったことを調べるにはどうしたらいいのか。次回はその辺を解説したいと思います。
Welcartのカート画面で任意の商品画像を表示する

#Welcartのカート画面で任意の商品画像を表示する

##目的
　Wlecartを使用したショッピングサイトの案件で、販売商品としてカスタマイズが可能な商品の販売案件が有りました。商品の単価や数量、在庫の情報は商品マスタに登録した情報を使用するのですが、カスタマイズが可能な為、個別に商品画像が変化します。別途、カスタマイズのプログラムを実行して、カスタマイズされた商品画像は作成されて、メディアファイルとしてアップロードされている前提で、カートの写真をカスタマイズされた画像にします。
　前提となる状況までの情報はネット上で比較的見つかったのですが、Welcartのカートの商品画像の入れ替えは少し手間取ったので、コードをアップしておこうと思います。

##準備
　Welcartの商品マスタでオプションが指定できるように設定します。

　1.メニューのWelcart shop　→　基本設定　から共通オプションでオプションを指定します。
　*今回は、コードでオプションに入力したURLの画像を表示させるようにしているので任意のオプション名とし、入力項目はテキストとします。*

　2.1の設定後、商品マスタで商品オプションが設定できるようになるので、1で設定したオプションを適用します。

　3．カートボタンを表示するとオプションの入力欄が表示されるようになります。

##コード

```php:test.php
/*
 * Welcart のカード画面のサムネイルをカスタマイズ結果の画像にする
 * 
 * オプション-完成画面　に完成画像のパスを渡してその画像をカートのサムネイルに表示
 * 
  */
class welcart_change_thumnail {
	public function __construct() {
                add_filter('usces_filter_cart_thumbnail', array( __CLASS__, 'change_thumnail' ), 10, 5);
	}
	public static function change_thumnail( $cart_thumbnail, $post_id, $pictid, $i, $cart_row ){
                if ($cart_row['options'][urlencode('完成画面')]){
                    $optstr = $cart_row['options'][urlencode('完成画面')];
                    $upload_dir = wp_upload_dir();
                    $cart_thumbnail = '<img src="' . $upload_dir['url'] . '/' . nl2br(esc_html(urldecode($optstr))) . '">';
                }
                return $cart_thumbnail;
        }
    
}
```

「完成画面」という部分を実際にオプションで指定した名前にします。
「完成画面」というオプション項目を持った商品をカートに入れてカート画面に移行したときに商品画像の部分を「完成画面」に入力されたURLの画像を表示します。御覧の通り、img の　srcで指定出来る画像であれば表示するはずです。
　「完成画面」オプションのない商品は通常通り、登録された商品画像が表示されます。




##実際の使用について
オプションにURLを入れて表示させているため実際の使用には入力時点で色々と考慮する必要が有ると思います。私の場合は、カートの画面をほぼ非表示としてオプションを入力して使っています。
表示状態で任意の入力をしてもらう場合は入力制限などが必要になると思います。そこの部分は別途ネットで情報を検索したほうが精度の高い情報が有ると思います。

写真を使っていないので分かりにくい説明になっていますが、時間のある時にでも操作画面の写真を入れようと思います。
ひとまず、2件目の投稿として・・・
How to Remove "max-width" Style When Browsing with Reader Mode of Safari

Safari の「リーダー」機能ってどのくらい使われてるのか知らないんですが、こーゆーページを……
>![01.png](https://qiita-image-store.s3.amazonaws.com/0/28376/d11db095-bb9b-6f58-0533-f201a2af921c.png)

こんな風に表示する機能です。
>![02.png](https://qiita-image-store.s3.amazonaws.com/0/28376/c7ddf747-39bb-eb44-40a5-f9f9c4bb965b.png)

iPad で見るときなんかに便利ですよね。

ところで小生、さいきん老眼が進んでまいりまして、文字を大きくしたくなるんです (大きいディスプレイも買ったしね)。

でも文字を大きくしてもページ幅は変わらないので……
>![03.png](https://qiita-image-store.s3.amazonaws.com/0/28376/db629b4f-b1ca-52b4-15d1-9198f9856990.png)

左右のマージンが残念な感じです。

max-width スタイルを消せばイイ感じになるのは知ってたので……
>![04.png](https://qiita-image-store.s3.amazonaws.com/0/28376/8482521c-8a0c-c3ce-0169-5b5e17de86e2.png)

今までは手動でいちいち消していたんですが、javascript 一発で消すコトが出来たのでご紹介です。

```js
$('#article').style.maxWidth = 'none'
```
>![05.png](https://qiita-image-store.s3.amazonaws.com/0/28376/09163df8-1840-4bcc-997f-92ff69846f03.png)

イイ感じになりました。
ブックマークレットにできればなお良し、といったところですか。
[備忘録] Unityのエディタ上でクラスの型情報を取得する

エディタ上に定義されている型情報を取得する。
以下のコードで実現できた。

```csharp:
Type findType = typeof(MonoBehaviour);

Type[] types = Assembly.GetAssembly(findType).GetTypes();

if (types != null)
{
    foreach (Type type in types)
    {
        Debug.Log("type:" + type);

        if(type.IsSubclassOf(findType))
            Debug.Log("[Subclass] type:" + type);
    }
}
```
ズンドコキヨシ with Google Map API on jsFiddle

Google Map APIを試してみたかった。

jsFiddle上で実装。

Fork元 https://jsfiddle.net/salman/4mtyu/

今回の実装 https://jsfiddle.net/bqLqkzax/1/

地図の(見える|見えない)は以下で異なる

- `MacOS X 10.8.5 + Chrome`では地図が見えず
- `MacOS X 10.8.5 + Safari`なら地図が見えた
- `Windows 8.1 pro(64bit) + Chrome`でも地図が見えない
- `Windows 8.1 pro(64bit) + IE`で「セキュリティで保護されているコンテンツのみ表示しています。全てのコンテンツを表示しますか」で「はい」にしたら地図が見えた

４地点は検索で選んだだけなので、とくに各地点に対しての意図などはございません。

## code

```html:html
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?v=3&amp;sensor=false"></script>
<div id="map_div" style="height: 400px;"></div>
```

```js:js
var map;

google.maps.event.addDomListener(window, "load", function () {

var map = new google.maps.Map(document.getElementById("map_div"), {
    center: new google.maps.LatLng(35.8899758,140.0727435),
    zoom: 5,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  });

  var infoWindow = new google.maps.InfoWindow();

  function createMarker(options, html) {
    var marker = new google.maps.Marker(options);
    if (html) {
      google.maps.event.addListener(marker, "click", function () {
        infoWindow.setContent(html);
        infoWindow.open(options.map, this);
      });
    }
    return marker;
  }

  /*
   * add markers to map
   */
  var marker1 = createMarker({
    position: new google.maps.LatLng(35.4517004,139.2902533),
    map: map
  }, "<h1>Marker 1</h1><p>ＺＵＮＤ−ＢＡＲ</p>");

  var marker2 = createMarker({
    position: new google.maps.LatLng(34.5757397,135.4807426),
    map: map
  }, "<h1>Marker 2</h1><p>マルチズンズン</p>");

  var marker3 = createMarker({
    position: new google.maps.LatLng(35.8899758,140.0727435),
    map: map,
    icon: "http://1.bp.blogspot.com/_GZzKwf6g1o8/S6xwK6CSghI/AAAAAAAAA98/_iA3r4Ehclk/s1600/marker-green.png"
  }, "<h1>Marker 3</h1><p>ズンドコ商店 取手店.</p>");

  var marker4 = createMarker({
    position: new google.maps.LatLng(34.7682822,135.55387),
    map: map
  }, "<h1>Marker 4</h1><p>きよし</p>");


});
```

```css:css
body {
  margin: 0;
  padding: 0;
  font: 12px sans-serif;
}
h1, p {
  margin: 0;
  padding: 0;
}
```
Swift｜ResultのResultがResult.Resultとして使えない（Alamofire.Resultと併用でハマった）


そもそもタイトルが何言ってるかよくわかんない感じですが、[Result](https://github.com/antitypical/Result)のResultが`Result.Result`として使えず、しばらく原因がわからずハマりましたが、Resultのissueで紹介されていた回避策で一旦解決できたのでメモ。（ほぼ下記issueの紹介です）
結論としてはSwiftのバグのようなのでこの回避策以外ではとりあえずはどうにもならなそう。

https://github.com/antitypical/Result/issues/77


## "Result"で謎のエラー

[Alamofire](https://github.com/Alamofire/Alamofire)と[Result](https://github.com/antitypical/Result)を同じファイルにimportして使っている場合に、`Reference to generic type 'Result' requires arguments in <...>`というエラーが発生しました。

たとえば、下記のような`someResult()`があったとします。
Resultは`Result<T, Error: ErrorType>`、Alamofireも独自で`Result<Value, Error: ErrorType>`を定義しているので、AlamofireでもResultでもこの`someResult()`は成立します。

```swift:
import Alamofire
import Result

func someResult(string: String) -> Result<String, Error> {
    return .Success(string)
}

enum Error: ErrorType {
    case SomeError
}
```

ただ、どちらもimportされている場合には、あたりまえですがどちらの`Result`かわからないのでエラーがでます。
`'Result' is ambiguous for type lookup in this context`

![png](https://qiita-image-store.s3.amazonaws.com/0/1699/358b0e5b-b1a9-b37f-37ab-87c2b416e078.png "そりゃそうだ")


そこで、この`someResult()`ではResultのResultを返すものとして明示し、下記のように修正します。

```swift:
import Alamofire
import Result

func someResult(value: Any) -> Result.Result<Any, Error> {
    return .Success(value)
}
```

何だ簡単、これでOK、と思いきや…
`Reference to generic type 'Result' requires arguments in <...>`

![png](https://qiita-image-store.s3.amazonaws.com/0/1699/3ab22556-ed92-0237-0b73-266a2c8d6048.png "OMG...")


な、なんと…。:fearful: 

試しにこれをAlamofire.Resultに変更してみます。

```
func someResult(value: Any) -> Alamofire.Result<Any, Error> {
    return .Success(value)
}
```

![png](https://qiita-image-store.s3.amazonaws.com/0/1699/c53af90c-7350-b473-270c-4a0a9958fbe4.png "で、ですよね")


だ、大丈夫だ…。（そりゃそうだ）

## 原因

冒頭でも記載しましたが、どうもSwiftのバグが原因のようです。

http://openradar.appspot.com/20633559

こちらで報告されていますが、`Set`という名前のフレームワークの中に、同名`Set`のジェネリクス型が定義されている場合に、`Set.Set`として呼び出すとSwiftがいい感じに解釈してくれないために、エラーが発生しちゃうよ！というもので、Resultでもこれと同じことが発生しているようです。


## 回避策

先ほどの[issueで紹介されている回避策](https://github.com/antitypical/Result/issues/77#issuecomment-135041149)では、ResultをResultResultとしてラップしたものを別ファイルに定義して、それをResult.Resultの代わりに使うという方法が紹介されています。


```swift:ResultResult.swift
import Result

struct ResultResult<T, Error : ErrorType> {
    typealias Result = Result<T, Error>
}
```

```swift:
import Alamofire
// import Result

typealias AnyResult = ResultResult<Any, NSError>.t

func someResult(value: Any) -> AnyResult {
    return .Success(value)
}

// もちろんfunc someResult(value: Any) -> ResultResult<Any, NSError>.t でも問題はないです

```

これで無事にResultのResultを明示的に指定してつかえるようになりました…！

![png](https://qiita-image-store.s3.amazonaws.com/0/1699/f17c1f9b-bd2e-352c-9d78-f95a942aff48.png "手間かけさせるぜ…")

## 追記（17' 03/14）

Swift3への対応をまとめてくださった方が！ありがとうございます。

http://qiita.com/ANNotunzdY/items/42fbb84e73544fda5bac

早くswiftのバグ解消されないですかねえ…。
respond_with について　[ 自分用メモ ]

参考サイト
http://blog.livedoor.jp/sasata299/archives/51804693.html
http://d.hatena.ne.jp/shilen40/20130515/1368624103

例)
class UsersController < ApplicationController::Base
  　respond_to :html, :xml, :json

  　def index
    　　respond_with(@users = User.all)
  　end

  　def create
    　　@user = User.create(params[:user])
    　　respond_with(@user, location: users_url)
  　end
end



・respond_toとペアで使って上のように書くことができる。
・respond_withメソッドを使うときは、respond_toメソッドとペアで使う必要がある。
・respond_toメソッドで指定していないフォーマットでアクセスされると、406 Not Acceptableエラーを返す。
【自分用】LinuxのI/Oスケジューラって知らなかったので少し調べてみた


無知のため、I/Oスケジューラってなんのこと？状態だったので、
少し調べてみてキュレーションします。

-

# I/Oスケジューラって
 
`I/Oスケジューラ`は、Linuxカーネルの一種。
カーネル 2.6.9 以前は1種類ののみで、コンパイル時に固定化されていた。
カーネル 2.6.10 からはデバイス毎に切り替えることが可能になった（ディスクや用途に応じて…）。

-

# カーネル 2.6.17 に組み込まれているスケジューラ

- noop
	- 何もしないスケジューラ。
	- SSDを使用する場合に、推奨されているらしい。


- anticipatory
	- 一般的なハードディスクと同等な構造を持つと仮定して、将来の入出力要求を予測したスケジューリングを行う。
	- 要求をある程度貯めるので、多少レイテンシが悪くなることもある。
	- 比較的に低速のハードディスクに推奨される。

- deadline
	- DB向きのスケジューラ。
	- スループットよりもレイテンシに最適化したスケジューリングを行う。

- cfq
	- Fedoraのデフォルト。
	- プロセス毎のI/Oキューを持ち、公平なスケジューリングを行う。
.mo ファイルを .po ファイルに戻す方法

.mo ファイルしか無いときに、どうしても言語ファイルを編集したい時に使う方法

# Online Tools for WordPress

**Online Tools for WordPress**
[http://tools.konstruktors.com/](http://tools.konstruktors.com/)
こちらに、「Convert .mo to .po」というセクションがあります。

# Mac の中で行う

上記のオンラインツールも、gettext というツールを使っていて、Mac OS でも実現可能です。

訳の分からないサービスにデータを送りたくなければ、自分の Mac でも実現可能です。

## Gettext & PoEditをインストールする。

私は Homebrew というパッケージ管理ツールを使って gettext をインストールしています。

1. Homebrewをインストールする - 参考記事: [MacにHomebrewをインストールする](http://qiita.com/_daisuke/items/d3b2477d15ed2611a058)
2. Gettext と PoEdit をインストールする - 参考記事: [Macで翻訳ファイル*.poをmo形式に変換する](http://qiita.com/tailak/items/0a866aac4cc8f2f8c135)」

## コマンド

### .mo を .po に変換

`msgunfmt [moファイルパス] -o [poファイルパス]`

例: `msgunfmt messages.mo -o messsages.po`

### .po を .mo に変換

`msgfmt [poファイルパス] -o [moファイルパス]`

例: `msgfmt messages.po -o messsages.mo`

# Windows で使う

メモ。Windows は、PoEdit の中に、msgunfmt ファイルが入っているそうです。

参考: [moファイルをpoファイルに変換する方法](http://techmemo.biz/web-cheat-sheet/mo%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E3%82%92po%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E3%81%AB%E5%A4%89%E6%8F%9B%E3%81%99%E3%82%8B%E6%96%B9%E6%B3%95/)

```
cd "C:\Program Files\Poedit\GettextTools\bin"
msgunfmt.exe "[moファイルパス]" -o "[poファイルパス]"
```
数式の練習


Kobito では、数式が Qiita で見たとおりには表示されない。
これは、 Qiita でどう見えるかの練習です。
（何か他に良い方法は無いのでしょうかね）

## 等号の位置揃え

コメントいただきました。eqnarray を使うと揃うとのこと。
次の様に入れると、

```source
 ```math
 \begin{eqnarray}
 y & = & (x + 1)^2\\
 & = & x^2 + 2x + 1
 \end{eqnarray}
```

結果は、

```math
\begin{eqnarray}
y & = & (x + 1)^2\\
& = & x^2 + 2x + 1
\end{eqnarray}
```

素晴らしい、うまくいきました。

## 標本の標準偏差での使用例

使いたかったのは、標本の標準偏差の計算で以下の通りです。

ここで、標本の標準偏差 `u` といっているのは次のことです。
（似たようなもので、`n-1` ではなく `n` で割るものもあります。）

https://ja.wikipedia.org/wiki/標準偏差

```math
u = \sqrt{ \frac{1}{n - 1} \sum_{i=1}^{n}(x_i - \bar{x})^2 }
```

ここで、 $\bar{x}$ は、$x$ の平均。$\bar{x} = \frac{1}{n}\sum_{i=1}^{n}x_i$


$u$ は、式を変形すると、次の様になります。

```math
\begin{eqnarray}
u & = & \sqrt{ \frac{1}{n - 1} \sum_{i=1}^{n}(x_i - \bar{x} )^2 }
  \\
  & = & \sqrt{ \frac{1}{n - 1} \sum_{i=1}^{n}(x_i^2 - 2x_i\bar{x} + \bar{x}^2 ) }
  \\
  & = & \sqrt{ \frac{1}{n - 1} \sum_{i=1}^{n}
    \left\{
    x_i^2
    - 2x_i\frac{1}{n}\sum_{i=1}^{n}x_i
    + \left( \frac{1}{n}\sum_{i=1}^{n}x_i \right)^2
    \right\}
  }
  \\
  & = & \sqrt{ \frac{1}{n - 1}
    \left\{
    \sum_{i=1}^{n}x_i^2
    - 2\frac{1}{n}\sum_{i=1}^{n}x_i\sum_{i=1}^{n}x_i
    + n \left( \frac{1}{n}\sum_{i=1}^{n}x_i \right)^2
    \right\}
  }
  \\
  & = & \sqrt{
  \frac{n}{n - 1}
  \left\{
    \frac{1}{n} \sum_{i=1}^{n}x_i^2 
    -
    \left( \frac{1}{n} \sum_{i=1}^{n}x_i \right)^2
  \right\}
  }
  \\
  & = & \sqrt{
  \frac{n}{n - 1}
  \left\{
    \bar{ (x^2) } - (\bar{x})^2
  \right\}
  }
\end{eqnarray}
```

ここで、$\bar{x^2}$ は、$x^2$ の平均。$\bar{x^2} = \frac{1}{n}\sum_{i=1}^{n}x_i^2$



## 参照

* http://qiita.com/iizukak/items/04d6e226982bc108bc16

綺麗に数式が書かれています。

ローレンツ方程式を真似してみると、

```math
\begin{aligned}
\dot{x} & = \sigma(y-x) \\
\dot{y} & = \rho x - y - xz \\
\dot{z} & = -\beta z + xy
\end{aligned}
```

Maxwell 方程式は、

```math
\begin{aligned}
\nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} & = \frac{4\pi}{c}\vec{\mathbf{j}} \\   \nabla \cdot \vec{\mathbf{E}} & = 4 \pi \rho \\
\nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} & = \vec{\mathbf{0}} \\
\nabla \cdot \vec{\mathbf{B}} & = 0 \end{aligned}
```

うまくいっていますね。