Построение графика Highcharts из данных mysql

283
14 сентября 2021, 05:10

Всем привет, имеется график на хайтчарте в котором график строит диаграмму на основе данных mysql, и все было прекрасно пока я не решил добавить вывод даты по оси Х, с тех пор уже неделю не могу разобратся с переводом форматы даты с php на javascript.Абсолютно все удалось реализовать что требовалось кроме етого, прошу помочь

require 'connect.php';
$SQL1 =     "select * from `cena` left join `cnc` on `cena`.`cher` = `cnc`.`detal` left join `chertesh` on `cnc`.`detal`=`chertesh`.`id` left join `smena` on cnc.smena = `smena`.`s_id` WHERE `cena`.`operaciya` = `cnc`.`operaciya`  and (cher = $detal)    limit 1";
$result4 = mysql_query($SQL1);
$data4 = array();
while ($row = mysql_fetch_array($result4)) {
   $ch[] = $row['ch'];
}
?>
<!1 операция >
<?php
require 'connect.php';
$SQL1 =     "select * from `cena` left join `cnc` on `cena`.`cher` = `cnc`.`detal` left join `chertesh` on `cnc`.`detal`=`chertesh`.`id` left join `smena` on cnc.smena = `smena`.`s_id` WHERE `cena`.`operaciya` = `cnc`.`operaciya`  and (cher = $detal) and `cnc`.`operaciya`= 1 and  MONTH(`date`) = MONTH(NOW()) AND YEAR(`date`) = YEAR(NOW()) order by date";
$result1op = mysql_query($SQL1);
$data1op = array();
while ($row = mysql_fetch_array($result1op)) {
   $col1op[] = $row['colvodetal'];
}
$result1op = mysql_query($SQL1);
$data1op = array();
while ($row = mysql_fetch_array($result1op)) {
   $brak1op[] = $row['brakop']+ $row['brakotk'];
}
$SQL1date =     "select  UNIX_TIMESTAMP(date) as `date` from `cena` left join `cnc` on `cena`.`cher` = `cnc`.`detal` left join `chertesh` on `cnc`.`detal`=`chertesh`.`id` left join `smena` on cnc.smena = `smena`.`s_id` WHERE `cena`.`operaciya` = `cnc`.`operaciya`  and (cher = $detal) and `cnc`.`operaciya`= 1 and  MONTH(`date`) = MONTH(NOW()) AND YEAR(`date`) = YEAR(NOW()) order by date";
$result1op = mysql_query($SQL1date);
$data1op = array();
while ($row = mysql_fetch_array($result1op)) {
   $date1op[] = $row['date'];;
} 
$SQL1ch =     "select cnc.detal, sum(colvodetal), cnc.operaciya, cena.translate, chertesh.ch from `cena` left join `cnc` on `cena`.`cher` = `cnc`.`detal` left join `chertesh` on `cnc`.`detal`=`chertesh`.`id` left join `smena` on cnc.smena = `smena`.`s_id` WHERE `cena`.`operaciya` = `cnc`.`operaciya`  and (cher = $detal) and `cnc`.`operaciya`= 1 and  MONTH(`date`) = MONTH(NOW()) AND YEAR(`date`) = YEAR(NOW()) limit 1";
$result1op = mysql_query($SQL1ch);
$sum1op = array();
while ($row = mysql_fetch_array($result1op)) {
   $translate1op[] = $row['translate'];
   $sum1op[] = $row['sum(colvodetal)'];
}
?>

и код самого хайчарта 

<!1 операция >
<div id="container" style="min-width: 500px; height: 400px; margin: 0 auto"></div>
<script type="text/javascript">
Highcharts.chart('container', {
    title: {
        text: '<?php echo join($ch, ','); ?>'
    },
        chart: {
        scrollablePlotArea: {
            minWidth: 700
        }
    },
    subtitle: {
        text: '<?php echo join($translate1op, ','); ?> <?php echo join( $sum1op, ','); ?>шт.'
    },
 xAxis: {
     type: 'datetime',
    data: [<?php echo join($date1op, ',') ?>],
    labels: {
        formatter: function() {
              return Highcharts.dateFormat('%a %d %b', this.value);
         }

},
   },
    series: [{
        name: `Сделано`,
        data: [<?php echo join($col1op, ','); ?>]
    }, {
        name: 'Брак',
        data: [<?php echo join($brak1op, ','); ?>]
    },],
  yAxis: [{
        title: {
            text: null
        },
        labels: {
            align: 'left',
            x: 3,
            y: 16,
            format: '{value:.,0f}'
        },
        showFirstLabel: false
    }, { 
        linkedTo: 0,
        gridLineWidth: 0,
        opposite: true,
        title: {
            text: null
        },
        labels: {
            align: 'right',
            x: -3,
            y: 16,
            format: '{value:.,0f}'
        },
        showFirstLabel: false
    }],
    legend: {
        align: 'left',
        verticalAlign: 'top',
        borderWidth: 0
    },
    tooltip: {
        shared: true,
        crosshairs: true
    },

    responsive: {
        rules: [{
            condition: {
                maxWidth: 500
            },
            chartOptions: {
                legend: {
                    layout: 'horizontal',
                    align: 'center',
                    verticalAlign: 'bottom'
                }
            }
        }]
    }
});
    </script>

