単純移動平均を例にアイテムインジケーターを作る


概要

アイテムインジケーターの作成方法を、移動平均を例に説明します。

アイテムインジケーターとは、単独では表示できず、コンテナインジケーターに組み込んで表示するインジケーターです。
コンテナインジケーターとは、「高さ」を持ち、単独で表示できるインジケーターです。

操作

インジケーター「新規登録」または「編集」画面を開き、解説のソースを入力、登録してください。

最小限のアイテムインジケーター

ここでは25期間単純移動平均を作成します。

indicatorNameプロパティ、indicatorTypeプロパティ、 initメソッド、calcメソッドを持つオブジェクトリテラルを定義します。

indicatorNameプロパティ、indicatorTypeプロパティ、initメソッド、は登録時に定義することが必須です。
calcメソッドはinitメソッドの中で定義することも可能ですが、登録時に定義することを推奨します。
参照:calc
{
    indicatorName:"tutor.SMA1", //1
    indicatorType:INDICATOR_TYPE.ITEM,//2
    init:function(){//3
        this.smaBuffer = this.addLineBuffer({ //4
            strokeStyle:'green',
            lineWidth:2,
            lineDash:[3,3]
        });    
    },
    calc:function(index,times,opens,highs,lows,closes,spreads){//5
        closes.sma(this.smaBuffer,25,index);//6
    }
}
1
indicatorNameプロパティはインジケータの名前を表します。 参照:indicatorName
2
indicatorTypeは作成するインジケーターがアイテムインジケーターかコンテナインジケーターのどちらかを設定します。 参照:indicatorType
3
initメソッドはインジケーターをチャートに追加したタイミングでJSTraderから呼ばれます。この中で、インジケーターバッファーの追加などの初期化処理を行います。 参照:init
4
addLineBufferメソッドは線を表示するインジケーターバッファーを戻します。calcメソッドで参照するため、任意のプロパティ(ここではsmaBuffer)に戻り値を格納しています。 参照:addLineBuffer
5
calcメソッドは インジケーターの値を計算するメソッドです。JSTraderから繰り返し呼ばれます。 参照:calc
6
計算結果をinitメソッドで生成したインジケーターバッファーに格納しています。 計算はJSTraderで定義されているIndicatorBufferクラスのsmaインスタンスメソッドを使用しています。 参照:sma
smaメソッドを使用せずにcalcメソッドを実装すると下記のようになります。
calc:function(index,times,opens,highs,lows,closes,spreads){
        var sum = 0,
            smaPeriod=25; 
        for (var i = index - smaPeriod + 1; i<= index; i++) {
            sum += closes.get(i);
        }
        var sma = sum / smaPeriod;
        this.smaBuffer.set(index,sma); 
}

登録したSMAをのチャートに挿入し、25日単純移動平均が表示されることを確認してください。 表示されない場合、ソースや手順を再度確認してください。 表示された場合でも幾つか問題点があります。以降でこれらの問題点を修正していきます。

  • チャート追加時にSMA期間や色の変更ができない
  • データ表示エリアにSMAの値が表示されない

パラメータ化

paramsプロパティを設定すると、チャート追加時に設定したい値(SMA期間や線の色等)を設定することができます。 ソースを下記のように修正してください。

{
    indicatorName:"tutor.SMA2", 
    indicatorType:INDICATOR_TYPE.ITEM,
    init:function(){
        this.smaBuffer = this.addLineBuffer({
            strokeStyle:this.params.lineColor, //1
            lineWidth:this.params.lineWidth, //2
            lineDash:this.params.lineDash //3
               });    
    },
    calc:function(index,times,opens,highs,lows,closes,spreads){
        var smaBuffer=this.smaBuffer;
        var smaPeriod=this.params.smaPeriod;
        closes.sma(smaBuffer,smaPeriod,index);//4
        //this.smaBuffer.values[index] = IndicatorUtil.sma(closes,this.params.smaPeriod,index);//4  
    },
    params: [//5
        {smaPeriod:25},
        {lineColor:"red"},
        {lineWidth:2},
        {lineDash:[3,3]}
    ]                   
}
1
線の色をパラメーターの値にしています。
2
線の太さをパラメーターの値にしています。
3
点線の描画方法をパラメーターの値にしています。
4
SMA期間をパラメーターの値にしています。
5
パラメータを設定しています。 参照:params
paramsプロパティは定義時に指定してください。

リプレイ時レートの表示

setBufferInfoメソッドを使用すると、 レート表示エリアに、作成したインジケーターのリプレイ時の値を表示することができます。ソースを次のように修正してください。

コントロールキーを押下している時はマウス上にあるレートの値を表示します。
{
    indicatorName:"tutor.SMA3", 
    indicatorType:INDICATOR_TYPE.ITEM,
    init:function(){
        this.smaBuffer = this.addLineBuffer({ 
            strokeStyle:this.params.lineColor, 
            lineWidth:this.params.lineWidth,
            lineDash:this.params.lineDash 
        });    
        this.setBufferInfo(this.smaBuffer,'sma');//1
        this.setIndicatorShortName('SMA');//2
    },
    calc:function(index,times,opens,highs,lows,closes,spreads){
        var smaBuffer=this.smaBuffer;
        var smaPeriod=this.params.smaPeriod;
        closes.sma(smaBuffer,smaPeriod,index);
    },
    params: [
        {smaPeriod:25},
        {lineColor:"red"},
        {lineWidth:2},
        {lineDash:[3,3]}
    ]                   
}
1
インジケーターのレートをレート表示エリアに表示するには、インジケーターバッファーごとにsetBufferInfoメソッドでインジケーターバッファーを登録します。 参照:setBufferInfo
2
レート表示エリアに表示されるインジケーター名を変更する場合はindicatorShortNameプロパティを設定します。 参照:indicatorShortName