jQplot dragable

我在jQuery中使用jQplot，並試圖使點可拖動。 jqplot通過jqplot.dragable plugin jQplot dragable

有這個功能我應該說我是jQplot的新手，但我確實有它繪製我的信息正確。

我認爲我正確使用了dragability option。（使用該鏈接並找到'dragable：'來查看示例），但是在我的代碼中必須出錯。

這是我的代碼。任何幫助是極大的讚賞。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Untitled Document</title> 
<script language="javascript" type="text/javascript" src="javascript/jquery-1.5.2.min.js"></script> 
<script language="javascript" type="text/javascript" src="javascript/jqplot/jquery.jqplot.js"></script> 
<script language="javascript" type="text/javascript" src="javascript/jqplot/plugins/jqplot.highlighter.js"></script> 
<script language="javascript" type="text/javascript" src="javascript/jqplot/plugins/jqplot.dateAxisRenderer.js"></script> 
<script language="javascript" type="text/javascript" src="javascript/jqplot/plugins/jqplot.barRenderer.js"></script> 
<script language="javascript" type="text/javascript" src="javascript/jqplot/plugins/jqplot.dragable.js"></script> 

<style type="text/css"> 
.jqplot-axis { 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 90%; 
} 
.jqplot-highlighter-tooltip { 
    background-color: #CCC; 
    padding: 5px; 
    border-radius: 5px; 
} 
</style> 

<script language="javascript" type="text/javascript"> 
$(function() { 
    <?php 
     $series = ""; 

     $start = strtotime("Jan 1 2001 00:00:00"); 
     $end = strtotime("Dec 31 2001 00:00:00"); 
     for ($i = $start; $i <= $end; $i += 432000) { 
      if ($i > $start) { 
       $series .= ", "; 
      } 
      $series .= "['" . date("m/d/Y", $i) . " 00:00:00', 2]"; 
     } 
    ?> 

    var series = [<?php echo $series; ?>]; 

    var plot1 = $.jqplot('Chart1', [series], { 
     seriesDefaults: { 

     }, 
     series: [ 
      { label: 'Importance' } 
     ], 
     axes: { 
      xaxis: { 
       renderer: $.jqplot.DateAxisRenderer, 
       tickOptions: { formatString: '%b %e' }, 
       min: "12-27-2000 00:00:00", 
       max: "12-31-2001 00:00:00", 
       tickInterval: "15 days" 
      }, 
      yaxis: { 
       min: -10, 
       max: 10 
      } 
     }, 
     highlighter: { 
      show: true, 
      showMarker: false, 
      tooltipAxes: 'xy', 
      formatString: '%s<br />%s' 
     }, 
     dragable: { 
      color: '#FF0000', 
      constrainTo: 'none' 
     } 
    }); 

    var xaxis = $('.jqplot-axis.jqplot-xaxis div'); 
    xaxis.first().css('display', 'none'); 
    xaxis.last().css('display', 'none'); 
}); 
</script> 
</head> 

<body> 
<div id='Chart1'></div> 
</body> 
</html>

來源

2011-05-31 James

我能找到答案。 'dragable'不是jqplot對象基礎中的配置選項。 'dragable'是'系列'中的配置選項。此外，該系列必須將「isDragable」設置爲true。

這裏是「系列」配置選項的修改代碼。

series: [ 
    { 
     label: 'Importance', 
     dragable: { 
      color: undefined, 
      constrainTo: 'y' 
     }, 
     isDragable: true 
    } 
],

來源

2011-06-01 15:29:33 James

回答

相關問題