How to make highcharts can be drag in chart to select multi points in mobile phone

Details descriped

• I make the highcharts can be drag in the chart and make the selected points marked.
• It work well in the PC browser.
• It can only click in the chart when visit the chart in mobile phone(android).

Qustion:

How can i make it success in mobile phone that select multi points by draging in the chart? Thanks.

Code in angularJS to select points by drag: Highcharts.chart('container', { chart: { zoomType: 'x', events: { selection: function(event) { return selectPointsByDrag(event); }, click: function(event) { return updateRelatedProjectsInfo([event.xAxis[0].value, event.xAxis[0].value], $scope.buildTimeInfo); } } }, title: chartConfig.parameters.title, tooltip: chartConfig.parameters.tooltip, xAxis: chartConfig.parameters.xAxis, yAxis: chartConfig.parameters.yAxis, plotOptions: { area: { marker: chartConfig.parameters.areamarker, cursor: 'Pointer', events: { click: function(event) { //buildtime = buildtime; return updateRelatedProjectsInfo([event.point.x, event.point.x], $scope.buildTimeInfo); } }, fillColor: { linearGradient: chartConfig.parameters.linearGradient, stops: [ [0, Highcharts.getOptions().colors[0]], [1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')] ] }, marker: chartConfig.parameters.marker, lineWidth: chartConfig.parameters.lineWidth, states: chartConfig.parameters.states, threshold: null }, line: { marker: { enabled: true }, cursor: 'Pointer', events: { click: function(event) { return updateRelatedProjectsInfo([event.point.x, event.point.x], $scope.buildTimeInfo); } }, fillColor: { linearGradient: chartConfig.parameters.linearGradient, stops: [ [0, Highcharts.getOptions().colors[0]], [1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')] ] }, marker: chartConfig.parameters.marker, lineWidth: chartConfig.parameters.lineWidth, states: chartConfig.parameters.states, threshold: null } }, legend: chartConfig.parameters.legend, series: chartConfig.series(cpuUtilizations, availMemories) });

and the function for selection event of highcharts is:

function selectPointsByDrag(event) {
        var highChart, k, l, len, len1, len2, m, point, ref, ref1, ref2, ref3, selectedPoints, selectedPointsEnd, selectedPointsStart, series, timeRange;
        if (!event.xAxis) {
            return;
        }
        highChart = event.target;
        ref = highChart.getSelectedPoints();
        for (k = 0, len = ref.length; k < len; k++) {
            point = ref[k];
            point.select(false);
        }
        ref1 = highChart.series;
        for (l = 0, len1 = ref1.length; l < len1; l++) {
            series = ref1[l];
            ref2 = series.points;
            for (m = 0, len2 = ref2.length; m < len2; m++) {
                point = ref2[m];
                if ((event.xAxis[0].min <= (ref3 = point.x) && ref3 <= event.xAxis[0].max)) {
                    point.select(true, true);
                }
            }
        }
        selectedPoints = highChart.getSelectedPoints();
        if (!isEmpty.isEmp(selectedPoints)) {
            selectedPointsStart = selectedPoints[0];
            selectedPointsEnd = selectedPoints[selectedPoints.length - 1];
            timeRange = [selectedPointsStart.x, selectedPointsEnd.x];
            return updateRelatedProjectsInfo(timeRange, $scope.buildTimeInfo);
        }
    }

Use this function to complish the selected multi points marked by drag in the chart.