3

チャートをカスタマイズし、顧客の承認を得るためにデモを提供しようとしています。

私たちが現在直面しているいくつかの最終的な問題は、

  1. 問題: 縦棒グラフのハイチャートでページネーションは可能ですか? 50 列または 100 列があるとします。

    チャートが混雑するのを避けるにはどうすればよいでしょうか。

    たとえば、このjsフィドルを見てください

    http://jsfiddle.net/justin69/4xSNU/1/

  2. 問題: 画像またはロゴをグラフに埋め込んで、jpg/のいずれかを使用してエクスポートしようとするとjpeg、エラーが発生します。

    jsfidlleでは動作しますが、

    しかし、ローカルホストでは次のエラー メッセージが表示されます。

    About to transcode 1 SVG file(s) Converting 551bc090a93c120f987375135e7744db.svg to temp/551bc090a93c120f987375135e7744db.jpg ... ... error ( SVGConverter.error.while.rasterizing.file)
    Error while converting SVG. SVG code for debugging:

4

2 に答える 2

8

私があなたを助けることができるかどうか見てみましょう...

「混雑したチャート」

チャートが「混雑」するのを避けるための 3 つの方法を想像できます。

方法 1: ユーザーに何を表示するかを選択させる。

シリーズの一部またはすべてへの追加visible: falseを非表示にします。これを使用すると、ユーザーは表示したいデータを選択できます。例えば:

series: [
            {
                name: ...,
                data: ...,
                visible: false
            },
            ...
        ]

この例を選択すると、すべてを表示/非表示にするボタンを追加することも考えられます。これは、次を使用して実現できます。

すべて非表示:

for(i=0; i < chart.series.length-1; i++)
    chart.series[i].hide();

すべてを表示:

for(i=0; i < chart.series.length-1; i++)
    chart.series[i].show();

方法 2: 問題から抜け出す方法を拡大する

の方法として、ユーザーがズームしてデータを詳細に表示できるようにチャートで使用することもできます。ユーザーは、ズームを使用zoomType: 'x'してチャートの左右にスクロールするか、ズームをリセットして別のポイントを選択して表示することができます。


方法 3: オーバーフロー

の方法として、巨大なグラフを作成し、オーバーフローを使用してグラフ div をスクロール可能にするか、オーバーフローを非表示にしてjQueryを管理することもできscrollXます。scrollY


svg の例のフィドルへのコードまたはリンクを提供していただけますか?

ありがとうございました。

于 2012-04-18T16:00:13.713 に答える
5

1.混雑したチャート

を。ラベルを回転させてみましたか?これにより、以前のラベルの過密状態が大幅に減少します。

ラベル mod の Fiddle は次のとおりです: http://jsfiddle.net/kayen/YSwk4/

b. 多くの値があり、x 軸のスペースに制限がある場合は、縦棒グラフを横棒グラフに変換できます。

棒グラフ mod を使用した Fiddle は次のとおりです: http://jsfiddle.net/kayen/QqPha/

最初のオプションを使用することをお勧めします。同じスペースにより多くの値を収めることができ、よりきれいなグラフを作成できるからです。

于 2012-04-24T10:32:27.007 に答える