2012-10-03 59 views
7

Estoy tratando de usar la API de Google Chart para mostrar un gráfico de líneas.
He creado una tabla de datos con dos columnas, una fecha y un valor numérico. La línea se muestra correctamente pero faltan las etiquetas en el eje X. Todos los datos están en el mismo día, pero a horas diferentes. Si edito las fechas para repartirlas en diferentes días, todo funciona.
Necesito enfocar mi cuadro en un solo día y mostrar horas y minutos en el eje X.
¿Cómo puedo hacer eso?Horas y minutos de Google Chart Line Chart

Gracias.

Respuesta

7

Normalmente se trata de cómo se pasan los datos. Con arrayToDataTable sus fechas son solo cadenas. Si crea una instancia de un objeto de fecha JS y crea el dataTable, debería obtener mejores resultados. Este código funciona para mí (ver live):

function drawVisualization() { 

var data = new google.visualization.DataTable(); 

data.addColumn('datetime', 'Time of Day'); 
data.addColumn('number', 'Some Measurement'); 

data.addRows([ 
    [new Date(2012,10,3,11,30,0), 12], 
    [new Date(2012,10,3,11,45,0), 2], 
    [new Date(2012,10,3,12,1,0), 16], 
    [new Date(2012,10,3,12,15,0), 3], 
    [new Date(2012,10,3,12,30,0), 12], 
    [new Date(2012,10,3,12,45,0), 7] 
]); 


new google.visualization.LineChart(document.getElementById('visualization')). 
    draw(data, {curveType: "function", 
       width: 500, height: 400, 
       vAxis: {maxValue: 10}} 
    ); 
} 

Yo solía ser un fan de visualización de Google, pero se han quemado demasiadas veces por sus cambios sin previo aviso. También tiene muchas limitaciones. Consulte Dygraph que maneja las series de tiempo muy bien.

+2

Hola Mi error fue utilizar "fecha" como tipo en lugar de "fecha y hora". Gracias por el consejo sobre los dygraphs. – user1717513