¿Dos tipos de gráficos en uno?

Question

¿Es posible generar un gráfico como el siguiente con Highcharts? Si es así, ¿cómo lo haría?

El gráfico superior no es el problema. Además, necesito los bloques apilados a continuación. Un plan sería suficiente.

He heredado un proyecto de un compañero de trabajo que ya está usando HighCharts, y ahora necesito extender la funcionalidad.

Answer 1

Sí, esto es posible. Armé un jsfiddle para simular lo que quieres hacer.

http://jsfiddle.net/vbpds/4312/

Entonces la parte importante:

En su colección de series, debe decirle que desea que una serie en particular sea del tipo de columna (si su tipo predeterminado está configurado en línea; es decir, si un tipo no está definido en la serie, se dibujará automáticamente como lo que se establece en el valor predeterminado).

chart: {
        renderTo: 'container',
        defaultSeriesType: 'line'
    },
    series: [{
        type: 'column',
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
        stack:'1'

    },{
        type: 'column',
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
        stack:'1'

    }
             , {
        data: [129.9, 271.5, 306.4, 29.2, 544.0, 376.0, 435.6, 348.5, 216.4, 294.1, 35.6, 354.4]

    },{
        data: [100, 110, 120, 130, 140, 150, 140, 130, 120, 110, 100, 110]  
    }]

Ahora, debido a que también desea que las columnas se acumulen, debe decirlo qué grupos de datos deben apilarse entre sí. Así que establece la propiedad de la pila en lo que desee, pero solo asegúrese de que coincidan para que estén 'atados'.

Editar: ¡Por cierto, la documentación de la API de HighCharts es excelente! Consulte para obtener más información: http://www.highcharts.com/ref/