score:1

Accepted answer

I solved clicks on a link to delete points like this:

$('.remove').click(function () {

    var series = chart.series[0];
    var id = $(this).data('id');

    if (series.data.length) {

        // disable point in graph
        chart.series[0].data[id-1].update(
        {
            y:null
        });

    }

    // delete used tablerow
    $(this).closest("tr").fadeOut(50);
});

And I managed to expulse points onClick on the graph with an event, it's working like this:

    series: [{
        name: 'time',
        data: data: [[1, 129386],[2, 123966],[3, 123162],[4, 123245],[5, 124314],[6, 123946],[7, 124156],[8, 123367],[9, 124460],[10, 123366],[11, 123182],[12, 123915],[13, 124627],[14, 123142],[15, 124044],[16, 124346],[17, 123156],[18, 124356],[19, 123511],[20, 124239],[21, 123252],[22, 125169],[23, 125027],[24, 123508],[25, 124065],[26, 122719],[27, 124199],[28, 122968],[29, 124132],[30, 124052],[31, 124383],[32, 123265],[33, 124083],[34, 123855],[35, 124284],[36, 123719],[37, 123213],[38, 124245],[39, 123079],[40, 123721]],
        events: {

            // if point gets clicked, it'll be deleted
            click: function(event) {
                console.log(event.point);

                var pointId = event.point.x;

                $("#hidden-points-table").fadeIn(1000);
                $('#hidden-elements').append(pointId + ", ");

                event.point.update(
                {
                    y: null
                });

                // deleting the table row
                $("[data-id='"+pointId+"']").closest("tr").fadeOut(50);
            }

        }
    }

Since it was hard to find solutions, I hope this will help some people with it. This page was really helpful, too.

score:1

If I understand you well, you need to keep "place" where the point was? If yes, you can try to use point.update() function and set null value.

Example: http://jsfiddle.net/gd4q4jo0/1/


Related Articles