Sierですが何か?

仕事、趣味などで興味を持った技術など(ブログタイトル迷走中)

初めての機械学習で株価の未来予測

初めての機械学習で株価の未来予測

f:id:shinji-fsi-5761:20161008022107j:plain


10cmです。こんにちは。今回は機械学習について記載していきます。

私事ですが、最近株をはじめました。本件とは別に、株価を確認するためのスマホアプリを休日に作成しております。

せっかく株価データをAPIを使って取得しているため、他にも使えないかと思い、機械学習に走りました。

株価の未来予測なんて他の方がたくさんやられていますが、今回はメモ感覚で記載します。

今回はサイトの実装を参考にして(パクって)実装します。


環境

  • CentOS 7
  • python3.6
  • scikit-learn
  • pandas


概要

予測したい日付の株価(終値、以下株価)を、前n日分の株価を用いて予測します。
アルゴリズムは、決定木を使用します。

実装

# 株価データの取得
orign_data = getOneDay(6752)

# リターンインデックス(丸パク)
returns = pd.Series(orign_data).pct_change()
ret_index = (1 + returns).cumprod()
ret_index[0] = 1

# 教師データの作成
x, y = createData(ret_index.tolist())

# 予測データと答え
xx = x.pop(-1)
yy = y.pop(-1)


# 決定木(丸パク)
clf = tree.DecisionTreeClassifier()
clf.fit(x, y)

result_y = getResult(xx, clf)
print('期待値	:{0}'.format(yy))
print('結果	:{0}'.format(result_y))

orign_data

株価データはmysqlでデータとして保持しているため、銘柄コードのデータを日付順にソートして取得しています。

ret_index

リターンインデックス、と言うものが何を表しているのかよくわかっていません。
生の株価データを利用するより割合?で教育データを作った方が良いとのこと。

x, y

xには、教育に利用するデータ(30日分)、yにはその時の結果がリストで入っています。

x = [[100, 111, 112, ・・・ , 120, 115], [] ・・・・ []]
y = [1, 0, 0, 1, ・・・, 1, 0]
# 1: 上がった、 0: 下がった


clf

clfには、scikit-learnで提供されている、決定木のオブジェクトが入ります。
clf.fit(x, y)とすることで、学習が行われます。

clf.predict(予測用データ)とすることで、予測結果が返ってきます。

最後に、答え合わせを行っています。


結果

学習データの数によって、1になったり0になったり。。。(当たりまえか)
わかってはいましたが、株価だけではやはり教育データとして決定打にかけている。

外的要因(ニュースなど)を用いた株価予測などを今後やっていこうと思います。

参考

機械学習で未来を予測する - scikit-learn の決定木で未来の株価を予測


にほんブログ村 IT技術ブログへ
にほんブログ村

【Angular2】簡単なWebアプリ制作(その3)

f:id:shinji-fsi-5761:20161008022107j:plain

10cmです。こんにちは。今回は、WebSQLを用いて購入物の管理を行います。

GitHabはこちらになります。

以下のような機能を実装しました。

  • 購入物をDBから取得
  • 購入物をDBに追加
  • 購入物をDBから削除


Angular2でWebSQLを使うようにするのは別記事で説明いたします。

データを追加

まずはデータのを追加するための機能です。

ComponentがWebSQL用のServiceのメソッドを実行しています。

public runInsertPurchases(purchases:Purchases): Promise<any> {
    return new Promise(function(resolve,reject){
        this.db.transaction(
             function(trans){
                // 購入物の追加
                trans.executeSql(SQL_TEXT.INSERT_PURCHASES,[purchases.category, purchases.price, purchases.num, purchases.date],

                // 追加成功
                function(trans,res){
                    resolve(res);
                },
                // 追加失敗
                function(trans,error){
                    console.log('execSqlCustom error ' + error.message);
                    reject(error);
                }
            )
        }
    )}.bind(this));
}

"trans.executeSql"で渡している引数のSQLが実行されます。

引数は以下のようになっています。

  • SQL
  • パラメータ
  • 成功時のコールバック関数
  • 失敗時のコールバック関数

コールバック関数でComponentに通知(resolve, reject)を行い、必要な処理を行わせます。

追加では、結果をalertで表示させるようにしています。

f:id:shinji-fsi-5761:20161103175748p:plain

データを取得、表示

DBに追加したデータを表示します。

今回は、前に作成していたリスト表示のMockの部分を修正していきます。

