5
मैं jQuery के भीतर jQplot का उपयोग कर रहा हूं और अंक खींचने योग्य बनाने की कोशिश कर रहा हूं। jqplot में यह कार्यक्षमता jqplot.dragable pluginjQplot dragable
मुझे यह कहना चाहिए कि मैं jQplot के लिए नया हूं, लेकिन मेरे पास यह मेरी जानकारी को सही तरीके से साजिश दे रहा है।
मुझे लगता है कि मैं dragability option का उपयोग कर रहा हूं। (उस लिंक का उपयोग करें और उदाहरण देखने के लिए 'खींचने योग्य:' ढूंढें), लेकिन मेरे कोड में कुछ गलत होना चाहिए।
यहां मेरा कोड है। कोई भी मदद बहुत ही सराहनीय होगी।
<!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>