View on GitHub

line_intersection.js

A JavaScript library to find the intersection of two straight lines (useful for charting libraries)

Download this project as a .zip file Download this project as a tar.gz file

Forecast Demo

Source

jQuery(function () {
    var data1 = [
        [Date.UTC(2013, 0, 1), 50],
        [Date.UTC(2013, 0, 2), 58],
        [Date.UTC(2013, 0, 3), 58],
        [Date.UTC(2013, 0, 4), 58]
    ];
    var data2 = [
        [Date.UTC(2013, 0, 1), 0],
        [Date.UTC(2013, 0, 2), 12],
        [Date.UTC(2013, 0, 3), 18],
        [Date.UTC(2013, 0, 4), 22]
    ];
    var data1_t = getTrendlineData(data1).data;
    var data2_t = getTrendlineData(data2).data;
    var options = {
        icptPoint: {
            //name: 'Possible release date',
            marker: {
                enabled: true,
                fillColor: '#003300',
                lineColor: '#003300'
            }
        },
        validateIntersection: function(icptX, icptY) {
            // Don't connect the lines if the intersection point is
            // to the left of the chart
            if (icptX < data1_t[0][0] || icptX < data2_t[0][0]) {
                return false;
            }
        }
    };
    var forecast = getLineIntersectionData(data1_t, data2_t, options);

    var chart_linear = new Highcharts.Chart({
        chart: {
            renderTo: 'container'
        },
        colors: ['#990000', '#4679BD', '#990000', '#4679BD'],
        xAxis: {
            type: 'datetime',
            gridLineWidth: 1,
            gridLineDashStyle: 'shortdot'
        },
        yAxis: {
            min: 0,
            gridLineDashStyle: 'shortdot'
        },
        title: {
            text: 'Estimating release date'
        },
        series: [{
            name: 'Total issues',
            data: data1
        }, {
            name: 'Closed issues',
            data: data2
        }, {
            name: 'Total issues trend',
            //getLineIntersectionData() may return undefined if lines can not intersect
            data: forecast && forecast.line1_data || data1_t,
            marker: {
                enabled: false
            },
            dashStyle: 'longDash'
        }, {
            name: 'Closed issues trend',
            data: forecast && forecast.line2_data || data2_t,
            marker: {
                enabled: false
            },
            dashStyle: 'longDash',
        }]
    });
});

Output: