标签: flot

我试图在Flot中绘制一些应该x-axis以时间模式显示的数据.flot引用API并不表示minTickSize可以接受"周"作为一个单元,所以我已将单位指定为"day",其值为7:

  minTickSize: [7, "day"],

这显示了在一些刻度中间隔7天的刻度尺寸以及在某些刻度中间隔约8-9天.这是一个显示不一致的刻度的示例:http://jsfiddle.net/UEePE/583/

我知道图表也没有绘制我期待的简单线条.仍在努力找出原因.当我从xaxis中删除除mode:time之外的所有选项时,它似乎工作,但是当我添加其他选项时却没有.

任何帮助将不胜感激如何使Flot添加刻度7天/ 1周分开以及如何使图表实际绘制一条线在这种情况下.

谢谢!

我有一个javascript中的数据列表,如下所示:

[[152, 48, 'http://www.google.com'], 
 [198, 47, 'http://www.stackoverflow.com'], 
 [199, 45, 'http://www.apple.com']]

我正在使用flot来创建一个情节,并且我试图传递第三个值以从该点访问超链接.因此,我试图通过使用前两个作为查找键来查找每个列表的第三个值(即[[x,y,hyperlink],[x2,y2,hyperlink2]],单击一个点,然后使用相应(x,y)的查找相应的超链接)

无论如何要做到这一点,还是我需要将x和y的一些字典传递给javascript,然后从查找的两个列表中找到公共变量？在python中,我知道你可以x使用itemgetter 对值进行列表过滤,然后查找与该y值对应的链接.但我对js几乎一无所知,因此可以(x,y)给出ID-ing的解决方案,或者如果不可能或建议,则可以采用两个(来自x和y值)列表并找到一个共同值(如果是多个)的解决方案,只有一个,任何人)？

这是我想用flot绘制的数据(jquery库)

动作在x轴上,动作在y上

var data= [{"action":"QUERY INSURANCE","count":"9"},{"action":"QUERY POLICE DETAILS","count":"15"},{"action":"QUERY VEHICLE DETAILS","count":"3"},{"action":"CIVILIAN DETAILS","count":"1"},{"action":"LOGGING IN","count":"59"},{"action":"Report Occurrence","count":"1"},{"action":"QUERY CRIMINAL RECORDS","count":"2"},{"action":"QUERY VEHICLE OFFENCES","count":"2"},{"action":"QUERY DL VALIDITY","count":"5"},{"action":"REPORT OCCURRENCE","count":"23"}];

$.plot($("#plotrr"), [
    {
        data: data,
        bars: { show: true }

    }]);

我如何在x轴上显示'动作',在y轴上显示'计数'

我期待flot v.0.7有一个非常奇怪的问题.我有多个轴,配置如下:

var plotData = [
    { data: data1 },
    { data: data2, yaxis: 2 }];

var options = {
    selection: { mode: "x" },
    xaxis: { mode: "time" },
    yaxis: [
      { min: 0 },
      {
        min: 0, 
position: "right",
zoomRange: false,
alignTicksWithAxis: 1,
tickFormatter: formatter,
      }
    ],
    grid: { markings: weekendAreas },
    zoom: { interactive: true },
    grid: {
        clickable: true,
        hoverable: true,
        borderWidth: 1,
    },
    legend: { show: false },
};

var plot = $jq.plot(container, plotData, options); …

一切顺利.

我需要根据它的价值改变flot bar/pie颜色.

例如,我有数据

data = [
    { label: "Label 1", color: "orange", data: 10}
    { label: "Label 2", color: "orange", data: 20}
    { label: "Label 3", color: "orange", data: 70}
];

$.plot(placeholder, data, options);

标签3作为最大标签应该保持橙色,标签2和标签1应该具有不透明度(例如,每个-10%将给出不透明度-10).

像这样的东西:

正确方向的任何想法或提示？

谢谢!

PS标签值将动态变化,因此我不能只添加预定义的颜色.

我正在尝试使用Flot创建一个时间序列图来比较两个系列的数据.在包含jQuery,jquery.flot.js和jquery.flot.time.js后,我的代码如下:

$(function () {
  var d1 = {
    label: "Fall 2011",
    data: [
      [1296536400, 9],
      [1296622800, 23],
      [1296709200, 30],
      [1296795600, 64],
      [1296882000, 94],
      [1296968400, 113],
      [1297054800, 125],
      [1297141200, 156],
      [1297227600, 181],
      [1297314000, 200],
      [1297400400, 217],
      [1297486800, 231],
      [1297573200, 248],
      [1297659600, 259],
      [1297746000, 271],
      [1297832400, 282],
      [1297918800, 308],
      [1298005200, 316],
      [1298091600, 332],
      [1298178000, 345],
      [1298264400, 360],
      [1298350800, 373],
      [1298437200, 391],
      [1298523600, 409],
      [1298610000, 427],
      [1298696400, 433],
      [1298782800, 444],
      [1298869200, 460],
      [1298955600, 467],
      [1299042000, 479],
      [1299128400, 494],
      [1299214800, 500],
      [1299301200, 509],
      [1299387600, …

我试图使用FLOT图表绘制我存储在PostgreSQL中的值.其中一个轴将有时间戳.我将其存储在数据库中的格式为:( 2013-11-01 00:05:57年 - 月 - 日小时:分:秒).

我尝试使用以下代码将此格式转换为UNIX:

$postgresql_timestamp= 2013-11-01 00:05:57;
$unix_timestamp= strtotime($postgresql_timestamp);

得到的结果1383260757与另一个日期相对应:2013-10-01 23:05:5

我认为我遇到的问题与PostgreSQL上的时间戳格式有关.

我正在使用jQuery flot饼图,我在交互式饼图中使用了嵌入式标签.当我单击饼图中的某个扇区时,它会显示警告,但是当我点击嵌入在扇区中的标签时,它不会响应点击操作.这有什么解决方案吗？

我的源代码

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="http://static.pureexample.com/js/flot/excanvas.min.js"></script>
<script src="http://static.pureexample.com/js/flot/jquery.flot.min.js"></script>
<script src="http://static.pureexample.com/js/flot/jquery.flot.pie.min.js"></script>

<!-- CSS -->
<style type="text/css">
#flotcontainer {
    width: 600px;
    height: 400px;
    text-align: left;
}
</style>

<!-- Javascript -->
<script type="text/javascript">
$(function () { 
    var data = [
        {label: "data1", data:10},
        {label: "data2", data: 20},
        {label: "data3", data: 30},
        {label: "data4", data: 40},
        {label: "data5", data: 50},
        {label: "data6", data: 60},
        {label: "data7", data: 70}
    ];

    var options = {
            series: {
                pie: {
                    show: true,
                    radius: 1,
                    tilt: 0.5, …

我列入jquery.flot.trendline.js. 从这里

这是我的代码

$.plot($("#placeholder"), seriesdata, {
        series: {
     trendline: {
        show:true,
        lineWidth:2,
        fill:true,
        fillColor:false,
        steps:true
    },
    ...
});

我没有在图表中获得趋势线.

Too much code to paste here so....

请参阅JS小提琴在http://jsfiddle.net/1a2s35m2/当前代码.

我正在尝试使用flot创建一个水平条形图.正如您将从小提琴中看到的,这可以正常工作,但我想在条形图中显示条形的值而不是Y轴中的标签,如下图所示......

我试图使用"标签"插件和barnumbers插件,但这些似乎不起作用.(Barnumbers接近但显示0 1 2 3作为值.

有任何想法吗？