0

2つの異なる軸を持つCSVデータからチャートを表示したいと思います。

私はこれを行うことに成功しましたが、いくつかの制限があります。

これが私のCSVファイルのサンプルですが、列の数と列のラベルはさまざまです。

"date","Tch","HyR","CO2"
2012/12/23-10:41,22.2,43,2379.52
2012/12/23-10:42,22.2,44,2319.36
2012/12/23-10:43,22.2,44,2319.36

このコードを使用して表示できます。

<div id="div_g" style="width:900px; height:400px; border: 1px solid black"></div> 
<script type="text/javascript" src="http://www.dygraphs.com/dygraph-combined.js"></script>

<script> 

        var g = new Dygraph(
        document.getElementById("div_g"),
        "enregistrement-subset0.csv",
        {
            labels:["date","Tch","HyR","CO2"], //the line I'd like to remove
            colors:["red", "blue", "green"],
            "CO2": { axis: {
                yAxisLabelFormatter: function (v) { return v.toPrecision(2); },
                yValueFormatter: function (v) { return v.toPrecision(2); }
            }},
            axes: {
                y: {
                    valueFormatter: function(y) {
                        return y.toPrecision(3);
                    },
                    axisLabelFormatter: function(y) {
                        return y;
                    }
                }
            },
        });
</script>

「labels：」の行を削除しようとしましたが、これを行うと、2番目の軸が消えます。

このためのjsFiddleはここにありますhttp://jsfiddle.net/lauhub/jY2m6/

また、この線を維持すると、チャートの表示中に警告が生成されます。

また、列の数と名前はさまざまである可​​能性があるため、CSVファイルからラベルを動的にロードしたいと思います。

ダイグラフを使用してプログラムでこれを行うことは可能ですか？どのように ？

ありがとう

4

1 に答える 1

1

Dygraphs google グループの Konigsberg が投稿した回答を次に示します。簡単な回答は、CSV が列 0 に [date] というラベルが付いているとは考えておらず、["date"] (引用符付き) とラベル付けされていると考えていることです。

CSV を囲む引用符を削除すれば問題ありません。

date,Tch,HyR,CO2
2012/12/23-10:41,22.2,43,2379.52

この動作については、 http://jsfiddle.net/KUdsY/2を参照してください。

また、 http://blog.dygraphs.com/2012/12/the-new-and-better-way-to-specify.htmlで指定されている手順を使用して、軸とシリーズを指定する新しい方法を使用することをお勧めします。あなたのソリューションはhttp://jsfiddle.net/KUdsY/4/のようになります。

そして、以下のコードを投稿します (最後のリンクからコピー):

var csv = 'date,Tch,HyR,CO2\n' +
    '2012/12/23-10:41,22.2,43,2379.52\n' +
    '2012/12/23-10:42,22.2,44,2319.36\n' +
    '2012/12/23-10:43,22.2,44,2319.36\n';
var g = new Dygraph(
document.getElementById("graph"),
csv, {
  //  labels: ["date", "Tch", "HyR", "CO2"], //the line I'd like to remove
    colors: ["red", "blue", "green"],
    series : {
        "CO2": {
            axis : 'y2'
        }
    },
    axes: {
        y: {
            valueFormatter: function (y) {
                return y.toPrecision(3);
            },
            axisLabelFormatter: function (y) {
                return y;
            }
        },
        y2: {
            yAxisLabelFormatter: function (v) {
                return v.toPrecision(2);
            },
            yValueFormatter: function (v) {
                return v.toPrecision(2);
            }
        }
    }
});
于 2013-02-05T15:34:01.007 に答える