3

Graphiteからメトリックをロードしていますが、地平線チャートにレンダリングされると、グラフスペースの幅全体ではなく、グラフの左側に押しつぶされます。これが私が何を意味するかを示すスクリーンショットです：

ここに画像の説明を入力してください

そのデータは、私が要求した3時間のウィンドウからのものです。最上位の地平線チャートのグラファイト出力の一部を次に示します。

,1347632400,1347643200,60|892.0,526.0,371.0,1475.0,1234.0 [...] 1250.0,1604.0,1146.0,965.0

画像から見分けるのは難しいですが、それらの値は描かれているものと一致しています。それは彼らがすべてのスペースを取っているわけではないということだけです。

チャートは、CSSプロパティ<div id="#graphs">のみを持つposition: relative単純なものに描画されています。width: 1080px;これがCubismJavaScriptです。

var context = cubism.context()
    .step(1e4)
    .size(1080);  // 3 hours

var graphite = context.graphite("http://graphite.example.com");
var horizon = context.horizon().metric(graphite.metric).height(100);

var metrics = [
    "prod.counts.total_stats",
    "stage.counts.total_stats",
    "dev.counts.total_stats"
]

d3.select("#graphs").append("div")
    .attr("class", "axis")
    .call(context.axis().ticks(12).orient("top"));

d3.select("#graphs").append("div")
    .attr("class", "rule")
    .call(context.rule());

d3.select("#graphs").selectAll(".horizon")
    .data(metrics)
  .enter().append("div")
    .attr("class", "horizon")
    .call(horizon);

CSSの残りの部分は、株式のデモからほとんどコピーペーストされています。簡潔にするために、これは含めませんが、必要に応じて含めることができます。

4

1 に答える 1

4

問題20を参照してください：

現在、Cubismが10秒のメトリックを要求すると、Graphiteは最低解像度のデータを返します。ただし、使用可能な最低の解像度は、実際にはより高い解像度（1分のデータなど）である可能性があります。キュービズムは、それ以上のことを知らずに、データをアップサンプリングするのではなく、このデータを不正確に表示します。

これを回避するには、高解像度のデータをGraphiteに保存するか、summary（metric、 "10s"）と言います。

于 2012-09-14T19:27:42.963 に答える