Hi,
I have jqChartJQueryPlugin_3_7_0_0_Release.
I use sample file AxisSettings.htm and add $('#jqChart').resizable();
The resizable seems working ok.
However, if I call $('#jqChart').jqChart("destroy") and then draw the chart again followed by $('#jqChart').resizable()
The chart is not resizable anymore. Any idea?
Please see the code as below:
<!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>
<title>HTML5 Chart jQuery Plugin - Axis Settings </title>
<link rel="stylesheet" type="text/css" href="../css/jquery.jqChart.css" />
<link rel="stylesheet" type="text/css" href="../css/jquery.jqRangeSlider.css" />
<link rel="stylesheet" type="text/css" href="../themes/smoothness/jquery-ui-1.8.21.css" />
<script src="../js/jquery-1.5.1.min.js" type="text/javascript"></script>
<script src="../js/jquery-ui-1.10.3.custom.min.js" type="text/javascript"></script>
<script src="../js/jquery.jqChart.min.js" type="text/javascript"></script>
<script src="../js/jquery.jqRangeSlider.min.js" type="text/javascript"></script>
<!--[if IE]><script lang="javascript" type="text/javascript" src="../js/excanvas.js"></script><![endif]-->
<script lang="javascript" type="text/javascript">
$(document).ready(function () {
$('#jqChart').jqChart({
title: { text: 'Axis Settings' },
axes: [
{
location: 'left',
minimum: 10,
maximum: 100,
interval: 10
}
],
series: [
{
type: 'column',
data: [['a', 70], ['b', 40], ['c', 85], ['d', 50], ['e', 25], ['f', 40]]
}
]
});
$('#jqChart').resizable();
$('#jqChart').jqChart("destroy");
$('#jqChart').jqChart({
title: { text: 'Axis Settings' },
axes: [
{
location: 'left',
minimum: 10,
maximum: 100,
interval: 10
}
],
series: [
{
type: 'column',
data: [['a', 70], ['b', 40], ['c', 85], ['d', 50], ['e', 25], ['f', 40]]
}
]
});
$('#jqChart').resizable();
});
</script>
</head>
<body>
<div>
<div id="jqChart" style="width: 500px; height: 400px;">
</div>
</div>
</body>
</html>