public runGetPurchases(from, to): Promise<Purchases[]> {
    var array:Array<string> = [from, to];

    // DBにアクセスする
    return new Promise(function(resolve, reject) {
        this.db.transaction( 
            function(trans) {
                // 購入物の取得を行う
                trans.executeSql(SQL_TEXT.SELECT_PURCHASES_OF_DAILY, array, success);
                // 取得成功
                function success(trans, res) {
                    // 配列の中身がからの場合
                    if( res.rows.length ) {
                        resolve(res.rows);
                    } else {
                        reject("取得結果は0件です")
                    }
                }
            }
        )
    }.bind(this));
}

この関数では、FromとToを取得してその間にある購入物を取得します。

取得後、row.rowsが実際の結果になります。

また、件数が0件の場合は、エラーとして通知します。

f:id:shinji-fsi-5761:20161103175822p:plain

データを削除

追加したデータの削除を行います。

リスト表示画面において、購入物ごとに削除ボタン(☓ボタン)を表示しています。選択された購入物のIDを用いて削除を行っています。

public runDeletePurchases(id: number): Promise<any> {
    return new Promise<any>(function(resolve, reject){
        this.db.transaction(
            function(trans) {
                // 購入物の削除
                trans.executeSql(SQL_TEXT.DELETE_PURCHASES, [id],
                    // 削除成功
                    function(trans, res) {
                        resolve(res);
                    },
                    // 削除失敗
                    function(trans, error) {
                        resolve(error);
                    }
                )
            }
        )
    }.bind(this));
}

作りは追加と同じです。削除の成功、失敗を通知して後処理はComponentが行います。

削除の結果をalertで表示させています。

また、削除に成功した場合は、再度DBから取得を行い、最新の状態を表示するようにしています。

f:id:shinji-fsi-5761:20161103180339p:plain


まとめ

angular-cliのプロジェクトでWebSQLを利用したデータの管理を行った。

今後は、チャート表示の方に手をつけていこうかなと。

チャートは何使おうかな。google-chartくらいしか使ったことないけど。



にほんブログ村 IT技術ブログへ
にほんブログ村

【Angular2】ハンズオンに参加してきました

f:id:shinji-fsi-5761:20161008022107j:plain

10cmです。こんにちは。先日、ng_japan主催のAngular2ハンズオン勉強会#3に参加してきました。

勉強会に参加するのは今回が初めての私ですが、Angular2は事前に学習していたため、内容はすんなりと入ってきました。

細かい質問にも丁寧に答えてくださったスタッフの方々、ありがとうございました。

前起きはこれくらいにして、今回はハンズオンの内容と、個人的にためになった内容を幾つか記載していこうと思います。

ハンズオンの内容

ハンズオンでは、Angular2公式のチュートリアル、"Tour of Heroes"を行いました。公式と違う点は、日本語で丁寧に解説されている資料があることと、"angular-cli"を用いていたことでしょうか。

Angular2では、公式ツールとして"angular-cli"があります。

自分の記事でも過去にご紹介したことがありますが、Angular2の開発を行う上で欠かせないツールとなるでしょう。

ハンズオンでは、ツールの細かい使い方も丁寧に教えて下さいました。このツールの欠点は、プロジェクトの初回生成時の遅さにあるそうです。

確かに、家のネットワークなどでやっていても2~3分はかかっています(会場では一度にみなさんがやったせいか、回線がパンクしていましたね笑)

ただ、個人的に使っていても気になる点はそこだけで、本当に使いやすいツールです。

改めて知ったAngular2のいいところ

自分はフロントエンドに足を突っ込んでまだ2年目の新参者です。もとは、CやらC++やらをガッツリやっていました。

そんな自分は、CSSを書くときにクラスを指定したり、あるIDに対してのみ設定したりと、面倒なぁって思うことがありました。

Angular2では、Componentに閉じてCSSを記載することができる!

Componentが巨大にならない限りIDを意識したりする必要がない!(巨大化してたらそもそも分割できそうですが)

CSSに対してスコープという概念が出てきたのは驚きでした。(そうでもないのかな?)

カッコにはきちんと意味があった

AngularJSの1系を触っている自分には、Angular2で馴染めない部分がありました。その一つがカッコでした。

AngularJSでは、"ng-model"や"ng-click"など、ng-***でテンプレートに対して記載していました。

Angular2では上記のものは、[(ngModel)]、(click)となり随分と様変わりしました。

