score:3

Accepted answer

since you're using an area chart with square shapes, you can achieve this behavior using the step attribute (http://api.highcharts.com/highcharts/plotoptions.area.step). this squares off the edges of your area chart to produce (as you would expect from its name) a "step" effect.

i modified your fiddle with this simple change (see http://jsfiddle.net/brightmatrix/fnove341/5/).

    plotoptions: {
        series: {
            fillopacity: 1,
            stacking: 'normal'                
        },
        column: {
            pointpadding: 0,
            grouppadding: 0,
            borderwidth: 0, // < set this option
            connectnulls: false
        },
        area: {
            step: 'left' /* added to prevent test1 series from dropping off before 2028 */
        }
    },

your chart will now appear as you expect without having to change your value of 0 to null. i hope this helps!

score:0

by setting data: [113864, 113864, 113864, 0, null, null, null],, you are saying that point 1 = 113864, point 2 = 113864, point 3 = 113864, point 4 = 0, and no more points after that.

although not desired, it is expected. if you set point 4 = null, then it will cut of where you expect it.

so you will either have to replace all 0 values with null in your code, or come up with some very clever solution to go away from normal behaviour.


Related Query

More Query from same tag