Closed GoogleCodeExporter closed 8 years ago
if the dataset is big enough, such as the provided example in here: <a href="http://people.iola.dk/olau/flot/examples/multiple-axes.html">exmaple</a>, the year will be displayed on xaxis, but if there is only 1 or 2 data in dataset array, the full date, like Apr 15 2011, is not able to see on x axis, below is my little example that demonstrate this issue: <table border="0" style="width: 800px; height: 500px"> <tr> <td></td> <td></td> <td></td> </tr> <tr> <td valign="top" align="right"><div style="color: Blue">FEV1 <br />(L) <br /></div> <div style="color: Green">PVC <br />(L)</div> </td> <td><div id="placeholder" style="width:750px; height:450px"></div></td> <td valign="top" align="left"><div style="color: Red">PEF <br />(L/s)</div></td> </tr> <tr> <td></td> <td></td> <td></td> </tr> </table> <script type="text/javascript"> $(function () { var dataSet1 = [[1249102800000, 34.50553], [1249189200000, 27.014463], [1249275600000, 26.7805], [1249362000000, 33.08871], [1249448400000, 51.987762], [1249534800000, 56.868233]]; var dataSet2 = [[1249102800000, 3.405], [1249189200000, 2.701], [1249275600000, 2.678], [1249362000000, 3.308], [1249448400000, 5.187], [1249534800000, 5.668]]; function euroFormatter(v, axis) { return v.toFixed(axis.tickDecimals) + "€"; } function doPlot(position) { $.plot($("#placeholder"), [{ data: dataSet1, label: "Data Set 1" }, { data: dataSet2, label: "Data Set 2", yaxis: 2}], { series: { lines: { show: true }, points: { show: true } }, grid: { hoverable: true, clickable: true }, xaxes: [{ mode: 'time', minTickSize: [1, 'day'] }], yaxes: [{ min: 0 }, { alignTicksWithAxis: position == "right" ? 1 : null, position: position, tickFormatter: euroFormatter }], legend: { position: 'sw' } }); function showTooltip(x, y, contents) { $('<div id="tooltip">' + contents + '</div>').css({ position: 'absolute', display: 'none', top: y + 5, left: x + 5, border: '1px solid #fdd', padding: '2px', 'background-color': '#fee', opacity: 0.80 }).appendTo("body").fadeIn(200); } var previousPoint = null; $("#placeholder").bind("plothover", function (event, pos, item) { $("#x").text(pos.x.toFixed(2)); $("#y").text(pos.y.toFixed(2)); if (item) { if (previousPoint != item.dataIndex) { previousPoint = item.dataIndex; $("#tooltip").remove(); var x = item.datapoint[0].toFixed(2), y = item.datapoint[1].toFixed(2); showTooltip(item.pageX, item.pageY, y.toString() + " on " + new Date(x / 1000 * 1000).toLocaleString()); } } else { $("#tooltip").remove(); previousPoint = null; } }); $("#placeholder").bind("plotclick", function (event, pos, item) { if (item) { window.location.href = 'http://localhost:12700/About.aspx'; } }); } doPlot("right"); }); </script>
Original issue reported on code.google.com by andie...@yahoo.com.au on 22 Jul 2011 at 1:07
andie...@yahoo.com.au
Original comment by dnsch...@gmail.com on 4 Jun 2012 at 9:18
dnsch...@gmail.com
Original issue reported on code.google.com by
andie...@yahoo.com.au
on 22 Jul 2011 at 1:07