График Highstocks: Показать данные за одну неделю

Question

Я использую Highstocks, чтобы нарисовать график. Я хочу отобразить данные за 1 неделю, и у меня есть список дат. Этот график показывает цену за день с линейным графиком и количество за день с столбчатым графиком. Данные поступают из базы данных.

Необходимая функция: 1. Пользователь может легко изменить таймфрейм. 2. отображать данные за 1 неделю

Итак, пожалуйста, помогите мне, как мне этого добиться?

Вот что я пробовал:

         Highcharts.stockChart(id,{
                chart: {
                },

                title: {
                    text: 'Product Price-Quantity Chart'
                },
                rangeSelector: {
                    selected: 2,
                    allButtonsEnabled: true,
                    inputEnabled: true,
                    buttons: [{
                        type: 'week',
                        count: 1,
                        text: '1w'
                    }, {
                        type: 'month',
                        count: 1,
                        text: '1m'
                    }          
                },

                xAxis: [{
                    type: 'datetime',
                    dateTimeLabelFormats: {                 
                        day: '%Y-%m-%d'          

                     },                         
              }],

                yAxis: [{
                    title: 'Price',
                    height: '50%',
                    offset: 0,
                    tickInterval: 10,
                    lineWidth:2                     
                },{                 
                    title: 'Quantity',
                    top: '50%',
                    height: '50%',
                    offset: 0,
                    tickInterval: 100,
                    lineWidth:2
                } ],        

                series: [{
                    type: 'line',
                    name: 'Price',
                    data: price,
                    pointStart: Date.UTC(2020, 3, 1),
                    pointEnd: Date.UTC(2020, 3 , 30),
                    pointInterval:  2*24 * 3600 * 1000,
                    tooltip: {
                        pointFormat: "Price {point.y: .2f}"
                    }                     
                } ,{                        
                    type: 'column',
                    name: 'quantity',
                    data: quantity,
                    yAxis: 1,
                    pointStart: Date.UTC(2020, 3, 1),
                    pointEnd: Date.UTC(2020, 3 , 30),
                    pointInterval: 2 * 24 * 3600 * 1000                           
                }]
            }); 

Вывод: