1

Protovisを使用して、次のようなローソク足チャートを生成します:http: //vis.stanford.edu/protovis/ex/candlestick-full.html。特定のローソク足のチャートに注釈を付ける必要があります。たとえば、12:00のローソク足の位置に三角形を描くことができます。その特定のローソク足の位置(左と下)を見つけるにはどうすればよいですか?

4

1 に答える 1

1

これに対する標準的なprotovisのアプローチは、注釈マークを目的のデータポイントの子マークにし、そのvisibleプロパティを目的のデータポイントに対してのみ表示するように設定することだと思います。ローソク足の例では、このように見えるかもしれません:

// the thin line of the candlestick
var candlestick = vis.add(pv.Rule)
    .data(vix)
    .left(function(d) x(d.date))
    .bottom(function(d) y(Math.min(d.high, d.low)))
    .height(function(d) Math.abs(y(d.high) - y(d.low)))
    .strokeStyle(function(d) d.open < d.close ? "#ae1325" : "#06982d");

// the thick line of the candlestick
candlestick.add(pv.Rule)
    .bottom(function(d) y(Math.min(d.open, d.close)))
    .height(function(d) Math.abs(y(d.open) - y(d.close)))
    .lineWidth(10);

// the annotation mark
candlestick.add(pv.Dot)
    .size(40)
    .shape("triangle")
    .left(function() {
        // candlestick here refers to the parent instance
        return candlestick.left()
    })
    .top(function() {
        // candlestick here refers to the parent instance
        // this is 10px from the top of the candlestick
        return h - candlestick.bottom() - candlestick.height() - 10;
    })
    .visible(function(d) {
        // only show the mark for the data we care about - here, June 12
        // (month is 0-based)
        return d.date.getUTCMonth() == 5 && d.date.getUTCDate() == 12;
    });

他のオプションは、protovisコンテキストの外でデータを取得する必要がある場合(たとえばdiv、HTMLテキストでそこに表示したい場合)、定義されているデータを取得することです(たとえば、定義のbottomおよびheightプロパティ関数でcandlestick) 。グローバル変数に格納します。しかし、これはかなり醜いです。

于 2011-04-04T16:47:39.200 に答える