7

编辑在与托尼的以下对话后，我重写了我的问题以使其更容易理解（谢谢！）。

目标在同一个图表中渲染多个折线图（比如说 2）。图表具有不同的 x/y 值对。对于一个 x 值，我不知道两个 y 值。

我正在使用 Silverlight。可用的类是SerialChart和LineGraph。两个图的数据源相同，都是在SerialChart层级设置的。x 轴的属性名称也在此处为两个图形 ( CategoryValueMemberPath) 定义。

正如 amCharts 文档所建议的，我们需要创建具有类别轴（x 轴）属性的对象，然后每个图都有一个属性。我们称它们为“Graph1”和“Graph2”。所以数据源看起来像这样：

List<MyClass> data = new List<MyClass>()
{
   new MyClass() { Category = 0.1, Graph1 = 0.14, Graph2 = ??? }
  ,new MyClass() { Category = 0.15, Graph1 = ???, Graph2 = 0.05 }
  ,new MyClass() { Category = 0.2, Graph1 = 0.35, Graph2 = ??? }
  ,new MyClass() { Category = 0.18, Graph1 = ???, Graph2 = 0.12 }
  ... and so on ...
}

问题我应该如何处理“？？？” 价值观？对于该类别值，我没有该图表的实际值。

如果我没有设置值，则假定默认值为 0.0，它会在 x 轴上绘制一个尖峰。如果我设置了先前已知的 Graph1/Graph2 值，那么它会创建一个不应该存在的水平连接。我基本上是在更改导致错误结果的图表。

那么我该如何解决呢？我感觉 amCharts 不支持这种情况。

4

1 回答 1

4

您需要添加两个“值”轴，一个在 X 方向，一个在 Y 方向（想象一下，就像一个气泡图）。

// AXES
// X
var xAxis = new AmCharts.ValueAxis();
xAxis.position = "bottom";
xAxis.gridAlpha = 0.1;
xAxis.autoGridCount = true;
chart.addValueAxis(xAxis);

// Y
var yAxis = new AmCharts.ValueAxis();
yAxis.position = "left";
yAxis.gridAlpha = 0.1;
yAxis.autoGridCount = true;
chart.addValueAxis(yAxis);

将所有数据点合并到一个具有公共 X 轴字段名称（在我的示例中为“x”）的数组中，对于第 1 行的点，添加一个属性为 'line1' 及其值，对于第 2 行的点，添加一个'line2' 的属性。

例如，您的数据将如下所示：

var chartData = [
  {x:0.1,line1:0.25},
  {x:0.246,line1:0.342},

  {x:0.12,line2:0.16},
  {x:0.3,line2:0.485}
];

然后为图表中的每一行添加一个“图表”，指定从对象数组中获取值的位置。

// GRAPHS
var graph = new AmCharts.AmGraph();
graph.xField = "x";
graph.yField = "line1";
graph.lineAlpha = 1;
graph.lineColor = '#FF9E01';
chart.addGraph(graph);

var graph2 = new AmCharts.AmGraph();
graph2.xField = "x";
graph2.yField = "line2";
graph.lineAlpha = 1;
graph2.lineColor = '#9EFF01';
chart.addGraph(graph2);

我已经为你把所有这些都放到了一个小提琴中 - http://jsfiddle.net/64EWx/

于 2012-10-10T10:09:18.683 回答