Fighting with formatting a Visual API Google sheet to HTML with CSS class names.
Here is the test html page <http://www.ullrichs.net/ann_test.html>. Here is the code I'm fighting with. You'll see I've tried numerous ways to format the table background to black with a larger white font. Any help would be great. --------------------------------------------------------------------------------------------------------------------------------------------------------- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> <html xmlns="http://www.w3.org/1999/xhtml";> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Announcement test</title> <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js "></script> <script type="text/javascript"> google.charts.load('current', {packages: ['corechart', 'table']}); google.charts.setOnLoadCallback(drawTable); function drawTable() { var allowHtml = true; var cssClassNames = { 'headerRow': 'Title_Table', 'tableRow': 'Black_Table', 'oddTableRow': '', 'selectedTableRow': '', 'hoverTableRow': '', 'headerCell': '', 'tableCell': '', 'rowNumberCell': '' }; var query = new google.visualization.Query( ' https://docs.google.com/spreadsheets/d/1VKa6RgeCcRrI6cZ3qD5DGgu0QA64pDTvoWDUH_igTyI/gviz/tq?gid=2001071304&headers=1' ); query.send(handleQueryResponse); } function handleQueryResponse(response) { if (response.isError()) { alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage()); return; } // setProperty(1, 1, *, {style: 'font-style:bold; font-size:22px;'}); var data = response.getDataTable(); var chart = new google.visualization.Table(document.getElementById('table_div')); chart.draw(data); } </script> <style type="text/css"> .Table_Format{ width: 800px; text-align:center; background-color:black; color:white; padding:20px; } .Title_Table { font-size: x-large; font-weight: bold; color: #FFF; background-color: #000; } .Black_Table{ font-size: large; color: #FFF; background-color: #000; } body,td,th { font-size: large; color: #FFF; background-color: #000; } body { background-color: #000; } </style> </head> <body> <div id="table_div" class="Table_Format"></div> </body> </html> -- 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 post to this group, send email to [email protected]. Visit this group at https://groups.google.com/group/google-visualization-api. To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/a1b05f6e-4e2b-4d05-a922-20520d2c07e0%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
