标签: flot

我们通常在Excel中将一些数据(10-50列,数十万行)可视化为折线图或堆积条形图.
用户希望能够放大和缩小图表以获得单个样本,但这些操作确实让Excel瘫痪.

我正在考虑将数据嵌入到HTML页面中,使用内联JavaScript来处理浏览器中的可视化.像flotr JS charting lib这样的东西可以用于图表.

1. 这是一个愚蠢的想法吗？
2. 浏览器是否已准备好进行此类加载？
3. 这是一个解决的问题,我应该在问之前用Google搜索更彻底吗？

嗨我正在尝试从mysql数据库中检索数据来创建flot图可以任何人带我完成这个程序或者让我知道该怎么做谢谢

我想在flot条形图上显示栏内的值,如下所示:

|
|               +----+
|               |    |
|               |    |
|               |    |
|   +----+      | 20 |
|   |    |      |    |
|   | 10 |      |    |
|   |    |      |    |
|---+----+------+----+------

data = [[1,10],[2,20]]

有没有办法做到这一点？

Flot是否有一个可以设置为图表标题的选项？我没有看到整个图表中的一个,只是针对轴.

但我可能错过了一些东西.

为了使事情变得容易,我正在提供代码:http://jsbin.com/otaruq

我们这里有一个这样的数据集:(查看源代码更多)

 "label": "scott",
    "data": [[1317427200000, "17017"], [1317513600000, "77260"]]

其中第一个值是UTC格式的日期,第二个值应该是分数.

现在,我要做的是让y轴上的每个日期并排表示得分的条形,如下所示:

   3 | #                          # 
   2 | # #         #   #          # #
   1 | # # #       # # #        # # #
   0 |_________________________________
     1 oct         2 oct        3 oct

相反,现在你可以看到这些酒吧都是在每一个上面.

任何帮助都会真正得到应用,谢谢

我正在建立一个需要大量复杂多线图的网站.我看到两个最佳候选人

1. 海军报
2. 谷歌图表

有没有人对此决定有任何建议或偏好？

但根据这个:http://www.php.net/manual/en/function.json-encode.php#94157它不会.

我正在使用flot所以我需要一个带有数字索引的数组返回,但我得到的是这样的:

jsonp1282668482872 ( {"label":"Hits 2010-08-20","data":{"1281830400":34910,"1281916800":45385,"1282003200":56928,"1282089600":53884,"1282176000":50262,"1281657600":45446,"1281744000":34998}} );

所以flot窒息.如果我在调用json_encode之前对数组进行var_dump,它看起来像这样:

array(7) {
  [1281830400]=>
  int(34910)
  [1281916800]=>
  int(45385)
  [1282003200]=>
  int(56928)
  [1282089600]=>
  int(53884)
  [1282176000]=>
  int(50262)
  [1281657600]=>
  int(45446)
  [1281744000]=>
  int(34998)
}

有任何想法吗？

我遇到了一个问题,即flot图形不会在标签界面中呈现,因为占位符div是具有'display:none'的div的子节点.将显示轴,但没有图形内容.

我在下面编写了javascript函数作为plot函数的包装器来解决这个问题.对其他人做类似事情可能会有用.

function safePlot(placeholderDiv, data, options){

    // Move the graph place holder to the hidden loader
    // div to render
    var parentContainer = placeholderDiv.parent();
    $('#graphLoaderDiv').append(placeholderDiv);

    // Render the graph
    $.plot(placeholderDiv, data, options);

    // Move the graph back to it's original parent
    // container
    parentContainer.append(placeholderDiv);
}

这是图形加载器div的CSS,可以放在页面的任何位置.

#graphLoaderDiv{
    visibility: hidden;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 500px;
    height: 150px;
}

有没有办法让Flot使轴编号以逗号分隔？

因此,例如,而不是1000000有1,000,000

我有一个我用flot呈现的基本条形图(5个条形图,显示每个状态的%).

$.plot($("#placeholder"), [
    {
        label: 'Failed',
        data: [[0,10]],
        bars: { show: true }
    },
    {
        label: 'Passed',
        data: [[1,15]],
        bars: { show: true }
    },
    {
        label: 'Not Run',
        data: [[2,30]],
        bars: { show: true }
    },
    {
        label: 'Blocked',
        data: [[3,5]],
        bars: { show: true }
    },
    {
        label: 'In Progress',
        data: [[4,40]],
        bars: { show: true }
    }
],
{
    xaxis: {
        ticks: [[0.5, "Failed"], [1.5, "Passed"], [2.5, "Not Run"], [3.5, "Blocked"], [4.5, "In Progress"]]
    },
    legend: { …