Линейный график Jqplot неправильно обрабатывает переход на летнее время (DST) - PullRequest
Новая
       26

Линейный график Jqplot неправильно обрабатывает переход на летнее время (DST)

0 голосов
/ 05 ноября 2019

На нашем линейном графике есть 3 области для временного окна с 1:00 до 2:00 3 ноября, потому что летнее время.

screen image

В первом окнемы можем видеть, что есть два набора точек, и во втором окне нет точек, данные для второго окна неуместны в первом окне. Как мы можем установить данные для второго времени с 1:00 до 2:00 во втором окне?

Пожалуйста, проверьте следующий код. 

<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jqPlot/1.0.9/jquery.jqplot.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jqPlot/1.0.9/plugins/jqplot.cursor.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jqPlot/1.0.9/plugins/jqplot.dateAxisRenderer.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jqPlot/1.0.9/plugins/jqplot.logAxisRenderer.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jqPlot/1.0.9/plugins/jqplot.canvasOverlay.min.js"></script>
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jqPlot/1.0.9/jquery.jqplot.css" />
    <title>JQPlot Demo</title>
    <script>

       $(document).ready(function () {

        var goog1 = [["Nov 3, 2019 12:03:33 AM",224.38858],
            ["Nov 3, 2019 12:13:28 AM",225.014252],
            ["Nov 3, 2019 12:23:28 AM",224.174057],
            ["Nov 3, 2019 12:33:23 AM",225.669022],
            ["Nov 3, 2019 12:43:23 AM",224.648056],
            ["Nov 3, 2019 12:53:32 AM",224.700027],
            ["Nov 3, 2019 1:03:32 AM",226.290039],
            ["Nov 3, 2019 1:13:28 AM",226.250732],
            ["Nov 3, 2019 1:23:28 AM",225.588013],
            ["Nov 3, 2019 1:33:23 AM",225.729],
            ["Nov 3, 2019 1:43:22 AM",226.667923],
            ["Nov 3, 2019 1:53:32 AM",224.512756],
            ["Nov 3, 2019 1:03:28 AM",225.82457],
            ["Nov 3, 2019 1:13:28 AM",225.117676],
            ["Nov 3, 2019 1:23:28 AM",224.69632],
            ["Nov 3, 2019 1:33:22 AM",224.419052],
            ["Nov 3, 2019 1:43:23 AM",224.073517],
            ["Nov 3, 2019 1:53:32 AM",224.044769],
            ["Nov 3, 2019 2:03:28 AM",225.302612],
            ["Nov 3, 2019 2:13:28 AM",225.060745],
            ["Nov 3, 2019 2:23:33 AM",226.077454],
            ["Nov 3, 2019 2:33:28 AM",226.639618]];

            var ymin = 223.50;
            var ymax = 227.00;
            var opts = {
                title: 'Notee, Inc.',
                sortData: false,
                axes: {
                    xaxis: {
                        renderer: $.jqplot.DateAxisRenderer,
                        tickOptions: {
                            formatString: '%H:%M:%S'
                        },
                    },
                    yaxis: {
                        renderer: $.jqplot.LogAxisRenderer,
                        formatString: '%#.2f',
                        min: ymin,
                        max: ymax
                    }
                },
                cursor: {
                    zoom: true,
                    show: true
                }
            };
            var plot1 = $.jqplot('chart1', [goog1], opts);



        });

    </script>
</head>
<body>
    <div class="container-fluid">
        <div class="row">
            <div class="col">
                <div id="chart1" style="width : 100%"></div>
            </div>
        </div>
    </div>
    <div class="container-fluid">
        <div class="row">
            <div class="col">
                <div id="chart2" style="width : 100%"></div>
            </div>
        </div>
    </div>
</body>

При запуске вышеуказанного образца с часовым поясом, который имеет летнее время 3 ноября (например, (UTC-08: 00) по тихоокеанскому времени (США и Канада)), мы можем видеть, что есть две области с 1:00 до 2:00. В данных примера есть данные для двух областей, но на графике все данные, нанесенные в области1 и области2, пусты. Как мы можем это исправить?

Спасибо и с уважением Jijo

...