Is it possible to remove a pane in highstock/highcharts?

问题

Suppose I have two panes in my highstock, can I remove one of the panes dynamically. So if I click on a pane, I should be able to trap the event alongwith the id of the pane(yaXis) and subsequently delete the axis alongwith its series. I have added the panes dynamically like following( so I axis have Id etc. with me)

chartX.addAxis({ // Secondary yAxis
                    id: studyName,
                    title: {
                        text: studyText
                    },
                    isX: false,
                    lineWidth: 2,
                    lineColor: '#08F',
                    //opposite: true,
                    top: startHeight,
                    height: 100,
                    offset: 0
                });
                var chartToUpdate=chartX.addSeries({
                        name: 'ADBE',
                        id: 'studyNew',
                        color: 'black',
                        data: studyData,
                        yAxis: studyName
                    });
                    $("#selectStudy").append("<option value='"+countNoOfStudiesAdded+"'>"+studyName+"</option>")
                }

Is it possible to delete the pane as mentioned above. Any other method that can help achieve dynamic removal of the pane will be appreciated.

Thanks.

回答1:

OK I got the solution by tinkering... The best one was by adding the events such that whenever I click on the legend of the series, its pane is removed.

var chartToUpdate=chartX.addSeries({
                        name: 'ADBE',
                        id: studyName,
                        color: 'black',
                        data: studyData,
                        yAxis: studyName,
                        events: {
                            legendItemClick: function(event) {
                                this.yAxis.remove();
                                countNoOfStudiesAdded--;
                            }
                        }
                    });

If someone wants the exact answer to my question then the solution is to have a dropdown select/option and a button. Once the button is clicked, we find the pane to be deleted from dropdown and then delete it as follows:

    $('#remove').click(function() {
        if($("#selectStudy").val()!=0) {
            var studyToDelete=chartX.get($("#selectStudy option:selected").text());
            while(studyToDelete!=null) {
                studyToDelete.remove();
                $("#selectStudy option:selected").remove()
                studyToDelete=chartX.get($("#selectStudy option:selected").text());
            }
        }
    });

where id of button is remove, id of selection dropdown list is selectStudy. So we find all the series attached to the pane having same id as that of yAxis ad delete them.

回答2:

You can use Axis.remove() function to remove axis.

http://api.highcharts.com/highcharts#Axis.remove()

来源：https://stackoverflow.com/questions/19615287/is-it-possible-to-remove-a-pane-in-highstock-highcharts

标签

Highcharts

highstock