JqPlot增加Click事件

项目需要在jqplot上增加link，这个问题困扰了我好久（2天），在一个偶然的情况下发现了以下代码可以使Chart上的Plot鼠标点击时触发Click事件。在事件里触发跳转时间岂不更简单？而且还可以组合一些参数。 以下标红的是关键代码，触发的方法也在下面，可以自由编辑一些方法，抱歉有点乱，大家将就着看吧嘿嘿。希望对大家有帮助

<script src="@Url.Content("~/Scripts/JQplot/excanvas.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/JQplot/jquery.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/JQplot/jquery.jqplot.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/JQplot/plugins/jqplot.canvasTextRenderer.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/JQplot/plugins/jqplot.canvasAxisTickRenderer.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/JQplot/plugins/jqplot.dateAxisRenderer.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/JQplot/plugins/jqplot.highlighter.js")" type="text/javascript"></script>
@*<script src="@Url.Content("~/Scripts/JQplot/plugins/jqplot.dragable.js")" type="text/javascript"></script>*@
<script src="@Url.Content("~/Scripts/JQplot/plugins/jqplot.canvasOverlay.js")" type="text/javascript"></script>
<link  href="@Url.Content("~/Scripts/JQplot/jquery.jqplot.css")" rel="stylesheet" type="text/css" />
<!-- END: load jqplot -->
<style type="text/css" media="screen">
    .jqplot-axis-tick
    {
    }
</style>
<script type="text/javascript" language="javascript">

    $(document).ready(function () {
        $.jqplot.config.enablePlugins = true;
        //        line1 = [['2011-08-01', 4],
        //	['2011-08-08', 6.5],
        //	['2011-08-15', 5.7],
        //	['2011-08-22', 9],
        //	['2011-08-29', 8.2],
        //	['2011-09-05', 7.6],
        //	['2011-09-12', 11.4],
        //	['2011-09-19', 16.2],
        //	['2011-09-26', 21.8],
        //	['2011-09-26', 4],
        //	['2011-10-6', 19.3],
        //	['2011-10-13', 29.7],
        //	['2011-10-20', 50],
        //	['2011-10-27', 38.7]];
        //        line2 = [['2011-08-01', 4],
        //	['2011-08-08', null],
        //	['2011-08-15', null],
        //	['2011-08-22', null],
        //	['2011-08-29', null],
        //	['2011-09-05', null],
        //	['2011-09-12', null],
        //	['2011-09-19', null],
        //	['2011-09-26', null],
        //	['2011-09-26', 4],
        //	['2011-10-6', null],
        //	['2011-10-13', null],
        //	['2011-10-20', 50],
        //	['2011-10-27', null]];
        line1 = [];
        line2 = [];
        plot1 = $.jqplot('chart', [line1, line2], {
            title: 'Report',
            seriesColors: ["#00BFFF", "#ff0000"],
            stackSeries: true,
            captureRightClick: true,
            series: [
         {
             lineWidth: 2,
             markerOptions: { style: "filledSquare", size: 9 },
             breakOnNull: true
         },
          {
              showLine: false,
              markerOptions: { style: "filledSquare", size: 10 },
              breakOnNull: true
          }
        ],

            axes: {
                xaxis: {
                    renderer: $.jqplot.DateAxisRenderer,
                    min: '2011-07-15',
                    tickInterval: '1 week',
                    rendererOptions: {
                        tickRenderer: $.jqplot.CanvasAxisTickRenderer
                    },
                    tickOptions: { formatString: '%b %#d, %Y', fontSize: '10pt', fontFamily: 'Tahoma', angle: -40, fontWeight: 'normal', fontStretch: 1 }
                },
                yaxis: {
                    rendererOptions: {
                        tickRenderer: $.jqplot.CanvasAxisTickRenderer
                    },
                    tickOptions: { formatString: '%.2f', fontSize: '10pt', fontFamily: 'Tahoma', angle: 30, fontWeight: 'normal', fontStretch: 1 }
                }
            },
            canvasOverlay: {
                show: true,
                objects: [
                { horizontalLine: {
                    name: 'barney',
                    y: 40,
                    lineWidth: 2,
                    color: 'rgb(100, 55, 124)',
                    shadow: true
                }
                },
 				{ horizontalLine: {
 				    name: 'barney',
 				    y: 5,
 				    lineWidth: 2,
 				    color: 'rgb(100, 55, 124)',
 				    shadow: true
 				}
 				}
            ]
            },
            highlighter: {
                sizeAdjust: 10,
                tooltipLocation: 'n',
                tooltipAxes: 'y',
                tooltipFormatString: '<b><i><span style="color:red;size:13px">Metric:</span></i></b> %.2f',
                useAxesFormatters: false
            }

        });
        $('#chart').bind('jqplotDataClick',
    function (ev, seriesIndex, pointIndex, data) {
        $('#info3').html('series: ' + seriesIndex + ', point: ' + pointIndex + ', data: ' + data);
    });
    });
</script>
<span id="info3">Nothing yet.</span>
<div id="chart" style="margin-top: 20px; margin-left: 60px; width: 800px; height: 400px;">
</div>