Мой highart не отображает значения?он отображает ось х, но не значения сплайн-графика? - PullRequest
0 голосов
/ 07 февраля 2019

выделенный текст Если бы кто-нибудь мог указать мне правильное направление. Я верю, что я близок.моя верхняя диаграмма отображается с правильными значениями оси x, но сам сплайн-график не отображается на верхней диаграмме.Я генерирую значения json, но не уверен, что они закодированы в последовательные данные: [данные] в старших диаграммах?

 $.getJSON("/saas/js/OMLine.php", function(json) {

  $('#OMLine').highcharts({

 //Highcharts.chart('OMLine', {

legend: {
    layout: "vertical",
    align: "right",
    verticalAlign: "middle",
    marginTop: 50,
     marginBottom: 80
},

exporting:{enabled:false},



title: {
    text: 'Operating Margin'
},


yAxis: {
    min: null,
    allowDecimals: true,
    title: {
        text: ''
    },
    labels: {
        format: '${value}'
    },
},

chart: {
    renderTo: 'chart',
    type: 'spline'
},

plotOptions: {
    series: {
        lineWidth: 3,
        marker: {
            fillColor: '#3195d2',
            lineWidth: 2,
            lineColor: '#fff',
            radius: 6
        }
    }
},

credits: {
  enabled: false
},



colors: ['#3195d2'],

 xAxis: {

    categories:json [0]['data']

},



 series: [{
name: 'Operating Margin',
type: 'spline',
    data:  json[0]['data']

  }]



    });

    });

/ --------------------------------- Вверху находится страница .js --- /

 <?php
 session_start();
 require_once '../authenticate/tests/dbconnect.php';

 $displayMonth = $_SESSION["selectedMonth"];
 //echo $displayMonth;
 $displayYear = $_SESSION["selectedYear"];
 //echo $displayYear;

 $xaxis = array();
 $xaxis_linerows = array();


 for ($i = 1; $i <= 12; $i++) {

     if($displayMonth == 1){
         $axisDisplayMonth = "Jan";
     } else if($displayMonth == 2){
         $axisDisplayMonth = "Feb";
     } else if($displayMonth == 3){
         $axisDisplayMonth = "Mar";
     } else if($displayMonth == 4){
         $axisDisplayMonth = "Apr";
     } else if($displayMonth == 5){
         $axisDisplayMonth = "May";
     } else if($displayMonth == 6){
         $axisDisplayMonth = "Jun";
     } else if($displayMonth == 7){
         $axisDisplayMonth = "Jul";
     } else if($displayMonth == 8){
         $axisDisplayMonth = "Aug";
     } else if($displayMonth == 9){
    $axisDisplayMonth = "Sep";
     } else if($displayMonth == 10){
    $axisDisplayMonth = "Oct";
     } else if($displayMonth == 11){
    $axisDisplayMonth = "Nov";
     } else if($displayMonth == 12){
    $axisDisplayMonth = "Dec";
     }


 $query=mysqli_query($conn,"SELECT * FROM `PNLAVG` WHERE `month` =           '".$displayMonth."' AND `year` = '".$displayYear."' AND `xeroOrgID` = '".$_SESSION["companyName"]."' AND `month` <> 0");
      $col = mysqli_fetch_assoc($query);
 $colfrac = number_format($col['OM'],2);
 //echo $colfrac;
 $xaxis_linerows['data'][]  =  $colfrac;


 $xaxis['data'][] = $axisDisplayMonth."-".substr($displayYear, 2);
     $displayMonth = $displayMonth - 1;
     if($displayMonth == 0){
    $displayMonth = 12;
    $displayYear = $displayYear - 1;
     }
 } 

 $xaxis_linerows['data'] = array_reverse($xaxis_linerows['data']);
 //print_r( $xaixs_linerows['data']);
 $xaxis['data'] = array_reverse($xaxis['data']);

 $result = array();

 array_push($result,$xaxis);
 array_push($result,$xaxis_linerows);


 print json_encode($result);
 //print json_encode($xaixs_linerows);
 //JSON_NUMERIC_CHECK
 ?>

/ ---- нажатие на страницу PHPзначения json --- /

Результат кодирования json

[{
    "data": ["Jun-17", "Jul-17", "Aug-17", "Sep-17", "Oct-17", "Nov-17", "Dec-17", "Jan-18", "Feb-18", "Mar-18", "Apr-18", "May-18"]
}, {
    "data": ["-2.46", "-0.27", "0.83", "-1.58", "-0.60", "0.65", "0.06", "-0.83", "0.07", "0.26", "0.16", "0.24"]
}]

1 Ответ

0 голосов
/ 08 февраля 2019

Мне удалось воспроизвести вашу диаграмму, используя JSON, который вы разместили в комментариях.Проблема в том, что вы передаете строки вместо цифр в series.data.Более того, "3,547.33" не является допустимым числом в js, оно должно быть просто 3547.33.Проверьте код и демоверсию, размещенную ниже.

Код:

var json = '[{"data":["Feb-18","Mar-18","Apr-18","May-18","Jun-18","Jul-18","Aug-18","Sep-18","Oct-18","Nov-18","Dec-18","Jan-19"]},{"data":[3547.33,3090.58,3320.84,5817.88,27046.50,12912.20,8289.36,7493.51,7493.73,6493.29,3142.83,4003.42]}]';

var data = JSON.parse(json);

Highcharts.chart('container', {
  chart: {
    renderTo: 'chart',
    type: 'spline'
  },
  legend: {
    layout: "vertical",
    align: "right",
    verticalAlign: "middle",
    marginTop: 50,
    marginBottom: 80
  },
  exporting: {
    enabled: false
  },
  title: {
    text: 'Operating Margin'
  },
  yAxis: {
    min: null,
    allowDecimals: true,
    title: {
      text: ''
    },
    labels: {
      format: '${value}'
    },
  },
  plotOptions: {
    series: {
      lineWidth: 3,
      marker: {
        fillColor: '#3195d2',
        lineWidth: 2,
        lineColor: '#fff',
        radius: 6
      }
    }
  },
  credits: {
    enabled: false
  },
  colors: ['#3195d2'],
  xAxis: {
    categories: data[0].data
  },
  series: [{
    name: 'Operating Margin',
    type: 'spline',
    data: data[1].data
  }]
});
<script src="https://code.highcharts.com/highcharts.js"></script>
<div id="container"></div>

Демонстрация:

Справочник по API:

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...