や()ってなんやねん。ってのがハンズオンを受ける前の自分でした。しかし、きちんと以下のように規則性がありました。

  • ⇛ Templateに値をComponentから渡す場合に設定
  • () ⇛ Templateから値をComponentに渡す場合に設定

これを聞いたとき、ngModelにが[( )]になっているわけがわかりました!

この辺も公式ドキュメントに記載されているらしいのですが、勉強不足でした(> <)

終わりに

ハンズオンの後は、主催者、サポートしてくださったかた、参加者で懇親会を行いました。

ひよっこSierの自分にはレベルの高い話ばかりでついていけないことのほうが多かったですが、楽しく飲ませていただきました。

これを気に勉強会の参加を増やして知識と人脈を増やしていけたらなと思います。

【Angular2】簡単なWebアプリ制作(その2)

f:id:shinji-fsi-5761:20161008022107j:plain

10cmです。こんにちは。

前回に続きとなります。

GitHabはこちらになります。

開発環境は以下の用になっています

  • OS: Mac
  • Editor: VisualStudioCode
  • @angular: 2.0.0
  • angular-cli: 1.0.0-beta.17


今回は、追加する画面を作成しました。以下のような感じになっています。

f:id:shinji-fsi-5761:20161029163105p:plain


ではでは、上記の画面でちょっと手こずったところを記載していきます。

チェック処理

この追加画面では、2つのチェックを行っています。1つはバリデーションチェック、もう1つはnullなどの空のチェックです。

バリデーションは'min'と'max'属性でやれないかなって思ったんですが、なんかうまくできなかったため渋々スクリプトで更新しています。

空チェックは、入力項目がすべて入力、選択された場合に追加ボタンを謳歌できるようにしています。

Templateは以下のようになりました。

<!-- カテゴリ -->
<div class="btn-group input-span">
    <button class="btn btn-default" [ngClass]="{active: category.active}" *ngFor="let category of categoryList" (click)="categoryClickEvent(category)">{{category.name}}</button>
</div>

<!-- 金額 個数 日付 -->
<div class="input-group input-span" *ngFor="let input of inputList">
    <span  class="input-group-addon">{{input.label}}</span>
    <input class="form-control"
       [type]="input.type"
       [placeholder]="input.placeholder"
       [(ngModel)]="input.value"
       (blur)="updateInputValue(input)">
</div>

<!-- 追加ボタン -->
<div style="float: right">
    <button
    class="btn btn-primary"
    (click)="submitButtonClickEvent()"
    [disabled]="checkInputValue()"
    >追加</button>
</div>

バリデーションチェック

バリデーションチェックは、各inputタグの(blur)のタイミングで行っています。

(blur)は、入力エリアからフォーカスアウトすると、設定しているメソッドなどを実行してくれます。今回の場合は、"updateInputValue(input)"が実行されます。

"updateInputValue"は以下のようになっています。

updateInputValue(input):void {
    // 入力値が、設定値より小さい場合
    if(input.value < input.min) input.value = input.min;

    // 入力値が、設定値より大きい場合
    if(input.value > input.max) input.value = input.max;
}

inputオブジェクトごとにあらかじめ"min"と"max"を設けており、それを超えたら丸める、っといった流れです。


追加ボタン押下OKチェック

追加ボタンには、すべての入力項目のチェックを行い、入力漏れがない場合のみ押下できるようにします。

[disabled]に対して"checkInputValue()"を設定しています。
こういったイベントの発火タイミングとかはキチンと決まっているんでしょうかね?(Componentに関する値が更新されたら軒並み動くのかな?)

以下、チェック処理です。

checkInputValue():boolean {
var disabled = ( !this.selectedCategory   ||
	             !this.inputList[0].value ||
		          !this.inputList[1].value ||
		          !this.inputList[2].value )
    return disabled;
}

まぁ、解説するまでもないですね。すべての値がnullや空文字でなければdisabledをtrueにして押下できなくなるようにします。

【Angular2】Chromeでangular-cliのプロジェクトをデバッグする方法

f:id:shinji-fsi-5761:20161008022107j:plain

10cmです。こんにちは。
今日は、angular-cliのプロジェクトをChrome上でデバック実行する方法をご紹介します。

自分は開発環境として"VisualStudioCode"を使っているのですがどうにもデバッグ方法がわからず、行き着いた結果がChrome上でデバッグをする方法でした。

