Learn, Share, Build

240
September 29, 2017, at 8:09 PM

Trying with all my best but I just can't figure this out... I want a user to search a genename in a database. Then update a google bubble chart with the new genename data. Documentation: [https://developers.google.com/chart/interactive/docs/gallery/bubblechart][1]

I already implanted the ajax part. So updating the bubble chart with new data after a search is what has to be done somehow....

HTML

<html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript">
      google.charts.load('current', {'packages':['corechart']});
      google.charts.setOnLoadCallback(drawSeriesChart);
    function drawSeriesChart() {
      var jsonData = $.ajax({
        url: "getData.php",
        dataType: "json",
        async: false
        }).responseText;

      var data = google.visualization.arrayToDataTable(jsonData);
      var chart = new google.visualization.BubbleChart(document.getElementById('series_chart_div'));
      chart.draw(data, options);
    }
      var options = {
        title: 'random title',
        hAxis: {title: 'horizontal axis'},
        vAxis: {title: 'vertical axis'},
        bubble: {textStyle: {fontSize: 11}}
      };

    }
</script>
  </head>
    <body>
        <form action="getData.php" method="post">
          Genename:<input type="text" name="gene" value=""><br>
          <input type="submit" value="Submit"> 
        </form>
        <div id="series_chart_div" style="width: 900px; height: 500px;"></div>
    </body>
</html>

PHP

<?php
$search_value=$_POST["gene"];
$mysqli = new mysqli('localhost','root','usbw','mydb');
$myArray = array();
if ($result = $mysqli->query("SELECT * FROM transcriptome WHERE genename LIKE '%$search_value%'")) {
    while($row = $result->fetch_row()) {
            $myArray[] = $row;

    } //json encode and return to chart.
    //this is how the data looks like hardcoded without the ajax part "['".$row['genename']."', 2, ".$row['TA11MEAN'].", 'control', ".$row['TA11STD']."],";
//2 is position on x-axis + control is groupname
}
$result->close();
$mysqli->close();
?>

Many thanks in advance :)

LAST QUESTIONS
All questions
Rent Charter Buses Company
POPULAR ONLINE
jQuery Categories

typeof object but not array

How can we include php files without specifying the subfolder path

Ignore white-space when capturing text between parentheses

Get city name using geolocation and redirect to url

Execute user entered Python commands from Tkinter?

READ ALSO
Learn, Share, Build
HTML

Learn, Share, Build

I am looking to replace for "mailto:" that redirect users to their outlook account in browser and do new email with the email in the link

 19
Learn, Share, Build
HTML

Learn, Share, Build

I have a list of variables (for example: userList = [user1, user2, user3

 19
Learn, Share, Build
HTML

Learn, Share, Build

I have a contact form that is near the bottom of the page, and requires scrolling to get to; when the form is submitted, the page is reloaded, and I need for the page to go to an anchor, at the contact formWhen I change the action of the BeginForm, the '#' within...

 16
Learn, Share, Build
HTML

Learn, Share, Build

I am having difficulty in understanding as to why my search of a table column is always showing the first row and the matched row after that? Even though the keyword doesn't match the cell in row 1 it will always show on top? I have gone through my code several...

 23