←

Settings and activity

1 result found

  1. Stacked area (spline etc) in irregular datetime series

    327 votes
    11 comments  ·  Highcharts Javascript API  ·  Admin →
    How important is this to you?
    An error occurred while saving the comment
    Anonymous commented  · 

    Hi, I have a requirement . In my below example the grey square area is exisitng loan and the sky blue colored area is new Loan given. Together in this chart we have 3 square corners. And my requirement is to see all three corners curved without actually modifying7effecting the actual date on X-axis. Thanks in advance. https://jsfiddle.net/y0kqsrav/183/

    Highcharts.chart('container', {
    chart: {
    type: 'areaspline'
    },
    title: {
    text: 'Credit Loan'
    },
    subtitle: {
    text: 'New/Existing Loans'
    },
    xAxis: {

    title: '',
    type: 'datetime',
    labels: {
    format: '{value:%d.%m.%y}'
    }
    },
    yAxis: {
    title: {
    text: 'millions'
    },
    labels: {
    formatter: function () {
    return this.value/1000000;
    }
    }
    },
    tooltip: {
    split: true,
    valueSuffix: ' millions'
    },
    plotOptions: {
    areaspline: {

    // stacking: 'areaspline',

    lineColor: '#666666',
    lineWidth: 1,
    marker: {
    lineWidth: 1,
    lineColor: '#666666',

    }
    }
    },
    series: [{
    name: 'New Loan',

    data: [
    [Date.UTC(2018, 6, 7), 155317288],
    [Date.UTC(2018, 11, 29), 155317288],
    [Date.UTC(2018, 11, 29), 80000000],
    [Date.UTC(2019, 5, 6), 80000000],

    ]
    },
    {
    name: 'Existing Loan',
    data: [
    [Date.UTC(2018, 6, 7), 75317288],
    [Date.UTC(2018, 11, 29), 75317288],

    ]
    }]
    });
    javascripthighchartshighcharts-ng