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.