使用Javascript& amp;创建双极图表PHP [英] Creating a bipolar chart using Javascript & PHP

查看:66
本文介绍了使用Javascript& amp;创建双极图表PHP的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我是PHP&的新手Javascript因此可能有很多菜鸟错误 - 我试图将4个php变量(例如'温和活跃')传递给具有指定值的Javascript,然后在Javascript图表上绘制它们。关于我哪里出错的任何建议?图表的标签永远不会移动,例如Active&反思,因为它们是对立的,它们的价值保持在维度1。将值传递给图表的最有效方法是什么?在此先感谢。

I'm new to PHP & Javascript hence probably a lot of rookie errors - I am trying to pass in 4 php variables such as 'mildly active' to Javascript with assigned values and then plot them on the Javascript chart. Any advice as to where I am going wrong? The labels of the chart will never move such as Active & Reflective as they are opposites and their value is held in dimension1. What would be the most effective way of passing the values to the chart? Thanks in advance.

<?php

    $dbQuery = $db->prepare("select dimension1, dimension2, dimension3, dimension4 FROM indexLearningStyle WHERE studentNumber = '".$currentUser."'");
    $dbQuery-> execute();

    while ($dbRow = $dbQuery->fetch (PDO::FETCH_ASSOC)) {
    $dimension1 = $dbRow["dimension1"];
    $dimension2 = $dbRow["dimension2"];
    $dimension3 = $dbRow["dimension3"];
    $dimension4 = $dbRow["dimension4"]; 

    }

    $stronglyActive = 0;
    $moderatelyActive = 0.16;
    $mildlyActive = 0.32;

    $stronglyReflective = 1.0;
    $moderatelyReflective = 0.84;
    $mildlyReflective = 0.68;

    $stronglySensing = 0;
    $moderatelySensing = 0.16;
    $mildlySensing = 0.32; 

    $stronglyIntuitive = 1.0;
    $moderatelyIntuitive = 0.84;
    $mildlyIntuitive = 0.68;

    $stronglyVisual = 0;
    $moderatelyVisual = 0.16;
    $mildlyVisual = 0.32;

    $stronglyVerbal = 1.0;
    $moderatelyVerbal = 0.84;
    $mildlyVerbal = 0.68;

    $stronglySequential = 0;
    $moderatelySequential = 0.16;
    $mildlySequential = 0.32;

    $stronglyGlobal = 1.0;
    $moderatelyGlobal = 0.84;
    $mildlyGlobal = 0.68;



  ?>
  </body>

  <body class="">

  <br><br>
        <div id="studentILS">
        </div>
  </div>
  <br><br><br>


<!-- scripts -->
<script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
<script src="cssBipolarChart.js"></script>

<script>

    var dimension1 = <?php $dimension1 ?>;
    var dimension2 = <?php $dimension2 ?>;
    var dimension3 = <?php $dimension3 ?>;
    var dimension4 = <?php $dimension4 ?>;

    var stronglyActive = <?php $stronglyActive ?>;
    var moderatelyActive = <?php $moderatelyActive ?>;
    var mildlyActive = <?php $mildlyActive ?>;

    var stronglyReflective = <?php $stronglyReflective ?>;
    var moderatelyReflective = <?php $moderatelyReflective ?>;
    var mildlyReflective = <?php $mildlyReflective ?>;

    var stronglySensing = <?php $stronglySensing ?>;
    var moderatelySensing = <?php $moderatelySensing ?>;
    var mildlySensing = <?php $mildlySensing ?>;

    var stronglyIntuitive = <?php $stronglyIntuitive ?>;
    var moderatelyIntuitive = <?php $moderatelyIntuitive ?>;
    var mildlyIntuitive = <?php $mildlyIntuitive ?>;

    var stronglyVisual = <?php $stronglyVisual ?>;
    var moderatelyVisual = <?php $moderatelyVisual ?>;
    var mildlyVisual = <?php $mildlyVisual ?>;

    var stronglyVerbal = <?php $stronglyVerbal ?>;
    var moderatelyVerbal = <?php $moderatelyVerbal ?>;
    var mildlyVerbal = <?php $mildlyVerbal ?>;

    var stronglySequential = <?php $stronglySequential ?>;
    var moderatelySequential = <?php $moderatelySequential ?>;
    var mildlySequential = <?php $mildlySequential ?>;

    var stronglyGlobal = <?php $stronglyGlobal ?>;
    var moderatelyGlobal = <?php $moderatelyGlobal ?>;
    var mildlyGlobal = <?php $mildlyGlobal ?>;



    var studentResults = [
        ["Active", "Reflective", 0],
        ["Sensing", "Intuitive", 0.16],
        ["Visual", "Verbal", 0.32],
        ["Sequential", "Global", 0.68],
        ["Sequential", "Global", 0.84],
        ["Sequential", "Global", 1.0]
    ]

    $(document).ready(function() {
        $("#studentILS").drawCSSBipolarChart({
            data: studentResults,
            bipolar: true
        })
    })
</script>

推荐答案

正如@Lawrence所说,你应该使用array&正确的标签。

As @Lawrence mentioned you should use array & correct tag.

以下是您应该尝试的简单代码:

Here is the simple code you should try:

<?php
    //Fetch following values and assign to array
    $stronglyGlobal = 1.0;
    $moderatelyGlobal = 0.84;
    $mildlyGlobal = 0.68;
?>
<!-- Correct opening/closing body-->
<div id="studentILS"></div>
<!-- scripts -->
<script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
<script src="cssBipolarChart.js"></script>

<script>
    //Loop through PHP array & print var in JavaScript
    var stronglyGlobal = <?php echo $stronglyGlobal ?>; //Notice echo over here
    var moderatelyGlobal = <?php echo $moderatelyGlobal ?>;
    var mildlyGlobal = <?php echo $mildlyGlobal ?>;

    var studentResults = [
        ["Sequential", "Global", mildlyGlobal], //Updated values assigned
        ["Sequential", "Global", stronglyGlobal],
        ["Sequential", "Global", moderatelyGlobal]
    ]

    $(document).ready(function() {
        $("#studentILS").drawCSSBipolarChart({
            data: studentResults,
            bipolar: true
        })
    })
</script>

希望这个答案会给你提示。

Hope this answer will give you hint.

这篇关于使用Javascript&amp; amp;创建双极图表PHP的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