0

コーヒースクリプトクラスに次のd3（キュービズム）コードがあります：

d3.select("view").selectAll(".horizon")
    .data( @metrics )
  .enter()
    .insert("div", ".bottom")
    .attr("class", "horizon")
  .call( @ctx.horizon() )

そしてすべてがうまく機能します。ただし、「ビュー」をインスタンス化するために、次のデータ構造をクラスに渡したいと思います。

metricGroup =
  cpu:
    extent: [0,100]
  temperature:
    extent: [0,80]
  power:
    scale: d3.scale.ordinal( [0,1,2] ).range( [-2,1,-1] )
    extent: [-2,1]

ご覧のとおり、特定のscaleandextentを各メトリックに関連付けたいと考えています。各メトリックは、上記のコードhorizonで連鎖する必要がある各オブジェクトへの特定の呼び出しを定義します。d3

.call( 
  @ctx.horizon()
    .scale(@metricGroup.power.scale)
    .extent(@metricGroup.power.extent) 
)

したがって、「パワー」メトリックの場合、次のようになります

.call(
  @ctx.horizon()
    .scale(d3.scale.ordinal( [0,1,2] ).range( [-2,1,-1] ))
    .extent( [-2,1] )
)

select/enter/call メソッド チェーンの優雅さを保ちながら、必要なカスタマイズを提供するにはどうすればよいでしょうか?

4

1 に答える 1

0

私はキュービズムに少し慣れているだけなので、ここでは少し制約があります。しかし、ここの「言語の配列」の例 (1 段落上にスクロール)のように、地平線のプロパティに関数を定義する必要があるようです。@metricsあなたのコードに何が入っているのかわかりませんが、キー名の配列を使用した場合["cpu", "temperature", ...]、たとえば、関数でルックアップを実行できます (申し訳ありませんが、js に切り替えます):

.call(
    ctx.horizon()
       .scale(function(d) { return metricGroup[d].scale || defaultScale; })
       // etc
)
于 2013-05-12T05:01:10.597 に答える