Tell me more ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote -3 down vote favorite

Im working on my admin panel and I'm facing a problem. I'm using a small script which outputs my server CPU usage and I want to integrate that into a javascript chart. I cant get it working.. And I want to know how to make the variable work in the javascript chart.

My PHP: 

<?php

$stat1 = file('/proc/stat'); 
sleep(1); 
$stat2 = file('/proc/stat'); 
$info1 = explode(" ", preg_replace("!cpu +!", "", $stat1[0])); 
$info2 = explode(" ", preg_replace("!cpu +!", "", $stat2[0])); 
$dif = array(); 
$dif['user'] = $info2[0] - $info1[0]; 
$dif['nice'] = $info2[1] - $info1[1]; 
$dif['sys'] = $info2[2] - $info1[2]; 
$dif['idle'] = $info2[3] - $info1[3]; 
$total = array_sum($dif); 
$cpu = array(); 
foreach($dif as $x=>$y) $cpu[$x] = round($y / $total * 100, 1);
$usedcpu = $cpu['user'] + $cpu['nice'] + $cpu['sys'];

?>

And my javascript

    <script>
    $(document).ready(function() {

        // Demo #1
        // we use an inline data source in the example, usually data would be fetched from a server
        var data = "<?php echo $usedcpu; ?>";
        function getData() {
            return data;
        }

        // setup control widget
        var updateInterval = 30;
        $("#updateInterval").val(updateInterval).change(function () {
            var v = $(this).val();
            if (v && !isNaN(+v)) {
                updateInterval = +v;
            if (updateInterval < 1)
                updateInterval = 1;
            if (updateInterval > 2000)
                updateInterval = 2000;
            $(this).val("" + updateInterval);
            }
        });

        // setup plot
        var options = {
            series: {
                shadowSize: 0,
                color: '#c0382b',
                lines: {
                    fill: true
                }
            }, // drawing is faster without shadows
            yaxis: { min: 0, max: 10 },
            xaxis: { show: false },
            grid: { backgroundColor: '#ffffff', borderColor: 'transparent' },
        };
        var plot = $.plot($("#demo-1"), [ getData() ], options);

        function update() {
            plot.setData([ getData() ]);
            // since the axes don't change, we don't need to call plot.setupGrid()
            plot.draw();
            setTimeout(update, updateInterval);
        }

        update();

    });
</script>

I hope you guys can help me, thanks in advance!

share|improve this question
 
What is the question? –  Jon Apr 29 at 23:25
 
Sorry if thats not clear, I want to make the variabe $usedcpu work in the chart –  wouterdz Apr 29 at 23:27
 
And my jQuery if you include jquery.js in your page, your javascript doesn't become jquery and it should be referred as javascript. –  Ejay Apr 29 at 23:27
 
Sorry guys, I don't use this site often! –  wouterdz Apr 29 at 23:30
 
@wouterdz: I still have no idea what kind of answer you are looking for. –  Jon Apr 29 at 23:30
show 3 more comments

closed as not a real question by tkanzakic, Rachel Gallen, Stony, Thor, pilsetnieks Apr 30 at 7:36

It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center.If this question can be reworded to fit the rules in the help center, please edit the question.

3 Answers

up vote 1 down vote

You can use PHP to write JS but not the other way around. PHP is server-side, JS is client-side.

You COULD use a .php file as a 'javascript file' by having PHP build the javascript.

Of course you would have to wrap it in a <script> block and include it via php.

<script type="text/javascript">
//Stuff
<?php 
  $someVar = 'some string';
  echo "var jsVariable = '{$someVar}';";
?>
//more stuff
</script>

Though that's pretty convoluted and can get messy fast. Why not use PHP to create JSON and interpret with JS?

share|improve this answer
 
I made a variable called data in Javascript and I guess I did it like you told me but if I want to add it in the plot (javascript) it doesnt work. –  wouterdz Apr 29 at 23:47
up vote 1 down vote

I would recommend placing your values from php into a hidden html field with unique id. Then in your javascript you can grab that value. Just one way of doing it.

share|improve this answer
 
But the way im doing it now isn't correct? Just placing the PHP variable into a js one? –  wouterdz Apr 29 at 23:57
 
Well I have never done it the way your doing it so I cannot say for sure. But it is always best to separate your javascript and php code into separate files. That would be best practice and easier for you to reuse code and fix any issues that may come up –  Yeak Apr 30 at 23:48
up vote 1 down vote

Since $usedcpu is a number that you want to use in the plot you don't want the quotes in the javascript var. The following will make a javascript variable called usedcpu that you can use in the plot code:

<script type="text/javascript">
    <php?
        echo "var usedcpu = " . $usedcpu . ";"
    ?>
</script>
share|improve this answer

Not the answer you're looking for? Browse other questions tagged or ask your own question.