Hi All,

Can please advise and teach me is there any possibilities to create the 
baseline in google chart based on the mysql data. Right now I can only 
create the fix baseline; meaning keyin the baseline value in the coding 
instead of taking from mysql data.
Hereby i include the coding and also the google chart image for your 
reference. The baseline is in red colour.

Need your kind help here. Thank you in advance! 

My coding is like this:


      <script type = "text/javascript" src = 
"https://www.gstatic.com/charts/loader.js";>
      </script>
      <script type = "text/javascript" src = "https://www.google.com/jsapi";>
      </script>
      <script type = "text/javascript">
         google.charts.load('current', {packages: ['corechart']});     
      </script>
   </head>
   

      <div id = "container" style = "width: 550px; height: 400px; margin: 0 
auto">
      </div>

       <script language = "JavaScript">
       function drawChart() {
      var data = google.visualization.arrayToDataTable([
         ['month', 'Performance Indicator (%)'],         
       <?php  
        $username=$_GET['username'];
        $query = "SELECT month , result_ind, target, username FROM 
performance WHERE username = $username";

        $exec = mysqli_query($db,$query);
        while($row = mysqli_fetch_assoc($exec)){

       echo "[".$row['month'].",".$row['result_ind']."],";
       }
       ?>

       ]);

            // Set chart options
            var options = {
               'title':'Month vs Performance Indicator for 2020',
                vAxis: {
                title: '%',
                baseline: 2.00,
                baselineColor: 'red'
                },
                hAxis: {
                title: 'Month'
               },
               'width':550,
               'height':400,
                pointSize: 5,
                trendlines: {
                0: {
                type: 'linear',
                color: 'purple',
                lineWidth: 5,
                opacity: 0.2,
                //visibleInLegend: true,
                  }
                } 
            };

            // Instantiate and draw the chart.
            var chart = new 
google.visualization.LineChart(document.getElementById('container'));
            chart.draw(data, options);
         }
         google.charts.setOnLoadCallback(drawChart);
      </script>


-- 
You received this message because you are subscribed to the Google Groups 
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to [email protected].
To view this discussion on the web visit 
https://groups.google.com/d/msgid/google-visualization-api/2c9b5a19-f367-49cd-aec2-af3dfa2ffb7b%40googlegroups.com.

Reply via email to