Including google charts in our php application

37 views

Skip to first unread message

Marta Blasco

unread,

Nov 4, 2019, 6:23:12 AM11/4/19

to Google Visualization API

Hi,

We have a little problem with Google Charts. In our php application we have a general ccs script. The problem we have is that we'd like to change the font size of the columns bar, but css has priority. We've tried to add !important to fontsize, but no.

Can anybody help us?? Thanks for your help

We add:

And this is full code php:

$pagina = "<div id='chart_div'></div>\n";

$pagina .= "<script>\n";

$pagina .= "google.charts.load('current', {packages: ['corechart', 'bar']})\n";

$pagina .= "google.charts.setOnLoadCallback(drawAxisTickColors)\n";

$pagina .= "function drawAxisTickColors() {\n";

$pagina .= "var data = google.visualization.arrayToDataTable([\n";

switch ($barres) {

case "1":

$pagina .= "['Llegenda', '".$llegenda1."'],\n";

break;

case "2":

$pagina .= "['Llegenda', '".$llegenda1."', '".$llegenda2."'],\n";

break;

case "3":

$pagina .= "['Llegenda', '".$llegenda1."', '".$llegenda2."', '".$llegenda3."'],\n";

break;

}

$x = 0;

for ($j=0; $j<$i; $j++) {

if ((($maqui[$j][1]) > 0) OR ($maqui[$j][2])) {

$x++;

$pagina .= "['".$maqui[$j][0]."', ".$maqui[$j][1]."],\n";

}

$pagina .= "])\n";

$alcada = 40 * $x;

if ($alcada < 150) $alcada = 150; // si es poc alta no es veuen les llegendes

$pagina .= "var options = {\n";

$pagina .= "title: '".$titol."',\n";

switch ($barres) {

case "1":

$pagina .= "colors:['".$color1."'],\n";

break;

case "2":

$pagina .= "colors:['".$color1."','".$color2."','".$color3."'],\n";

break;

case "3":

break;

}

$pagina .= "height: ".$alcada.",\n";

$pagina .= "legend: {textStyle:{fontSize:12}},\n"; // llegenda a la dreta

$pagina .= "hAxis: {title: '".$titolAbaix."', minValue:0,\n";

$pagina .= "textStyle: {color:'#000', fontSize:5, bold:true},\n"; // valor de les x's

$pagina .= "titleTextStyle:{color:'#000', fontSize:5, bold:true}\n"; // llegenda peu

$pagina .= "},\n";

$pagina .= "vAxis: {title: '".$titolEsquerra."',\n";

$pagina .= "textStyle:{color:'#000', fontSize:8, bold:true},\n";

$pagina .= "titleTextStyle:{color:'#000', fontSize:8, bold:true}\n";

$pagina .= "}\n";

$pagina .= "var chart = new google.visualization.BarChart(document.getElementById('chart_div'))\n";

$pagina .= "chart.draw(data, options)\n";

$pagina .= "}\n";

$pagina .= "</script>\n";

$pagina .= "<body>\n";

$pagina .= "<div id='chart_div' style='width: 800px; height: 600px; margin: auto; margin-top: 0px;'></div>\n";

$pagina .= "</body>\n";

$pagina .= "</html>";

You can see css properties. font: 14px cGothics

If we unchecked the font of css, then it's ok

Marta Blasco

unread,

Nov 9, 2019, 7:36:26 AM11/9/19

to Google Visualization API

Nobody has found same problem?

Thanks

Reply all

Reply to author

Forward

0 new messages