2

だから私はjqplotでこのチャートを持っています

jqplot

注意深く見ると、4 と 5 の下に実際に表示されるデータがあることがわかりますが、バーが短すぎて数値ラベルを表示できません。ホバー テキストがありますが、マウスが登録するにはバーも小さすぎます。3 の下では、実際には赤と緑の間に別のバーがありますが、これも小さすぎて表示できません。

この場合、私は何ができますか？助言がありますか？

いくつかのアイデアがありますが、実装方法がわかりません:

  • バーが最も高いバーよりも特定の割合小さい場合にのみ、各バーの横/上に数値ラベルを表示します。

  • マウスがバー自体だけでなく、特定の列にあるときにホバー テキストを表示します。このホバー テキストには、1 色だけでなく 3 色すべてのデータが表示されます。

ありがとう！

編集：

カスタム ハイライター クラスを作成して、3 色すべてを表示するホバー テキストを取得しました。

highlighter: {
show: true,
...
tooltipContentEditor:tooltipContentEditor,
}
...
function tooltipContentEditor(str, seriesIndex, pointIndex, plot) {
    var data1 = plot.data[2][pointIndex];
    var data2 = plot.data[1][pointIndex];
    var data3 = plot.data[0][pointIndex];
    var value = data1 + "-" + data2 + "-" + data3;
    return value;
}

もちろん、これは各バーに常に 3 色がある場合にのみ機能します。私にとっては機能するので、現在使用しています。ここで、バーが小さすぎる場合に蛍光ペンを簡単に表示する方法を理解する必要があります。

EDIT2：

ライターを表示する方法を見つけました。

  1. ダミー シリーズを作成し、これを特定の列と最も高い列の差に設定します

  2. 色を RGB 透明に変更し、シャドウを削除し、ハイライトなどを削除します。

  3. 見えないバーまたはその下のバーにカーソルを合わせると、完全な統計が表示されます。

4

1 に答える 1

0

目に見えないデータ系列はハックのように聞こえますが、言うまでもなく、ユーザーがこのスペースにマウスを置くと、一貫性のないフィードバックが得られます。これは可変エンティティになります。

これは、凡例を使用して、関連するシリーズのホバーをトリガーする凡例のアイテムにハンドラーを配置するのに最適な時期のように思えます。

var $l = $('.jqplot-table-legend');
$l.on('mouseenter', function(e){
var $this = $(this),
    i = $this.index(),
    l = $l.length;
    // now call your custom highlight function or trigger the hover using relevant indices
})
.on('mouseleave', function(e){ 
    // hide visible tooltips
});

ps ホバーは非推奨です。もう使用しないでください

于 2013-02-24T03:19:32.620 に答える