<script type="text/javascript">
Highcharts.chart('container', {
    title: {
        text: 'Вал ЗД2.003Д.'
    },
        chart: {
        scrollablePlotArea: {
            minWidth: 700
        }
    },
    subtitle: {
        text: '1 токарная 1287шт.'
    },
 xAxis: {
     type: 'datetime',
    data: [1569888000,1569888000,1569974400,1570579200,1570665600,1570665600,1570752000,1570752000,1570838400,1570838400,1570924800,1570924800,1571011200,1571011200,1571097600],
    labels: {
        formatter: function() {
              return Highcharts.dateFormat('%a %d %b', this.value);
         }

},
   },
    series: [{
        name: `Сделано`,
        data: [116,110,25,20,73,102,100,102,108,80,61,108,70,110,102]
    }, {
        name: 'Брак',
        data: [0,0,0,0,4,0,0,0,0,0,0,0,0,0,0]
    },],
  yAxis: [{ // left y axis
        title: {
            text: null
        },
        labels: {
            align: 'left',
            x: 3,
            y: 16,
            format: '{value:.,0f}'
        },
        showFirstLabel: false
    }, { // right y axis
        linkedTo: 0,
        gridLineWidth: 0,
        opposite: true,
        title: {
            text: null
        },
        labels: {
            align: 'right',
            x: -3,
            y: 16,
            format: '{value:.,0f}'
        },
        showFirstLabel: false
    }],
    legend: {
        align: 'left',
        verticalAlign: 'top',
        borderWidth: 0
    },
    tooltip: {
        shared: true,
        crosshairs: true
    },

    responsive: {
        rules: [{
            condition: {
                maxWidth: 500
            },
            chartOptions: {
                legend: {
                    layout: 'horizontal',
                    align: 'center',
                    verticalAlign: 'bottom'
                }
            }
        }]
    }
});
    </script>
```````
Answer 1

В целом @teran был абсолютно прав все решилось чтением документации, дату через UNIX_TIMESTAMP(date) взял из mysql и в самом скрипте все данные упорядочил по сериям в чем собственно и была ошибка. Рабочий скрипт теперь выглядет вот так, не отличный но и не ужасный


Highcharts.chart('container', {
    chart: {
        type: 'line'
    },
    title: {
        text: '<?php echo join($ch, ','); ?>'
    },
    subtitle: {
        text: '<?php echo join($translate1op, ','); ?> <?php echo join( $sum1op, ','); ?>шт.'
    },
    xAxis: {
        type: 'datetime',
        dateTimeLabelFormats: { 
            month: '%e. %b',
            year: '%b'
        },
        title: {
            text: 'Дата'
        }
    },
    yAxis: {
        title: {
            text: 'Количество (шт.)'
        },
        min: 0
    },
   tooltip: {
        headerFormat: '<b>{series.name}</b><br>',
        pointFormat: '{point.x:%e. %b}: {point.y:.2f} m'
    },
     plotOptions: {
        line: {
            dataLabels: {
                enabled: true
            },
            enableMouseTracking: false
        }
    },
    colors: ['#6CF', '#f7a35c', '#06C', '#036', '#000'],
    series: [{
        name: "Годная продукция",
        data: 
            [<?php echo join($operaciya1, ',') ?>]
    }, {
        name: "Брак",
        data: [<?php echo join($operaciya1br, ',') ?>]
    },],
    responsive: {
        rules: [{
            condition: {
                maxWidth: 500
            },
            chartOptions: {
                plotOptions: {
                    series: {
                        marker: {
                            radius: 2.5
                        }
                    }
                }
            }
        }]
    }
});
    </script>

READ ALSO
Какой алгоритм работы у array_uintersect?
PHP

Какой алгоритм работы у array_uintersect?

В продолжение темы: Как найти нечеткие совпадения в двух массивах?

 128
phpmailer не работает,Помогите
PHP

phpmailer не работает,Помогите

Fatal error: Uncaught phpmailerException: Could not execute: /usr/sbin/sendmail in W:\domains\Arams-Luggageloc\layouts\default\phpmailer\class

 116
как преобразовать. почему строки не выводятся?
PHP

как преобразовать. почему строки не выводятся?

$person - массив, а вы пытаетесь распечать, как текст

 138
Вызов нового метода анонимного класса
Java

Вызов нового метода анонимного класса

Как можно вызвать метод kopo() в методе main, если данный метод не существует в Lopzik{} а внедрен во время определения анонимного класса? Или придется...

 114