簡體   English   中英

將PHP變量傳遞到flot條形圖中

[英]Passing a PHP variable into flot Bar chart

我正在嘗試將我的php變量內插到我的浮動圖表中,該數組是一個數組。 我將我的PHP變量內含JS圖表,並且對我有用,如您在圖像中所看到的:我正在嘗試使JS柱形圖的Flot柱形數據輸出相同。 有什么想法嗎?

謝謝

在此處輸入圖片說明

var data = [ 0, <?php echo '['.implode(", ", $studentages).']'?>];
var dataset = [
   { label: "Exams By Student Age", data: data, color: "#5482FF"  }
        ];
  var ticks = [ [0, "0-2"]
  ];

 var options = {
   series: {
    bars: {
        show: true
    }
  },
 bars: {
    align: "center",
    barWidth: 0.6 ,
    vertical: true ,
    show:true
 },
  xaxis: {
    axisLabel: "Exams By Student Ages",
    axisLabelUseCanvas: true,
    axisLabelFontSizePixels: 12,
    axisLabelFontFamily: 'Verdana, Arial',
    axisLabelPadding: 10,
    tickLength:0,

    ticks: ticks

},
yaxis: {
    axisLabel: "Number of Exams",
    axisLabelUseCanvas: true,
    axisLabelFontSizePixels: 12,
    axisLabelFontFamily: 'Verdana, Arial',
    axisLabelPadding: 3,

    max:20, tickSize:1,
    tickFormatter: function (v, axis) {
        return v;
    }
},
legend: {
    noColumns: 0,
    labelBoxBorderColor: "#000000",
    position: "nw"
},
grid: {
    clickable: true,
    borderWidth: 1,      

    backgroundColor: { colors: ["#ffffff", "#EDF5FF"] }
}
};

$(document).ready(function () {
$.plot($("#flot-placeholder"), dataset, options);    
$("#flot-placeholder").UseTooltip();
 });
function gd(year, month, day) {
return new Date(year, month, day).getTime();
}
var previousPoint = null, previousLabel = null;
$.fn.UseTooltip = function () {
$(this).bind("plotclick", function (event, pos, item) {
var links = [ '../../Chart/StudentTests/result.php']; 
    if (item) 
      {
           //alert("clicked");
         //  window.location = (links[item.dataIndex]); 
             window.open(links[item.dataIndex], '_blank');
             console.log(item);              
        }
     else {
        $("#tooltip").remove();
        previousPoint = null;
    }
    });
 };

   function showTooltip(x, y, color, contents) {
   $('<div id="tooltip">' + contents + '</div>').css({
    position: 'absolute',
    display: 'none',
    top: y - 40,
    left: x - 120,
    border: '2px solid ' + color,
    padding: '3px',
    'font-size': '9px',
    'border-radius': '5px',
    'background-color': '#fff',
    'font-family': 'Verdana, Arial, Helvetica, Tahoma, sans-serif',
    opacity: 10
    }).appendTo("body").fadeIn(200);
   }

這就是我使用您的代碼后得到的。 在此處輸入圖片說明

如果$studentages是整數數組,則意味着

 var data = [ 0, [1, 2, 3, 4, 5]];

這不是需要數組數組的float數據的正確格式

因此,請嘗試:

var data = $.map(<?php echo '['.implode(", ", $studentages).']'?>, function(val, idx){
    return [[idx, val]];
});
var dataset = [
    { label: "Exams By Student Age", data: data, color: "#5482FF"  }
];
var ticks = [ [0, "0-2"] ]; // expand this for each idx in data

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM