1

JQplot を使用してグラフを描画します。そして今、棒グラフの個々の棒の上にマウスを置くと、いくつかの値が表示されるはずです.. plz help

私のグラフは次のとおりです...

$(document).ready(function(){
  var line1 = [['Content Of The Training', 2.2], ['Relavance Of Training To The Work Place', 3.5], ['Phase Of The Training', 3.2], 
  ['Session Met The Objectives Stated', 3.4], [' The Session Met My Exceptations', 3], 
  ['Overall Ratining On the Training', 3.6]];

  var plot1 = $.jqplot('graph1', [line1], {
    title: 'Rating On Training',
    series:[{renderer:$.jqplot.BarRenderer}],
    axesDefaults: {
        tickRenderer: $.jqplot.CanvasAxisTickRenderer ,
        tickOptions: {
        fontFamily: 'Calibri',
          angle: -30,
          fontSize: '10pt'
        }
    },

    axes: {
      xaxis: {
        renderer: $.jqplot.CategoryAxisRenderer
      }
    },
        canvasOverlay: {
      show: true,
      objects: [
        {horizontalLine: {
          name: 'pebbles',
          y: 2.5,
          lineWidth: 2,
          color: 'rgb(255, 0, 0)',
          shadow: true,
          lineCap: 'butt',
          xOffset: 0
        }},

      ]
    }
  });
});

プラグインについては、次のリンクから jplot をダウンロードします

http://www.jqplot.com/tests/bar-charts.php

4

1 に答える 1

0

イベントを利用できますjqplotDataMouseOver

ここのドキュメント:http ://www.jqplot.com/deploy/dist/examples/barTest.html

この例#infoでは、クリックしたバーに関する情報をコンテナに入力します。evパラメータからマウスの座標を取得して、それで遊ぶことができるはずです。

$('#graph1').bind('jqplotDataMouseOver', 
     function (ev, seriesIndex, pointIndex, data) {
                $('#info').html('series: ' + seriesIndex + ', point: ' + pointIndex + ', data: ' + data);
     }
);

また、これを見ることができます: http ://www.jqplot.com/docs/files/plugins/jqplot-highlighter-js.html

ツールチップを有効にする方法を示しています。それがすべての種類のグラフで機能するかどうかはわかりません。

于 2012-12-05T15:50:22.413 に答える