打开flash图表:如何显示投影数据

时间:2009-06-30 04:56:25

标签: charts open-flash-chart

我正在使用开放式Flash图表在我的页面中显示图表。我使用以下代码将折线图数据显示到我的页面。

<script type="text/javascript" src="js/swfobject.js"></script>
<script type="text/javascript">
swfobject.embedSWF("open-flash-chart.swf", "my_chart", "530", "250","9.0.0", "expressInstall.swf",
{"data-file":"data.json"}
);
</script>

我的json文件如下

{

  "y_legend":{
        "text": "Price US$",
         "style": "{color: #53B9AA;font-size:20; }"
            },

  "elements":[
   {
   "type": "line",
   "colour": "#53B9AA",
    "bg_colour": "#E58A25",
    "background-color":"#53B9AA",
    "inner_background": "#E58A25",
    "text": "Price History",
    "font-size": 19,
    "width": 1,
    "dot-style": {
    "type":"solid-dot", "colour":"#F57F22", "dot-size": 3,
         "tip":"Average price: #val#<br>#x_label#" },
         "on-show": {"type": "shrink-in", "cascade":1, "delay":0.7},
          "values" : [
                 5,7,10,12,13,{"value":11,"colour":"#53B9AA","tip":"Average price :  #val#<br>#x_label#"},
  10,9,8,7,6]
}
],

  "x_axis":{
  "colour": "#7CC8B5",
  "text": "Price US$",
  "labels": {
  "rotate": "vertical",
  "labels":["Jan-09","Feb-09","Mar-09",
  "Apr-09","May-09","Jun-09",
  "Jul-09","Aug-09","Sep-09",
  "Oct-09","Nov-09","Dec-09",
  "Jan-10","Feb-10","Mar-10"]
  }
 },

 "y_axis":{
 "stroke": 4,
  "tick-length": 10,
  "colour": "#7CC8B5",
  "grid-colour": "#ADB5C7",
   "grid-visible": true,
   "offset": false,
    "min": 5,
     "max": 20,
     "visible": true,
     "steps": 5
   }
}

图表在我的浏览器中渲染得非常好。现在我想在图表中添加更多数据。基本上我的图表显示过去几个月的平均销售额。我想显示预测/预测/未来数据。我可以将该数据传递给jSON文件。我希望未来的数据在图表中使用不同的颜色。我想在图表的顶部显示图例,以指示哪一个是当前数据,哪一个是未来的数据。

提前致谢。

1 个答案:

答案 0 :(得分:0)

解决方案是对当前和预计数据使用不同的行。

您可以在单个图表中添加多行,但这可能不适合您的目的,因为(目前至少),折线图需要包含整个x轴范围的数据,并且插入任何空值。 / p>

一种选择是使用this site中的修补版本,设置null-gap:true并使用空数据值填充行位置。

该选项是使用Flash对象的普通版本并使用散点图,如下例所示: http://teethgrinder.co.uk/open-flash-chart-2/scatter-mixed.php