もし、"VisualStudioCode"でデバッグできるやり方を知っていたら教えて欲しいです。。。。


前提条件

自分の開発環境は、ざっと以下の通りです。Macを使用しているため、説明が"command"などになっています。Winの方は"Ctrl"などに置き換えてください。

また、"angular-cli"で生成したプロジェクトを使用しています。

他の環境では自分は実施していませんのでご了承ください。(TypeScriptのビルドで生成してたら同じかな?)

デバッグ方法

1.Chromeデベロッパーツールを開きます。デベロッパーツールは、以下のショートカットキーで開けます。

command + option + i

2.Sourcesタブを選択します。更にその下にあるSourcesタブを選択します。

f:id:shinji-fsi-5761:20161029074835p:plain

3."command + p"を押下します。すると、ファイル名を入力する欄が出てきます。そこに、ステップ実行などを行いたいTypeScriptのファイル名を入力します。

f:id:shinji-fsi-5761:20161029074901p:plain

4.TypeScriptのファイルが開かれます。あとは、JavaScriptと同様にブレークポイントを設定します。

5.リロード!

f:id:shinji-fsi-5761:20161029074929p:plain

ブレークポイントで処理が中断してくれました!メンバの内容もきちんと確認できます。

【Angular2】簡単なWebアプリ制作日記(その1)

10cmです。こんにちは。

今回から、Angular2の練習がてら、Webアプリ制作を行いたいとおもいます。

ざっくりではありますが、以下の点について記載していこうと思います。

  • 作るWebアプリはお小遣い帳をイメージして作成する。
  • 進捗報告のような形で記事を書く。
  • 作っている最中で気になった点などをその都度記載する。
  • ソースコードは、GitHubで公開する。

GitHabはこちらになります。

環境など

開発環境は以下の用になっています

  • PC: Mac
  • Editor: VisualStudioCode
  • @angular: 2.0.0
  • angular-cli: 1.0.0-beta.17

angular-cliについては、以下の記事を参照してみてください。

【Angular2】Macに開発環境を構築してみた - Sierですが何か?【Angular2】Macに開発環境を構築してみた - Sierですが何か?

10cmです。こんにちは。今回は、MacにAngular2の開発環境を構築してみました。PCの環境と導入するものをは以下となります。■PCの環境
macOS ...


進捗など

今回は、現状報告のみを行います。

f:id:shinji-fsi-5761:20161026060024p:plain

werningとdangerに対してそれぞれ入力すると、リストに表示されている購入物の金額*数と比較して大きい場合は色を変えるようにしています。


ToDo

  • レイアウトの修正
  • 各項目の検索機能
  • 購入物をDBに移行
  • 購入物の追加と削除

上記を中心に進捗を記事にしたいと思います。

では。

【Angular2】angualr-cliで生成したプロジェクトに新しいモジュールを追加するときの設定

f:id:shinji-fsi-5761:20161008022107j:plain

10cmです。こんにちは。

angular-cliをインストールできていない方、そもそもangular-cliを知らない方は以下のページを参考にしてみてください。

【Angular2】Macに開発環境を構築してみた - Sierですが何か?【Angular2】Macに開発環境を構築してみた - Sierですが何か?

今回は、例としてbootstrapを使えるようにしてみたいと思います。


##bootstrapのインストール
まずはプロジェクトのルートディレクトリに移動します。
ルートディレクトリに移動したら、次のコマンドを入力します。

 $ npm install bootstrap

node_modulesの下にbootstrapがインストールされます。

angular-cli.jsonの修正

bootstrapのインストールが完了したら、それを使用できるように設定する必要があります。

angular-cliのプロジェクト上で使えるようにするには'angular-cli.json'ファイルにある'apps'を、次のように修正します。

       ・・・
       ・・・
       ・・・
  "apps": [
    {
      "styles": [
        "styles.css",
		"../node_modules/bootstrap/dist/css/bootstrap.min.css",
		"../node_modules/bootstrap/dist/css/bootstrap-theme.min.css"		
      ],
      "scripts": [
		"../node_modules/jquery/dist/jquery.min.js",
		"../node_modules/bootstrap/dist/js/bootstrap.min.js"
	  ],
       ・・・
       ・・・
       ・・・

上記のように、scriptファイルは'scripts'オブジェクトに、cssファイルは'styles'オブジェクトにそれぞれファイルパスを記述します。このとき、'src'を基準にパスを記述する必要があります。