标签: flot
Flot Stacked Bar Chart并在鼠标悬停时显示条形图值
我正在尝试了解Flot的工具提示功能,但并没有真正了解它!
我正在尝试实现一个工具提示,显示堆积条形图的每个部分的标签和值
有人能够指出我的一个例子或提供这样做的代码吗？
推荐指数
解决办法
查看次数
如何将jQuery FLOT Graph保存为.png或其他图像格式？
我正在为Jquery使用一个名为FLOT的插件http://code.google.com/p/flot/
渲染图形后,我希望客户端能够将图形保存到文件中以供日后使用.在不要求客户下载某些工具或图像捕获设备的情况下,如何做到这一点的任何想法？
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="en">
<head>
<!--[if IE]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Graph</title>
<link href="layout.css" rel="stylesheet" type="text/css"></link>
<!--[if IE]><script language="javascript" type="text/javascript" src="lib/flot/excanvas.min.js"></script><![endif]-->
<script language="javascript" type="text/javascript" src="lib/canvas2image/base64.js"></script>
<script language="javascript" type="text/javascript" src="lib/canvas2image/canvas2image.js"></script>
<script language="javascript" type="text/javascript" src="lib/flot/jquery.js"></script>
<script language="javascript" type="text/javascript" src="lib/gChart/jquery.gchart.js"></script>
<script language="javascript" type="text/javascript" src="lib/flot/jquery.flot.js"></script>
<script language="javascript" type="text/javascript" src="lib/flot/jquery.flot.selection.js"></script>
<script language="javascript" type="text/javascript" src="lib/flot/jquery.flot.crosshair.js"></script>
<script language="javascript" type="text/javascript" src="lib/flot/jquery.flot.navigate.js"></script>
<style>
</style>
</head>
<body>
<div id="placeholder" style="width:1000px;height:400px;"></div>
<div id="test" style="display: none; background: #ff0; padding: 5px; border: 1px …推荐指数
解决办法
查看次数
flot中的条宽问题
我有一个图表,显示代表24小时降雨量的条形图.现在我遇到的第一个问题是flot中条形的默认1px宽度,请参阅此示例:
我搜索了一个解决方案,发现像这样指定barwidth:
bars: {
show: true,
barWidth : 60*60*1000 //1h
}
解决了这个问题.现在这确实有效,但结果不好.在我的例子中(每隔一小时显示24个降雨量的图表)现在发生这种情况:
从第一个示例中可以看出,条形宽度为1px,时间从前一天的13:00到第二天的13:00.现在当条形宽度固定时,由于某种原因,时间从13:00到14:00.现在我尝试了不同的barWidth设置,例如50*60*1000,但是不能正确缩放加上边距开始出现在每个条形图中.
现在我想知道如何解决这个问题,时间线会像第一个例子那样,并且条形宽度为1小时？
推荐指数
解决办法
查看次数
有浮动工具提示的Flot的任何示例？
推荐指数
解决办法
查看次数
jquery flot xaxis时间
在这个例子中,xaxis将比较日期......
$.plot($("#placeholder"), data, {
yaxis: {},
xaxis: { mode: "time",minTickSize: [1, "day"],timeformat: "%d/%m/%y"},"lines": {"show": "true"},"points": {"show": "true"},clickable:true,hoverable: true
});
我怎么打印时间？
这是我想要的结果:
22:00 23:00 00:00 01:00 02:00 ...... 23:00 00:00 01:00 02:00 .... 06:00
可能吗？
推荐指数
解决办法
查看次数
可以在Flot中水平显示条形图吗？
道歉,但我是Flot的新手.
我想在水平条形图中显示我的数据而不是Flot似乎默认的垂直条形图.
是否可以在Flot中执行此操作,如果是,我该如何操作？
推荐指数
解决办法
查看次数
如何json_encode php数组,但没有引号的键
我试图绘制(使用Flot)带有一些数据的饼图
var data = <?php echo json_encode($data)?>
我得到的结果是:
var data = [
{"label":"Crear Usuario", "data":"2"},
{"label":"Impresoras", "data":"1"},
{"label":"Problema Correo", "data":"1"},
{"label":"Requisicion Equipo", "data":"1"},
{"label":"Sitio Web", "data":"1"}
]
这里的问题是我需要label和data没有引号,我已经尝试json_encode($data, JSON_NUMERIC_CHECK);但只删除数字中的引号.
我需要以下格式:
var data = [
{label:"Crear Usuario",data:2}, ...
推荐指数
解决办法
查看次数
在Flot中,是否可以在不删除相应标签的情况下消除或隐藏网格刻度？
在海军报API文档介绍自定义图表的坐标轴库的广泛挂钩.您可以分别为每个轴设置刻度数,颜色等.但是,我无法弄清楚如何防止Flot绘制垂直网格线而不删除x轴标签.我试过改变tickColor,ticks和tickSize选项没有成功.
我想创建漂亮的,与Tufte兼容的图形,例如:
http://www.robgoodlatte.com/wp-content/uploads/2007/05/tufte_mint.gif http://www.argmax.com/mt_blog/archive/RealGDP_graph.jpg
我发现我的图表上的垂直刻度是图表垃圾.我正在处理一个时间序列,我将其显示为垂直条,因此垂直刻度通常以一种视觉上嘈杂的方式穿过条形.
推荐指数
解决办法
查看次数
在jQuery Flot显示中使用日期
我正在尝试使用Flot绘制带有日期的图表.我已经按照这个字符串的建议:这里但它似乎对我不起作用.这是我修改过的JavaScript(来自其他问题):
$(document).ready(function () {
var d1 = [[1262818800,100],[1262732400,100],[1262646000,100]];
var d2 = [[1262818800,23],[1262732400,23],[1262646000,23]];
$.plot($("#placeholder"), [{data:d1,lines:{show: true},label:"Mountain"},{data:d2,lines:{show: true},label:"Valley"}],{yaxis: {label:"cm"}},
{xaxis:
{mode:"time",
timeformat: "%M:%S"
}
});
});
我得到一个图形,但它没有将x轴转换为日期,而x轴上的值甚至与我在数据变量中得到的值不一致.我甚至尝试将每个数据点乘以1000以转换为Javascript时间戳,但这也无济于事.我还尝试了以下timeformat变量,以防出现问题:
"%M:%S", "%H:%S", "%y,%m,%d"
但没有运气.有任何想法吗？
推荐指数
解决办法
查看次数
绘图库将y轴设置为最小0和最大24
如何将y轴设置为0到24的范围
这是我的代码.
j$.plot(j$("#placeholder"),[d1],{
xaxis:
{ mode: "time",
min: (new Date("2010/11/01")).getTime(),
max: (new Date("2011/02/01")).getTime()
}
},
{yaxis: { min:0, max:24 } };
};
xaxis似乎工作,但当我添加y轴它不起作用.
除此之外,d1还包含从salesforce发送的字符串
例如d1成立
[1294041600000,14.00],[1294041600000,14.50],[1294041600000,15.00],[1293955200000,12.00]
我无法查看图表,目前我的y轴只显示范围-1到1,我假设这可能是我没有看到线的原因.
谢谢
Prady
推荐指数
解决办法
查看次数