2012-10-09 15 views
7

EDIT Reescribí mi pregunta para que sea más comprensible después de la siguiente conversación con Tony (¡gracias!).Amcharts SerialChart gráficos de líneas múltiples diferentes rutas de miembros de valor de categoría (Silverlight)

OBJETIVO Interpretar gráficos de varias líneas (digamos 2) en el mismo gráfico. Los gráficos tienen diferentes pares de valores x/y. Para un valor x, no conozco ambos valores y.

estoy usando Silverlight. Las clases disponibles para esto son y LineGraph. La fuente de datos para ambos gráficos es la misma y se establece en el nivel . El nombre de la propiedad para el eje x también se define allí para ambos gráficos (CategoryValueMemberPath).

como lo sugiere la documentación amCharts, tenemos que crear los objetos que tienen una propiedad para el eje de categorías (eje x) y luego una propiedad por el gráfico. Vamos a llamarlos "Graph1" y "Graph2". Por lo que la fuente de datos es como la siguiente:

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 ... 
} 

PROBLEMA ¿Qué se supone que debo hacer con el "???" ¿valores? No tengo el valor real para ese gráfico para ese valor de categoría.

Si no establecer un valor, el valor predeterminado de 0,0 y se supone que dibuja un pico para el eje x. Si configuro el valor previamente conocido Graph1/Graph2, entonces crea una conexión horizontal donde no se supone que sea uno. Básicamente estoy alterando el gráfico que conduce a un resultado incorrecto.

Entonces, ¿cómo soluciono esto? Tengo la sensación de que amCharts no es compatible con este escenario.

Respuesta

4

necesita añadir dos 'valor' ejes, uno en la dirección X y uno en la dirección Y (imaginar, como un gráfico de burbujas).

// 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); 

combinar todos los puntos de datos en una matriz con un común X Nombre del campo del eje ('x' en mi ejemplo) y para los puntos de la línea 1, añadir un alojamiento de 'línea 1' con su valor, y por puntos en la línea 2, agregue una propiedad de 'línea2'.

Por ejemplo, los datos se vería así:

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} 
]; 

continuación, agregar un 'gráfico' para cada línea de su carta especificando dónde obtener el valor de la matriz objeto.

// 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); 

He puesto todo esto en un violín para usted - http://jsfiddle.net/64EWx/

+0

Hola, Tony, gracias por su respuesta. Pero, ¿no estoy todavía limitado por el valor de 'gato'? Tengo diferentes valores de 'gato' para las líneas. Tendría entradas que tienen: {cat: 0.1, línea 1: 0,23, line2: , línea 3: } y {cat: 0,12, línea 1: , line2: 0,35, línea 3: }. Según entiendo, los amCharts están limitados por un valor de categoría común. – Wolfgang

+0

No es limitado. He usado sus datos de ejemplo, que tiene diferentes valores para cada línea gato – tonycoupland

+0

Pensando en ello, el nombre de 'gato' es probablemente engañosa. Lo cambiaré – tonycoupland

Cuestiones relacionadas