[英]jQplot dragable
我在 jQuery 中使用 jQplot 並試圖使這些點可拖動。 jqplot 通過jqplot.dragable 插件具有此功能
我應該說我是 jQplot 的新手,但我確實讓它正確地繪制了我的信息。
我認為我正確使用了可拖動性選項。 (使用該鏈接並找到“可拖動:”以查看示例),但我的代碼中一定有問題。
這是我的代碼。 任何幫助是極大的贊賞。
<!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>
我能夠找到答案。 “可拖動”不是 jqplot object 基礎中的配置選項。 “可拖動”是“系列”中的配置選項。 此外,該系列必須將“isDragable”設置為 true。
這里是“系列”配置選項的修改代碼。
series: [
{
label: 'Importance',
dragable: {
color: undefined,
constrainTo: 'y'
},
isDragable: true
}
],
參考: jqPlot 選項教程
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.