如何使flot响应？

我怎样才能使如果窗口宽度变化曲线图的宽度变化？

代码：

$(function() { 
var d1 = []; 
for (var i = 0; i < 14; i += 0.5) 
    d1.push([i, Math.sin(i)]); 

var d2 = [[0, 3], [4, 8], [8, 5], [9, 13]]; 

// a null signifies separate line segments 
var d3 = [[0, 12], [7, 12], null, [7, 2.5], [12, 2.5]]; 

$.plot($("#placeholder"), [ d1, d2, d3 ]); 
});

来源

2013-06-21 SB2055

您是否需要Flot在打开窗口时对窗口大小作出响应或者是否需要用窗口调整大小？ – Spencer

尝试是这样的：

海军报会自动绘制到它在容器所以，如果你的DIV响应海军报将响应。

http://jsfiddle.net/9x7aJ/2029/

那么所有你需要做的是重新绘制海军报，如果你的调整窗口大小：

你可以看，看看是否窗口大小调整：

window.onresize = function(event) { 
    ... 
}

（参见：JavaScript window resize event ）

来源

2013-06-21 19:36:48 Spencer

甜美！谢谢Spencer – SB2055

编辑小提琴提供正确的链接。 – Spencer

kewl男人非常感谢:) – Gogol

另外还有一个官方的flot调整大小插件

http://people.iola.dk/olau/flot/examples/resize.html

来源

2014-02-24 11:44:44 aqm

这看起来更简单了，原生解决方案。我尝试手动完成，与接受的答案类似，但我遇到了问题，可能是因为我的飞标图表处于角度指令。使用调整大小插件可以立即解决所有问题。 – Mordred

肯定也会推荐升级到最新的flot（写作时为0.8.3），它有一些出色的IE8错误修复，我不得不在之前的猴子补丁官方flot与try-catch – aqm

只需在您的网页从https://github.com/flot/flot jquery.flot.resize.min.js脚本。它会变得敏感。

来源

2016-12-06 04:48:54

我有同样的问题和解决办法是：

<script language="javascript" type="text/javascript" src="http://people.iola.dk/olau/flot/jquery.js"></script> 
<script language="javascript" type="text/javascript" src="http://people.iola.dk/olau/flot/jquery.flot.js"></script> 
<script language="javascript" type="text/javascript" src="http://people.iola.dk/olau/flot/jquery.flot.resize.js"></script> 
<script src="./jquery.flot.axislabels.js"></script>

来源

2017-05-03 04:23:52 RobertoFRey

只需使用一些CSS。任何现代浏览器都可以使用（内联，样式表）：

<div id="chart" style="width: 100%!important"></div>

来源

2017-10-14 18:45:06

如何使flot响应？

回答

相关问题