Criando um gráfico bipolar usando Javascript e PHP

Eu sou novo em PHP e Javascript, portanto, provavelmente há muitos erros de iniciantes - estou tentando passar variáveis de 4 php como 'levemente ativo' para Javascript com valores atribuídos e, em seguida, plotá-las no gráfico Javascript. Algum conselho sobre onde estou indo errado? Os rótulos do gráfico nunca serão movidos, como Ativo e Reflexivo, pois são opostos e seu valor é mantido na dimensão1. Qual seria a maneira mais eficaz de passar os valores para o gráfico? Desde já, obrigado.

<?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>

questionAnswers(1)

yourAnswerToTheQuestion