I can tell right away that you will have major problems due to the links pointing to localhost:8080 - that will only work if you are accessing the page from the same system as the server. Is this the version that works on your local system or is the server deployment?
When I run that script, I get a whole bunch of errors related to the localhost stuff, but the chart itself draws with no problems. On Wednesday, April 17, 2013 5:47:01 PM UTC-4, Patrick Waldo wrote: > > Great! Any help would be much appreciated. This is the source from > Firefox as it was rendered by Pone: > > > <!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"; lang="en-us"> > > > <head> > <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> > > <!-- Forces IE8+ into newest rendering engine even if on an intranet. > This has to be defined before any script/style tags. --> > <meta http-equiv="X-UA-Compatible" content="IE=edge" /> > > > <base href="http://localhost:8080/Plone/Scripts/"; /><!--[if lt IE > 7]></base><![endif]--> > > > <link rel="kss-base-url" href="http://localhost:8080/Plone/Scripts/"; /> > > > <style type="text/css" media="screen">@import url( > http://localhost:8080/Plone/portal_css/My%20Theme%202/member-cachekey6820.css) > ;</style> > <style type="text/css" media="screen">@import url( > http://localhost:8080/Plone/portal_css/My%20Theme%202/base-cachekey6361.css) > ;</style> > <link rel="stylesheet" type="text/css" media="screen" href=" > http://localhost:8080/Plone/portal_css/My%20Theme%202/collective.js.jqueryui.custom.min-cachekey2860.css"; > > /> > <style type="text/css" media="screen">@import url( > http://localhost:8080/Plone/portal_css/My%20Theme%202/columns-cachekey4224.css) > ;</style> > <link rel="stylesheet" type="text/css" media="screen" href=" > http://localhost:8080/Plone/portal_css/My%20Theme%202/resourcetinymce.stylesheetstinymce-cachekey9284.css"; > > /> > <style type="text/css">@import url( > http://localhost:8080/Plone/portal_css/My%20Theme%202/print-cachekey8109.css) > ;</style> > <style type="text/css">@import url( > http://localhost:8080/Plone/portal_css/My%20Theme%202/resourcefilterTable-cachekey3669.css) > ;</style> > <!--[if lt IE 8]> > > <link rel="stylesheet" type="text/css" media="screen" href=" > http://localhost:8080/Plone/portal_css/My%20Theme%202/IEFixes-cachekey9971.css"; > > /> > <![endif]--> > > <link rel="stylesheet" type="text/css" media="screen" href=" > http://localhost:8080/Plone/portal_css/My%20Theme%202/kupustyles-cachekey6201.css"; > > /> > <style type="text/css">@import url( > http://localhost:8080/Plone/portal_css/My%20Theme%202/resourcemy.theme2.stylesheetsmain-cachekey7764.css) > ;</style> > <style type="text/css">@import url( > http://localhost:8080/Plone/portal_css/My%20Theme%202/resourcequickupload_staticuploadify-cachekey0605.css) > ;</style> > <link rel="stylesheet" type="text/css" media="screen" href=" > http://localhost:8080/Plone/portal_css/My%20Theme%202/resourceeea.forms.edit-cachekey1681.css"; > > /> > > > <link rel="stylesheet" data-rel="kinetic-stylesheet" type="text/kss" > href=" > http://localhost:8080/Plone/portal_kss/My%20Theme%202/resourcetinymce.ksstinymce-cachekey8064.kss"; > > /> > <link rel="stylesheet" data-rel="kinetic-stylesheet" type="text/kss" > href=" > http://localhost:8080/Plone/portal_kss/My%20Theme%202/at-cachekey1077.kss"; > /> > > <script type="text/javascript" src=" > http://localhost:8080/Plone/portal_javascripts/My%20Theme%202/jquery-cachekey6992.js > "></script> > <script type="text/javascript" src=" > http://localhost:8080/Plone/portal_javascripts/My%20Theme%202/dropdown-cachekey5682.js > "></script> > <script type="text/javascript" src=" > http://localhost:8080/Plone/portal_javascripts/My%20Theme%202/sarissa-cachekey7313.js > "></script> > <script type="text/javascript" src=" > http://localhost:8080/Plone/portal_javascripts/My%20Theme%202/resourcekukit-cachekey3265.js > "></script> > <script type="text/javascript" src=" > http://localhost:8080/Plone/portal_javascripts/My%20Theme%202/resourcekukit-devel-cachekey5669.js > "></script> > <script type="text/javascript" src=" > http://localhost:8080/Plone/portal_javascripts/My%20Theme%202/tiny_mce_init-cachekey6044.js > "></script> > <script type="text/javascript" src=" > http://localhost:8080/Plone/portal_javascripts/My%20Theme%202/resourcefilterTable-cachekey4721.js > "></script> > <!--[if lt IE 8]> > > <script type="text/javascript" src=" > http://localhost:8080/Plone/portal_javascripts/My%20Theme%202/iefixes-cachekey0738.js > "></script> > <![endif]--> > > <script type="text/javascript" src=" > http://localhost:8080/Plone/portal_javascripts/My%20Theme%202/kupunoi18n-cachekey3564.js > "></script> > <script type="text/javascript" src=" > http://localhost:8080/Plone/portal_javascripts/My%20Theme%202/resourcequickupload_staticswfobject-cachekey7934.js > "></script> > <script type="text/javascript" src=" > http://localhost:8080/Plone/portal_javascripts/My%20Theme%202/resourceeea.forms.edit-cachekey2025.js > "></script> > > > <title>Scripts — Plone</title> > > <link rel="author" href="http://localhost:8080/Plone/author/"; > title="Author information" /> > <link rel="shortcut icon" type="image/x-icon" href=" > http://localhost:8080/Plone/favicon.ico"; /> > <link rel="apple-touch-icon" href=" > http://localhost:8080/Plone/touch_icon.png"; /> > > > <script type="text/javascript"> > jQuery(function($){ > $.datepicker.setDefaults( > jQuery.extend($.datepicker.regional[''], > {dateFormat: 'mm/dd/yy'})); > }); > </script> > > <link rel="home" href="http://localhost:8080/Plone"; title="Front > page" /> > > <link rel="contents" href="http://localhost:8080/Plone/sitemap"; > title="Site Map" /> > > <link rel="search" href="http://localhost:8080/Plone/search_form"; > title="Search this site" /> > > <script type="text/javascript" src="https://www.google.com/jsapi > "></script> > <script> > google.load("visualization", "1", {packages:["corechart"]}); > google.setOnLoadCallback(drawChart); > function drawChart() { > var data = google.visualization.arrayToDataTable([ > ['COUNTRY', ' COUNT'], > ['Austria', 19], > ['Belgium', 73], > ['Bulgaria', 20]] > ); var options = {width: 400, height: 600}; > var chart = new > google.visualization.BarChart(document.getElementById('chart_div')); > chart.draw(data, options);} > </script> > > > <meta name="viewport" content="width=device-width; > initial-scale=0.6666; maximum-scale=1.0; minimum-scale=0.6666" /> > <meta name="generator" content="Plone - http://plone.org"; /> > > </head> > > <body class="template-test_googleviz portaltype-plone-site site-myplone > section-Scripts" dir="ltr"> > > <div id="visual-portal-wrapper"> > > <div id="portal-top" class="row"> > <div class="cell position-0 width-full"> <!-- TODO: Temporary, this one > should be in the template that is inserted --> > <div id="portal-header"> > <p class="hiddenStructure"> > <a accesskey="2" href=" > http://localhost:8080/Plone/Scripts/test_googleviz#content";>Skip to > content.</a> | > > <a accesskey="6" href=" > http://localhost:8080/Plone/Scripts/test_googleviz#portal-globalnav";>Skip > to navigation</a> > </p> > > <div id="portal-personaltools-wrapper"> > > <h5 class="hiddenStructure">Personal tools</h5> > > <dl class="actionMenu deactivated" id="portal-personaltools"> > > <dt class="actionMenuHeader"> > <a id="user-name" href="http://localhost:8080/Plone/useractions > ">admin</a> > </dt> > <dd class="actionMenuContent"> > <ul> > <li id="personaltools-plone_setup"> > <a href="http://localhost:8080/Plone/plone_control_panel";>Site > Setup</a> > </li> > <li id="personaltools-logout"> > <a href="http://localhost:8080/Plone/logout";>Log out</a> > </li> > </ul> > </dd> > > </dl> > </div> > > > <div id="portal-searchbox"> > <form name="searchform" id="nolivesearchGadget_form" action=" > http://localhost:8080/Plone/search";> > > <div class="LSBox"> > <label class="hiddenStructure" for="nolivesearchGadget">Search > Site</label> > > <input name="SearchableText" type="text" size="18" title="Search > Site" accesskey="4" class="searchField inputLabel" id="nolivesearchGadget" > /> > > <input class="searchButton" type="submit" value="Search" /> > > <div class="searchSection"> > <input id="searchbox_currentfolder_only" class="noborder" > type="checkbox" name="path" value="/Plone/Scripts" /> > <label for="searchbox_currentfolder_only" style="cursor: > pointer"> > only in current section > </label> > </div> > > <div class="LSResult" id="LSResult" style=""><div class="LSShadow" > id="LSShadow"></div></div> > </div> > </form> > > <div id="portal-advanced-search" class="hiddenStructure"> > <a href="http://localhost:8080/Plone/search_form"; accesskey="5"> > Advanced Search… > </a> > </div> > > </div> > > <a id="portal-logo" title="Home" accesskey="1" href=" > http://localhost:8080/Plone";> > <img style="margin-left: 1em" src="my_logo.jpg" alt="" /></a> > > > <h5 class="hiddenStructure">Sections</h5> > > <ul id="portal-globalnav"><li id="portaltab-my-trends" > class="plain"><a href="http://localhost:8080/Plone/my-trends"; title="">My > Trends</a></li></ul> > > </div> > > </div> > </div> > <div id="portal-columns" class="row"> > > > > > <div id="portal-column-content" class="cell position-2 width-14"> > > <div id="viewlet-above-content"><div id="portal-breadcrumbs"> > > <span id="breadcrumbs-you-are-here">You > are here:</span> > <span id="breadcrumbs-home"> > <a href="http://localhost:8080/Plone";>Home</a> > <span class="breadcrumbSeparator"> > › > > </span> > </span> > <span id="breadcrumbs-1" dir="ltr"> > > > > <span id="breadcrumbs-current">Scripts</span> > > </span> > > </div> > </div> > > > <div class="documentEditable"> > > <div id="edit-bar"> > > > > <h5 class="hiddenStructure">Views</h5> > > <ul class="contentViews" id="content-views"> > > > <li id="contentview-folderContents" class="plain"> > <a href=" > http://localhost:8080/Plone/Scripts/folder_contents";>Contents</a> > </li> > > > <li id="contentview-local_roles" class="plain"> > <a href="http://localhost:8080/Plone/Scripts/@@sharing > ">Sharing</a> > </li> > > > </ul> > > > > > <div class="contentActions"> > > </div></div> > > > > <dl class="portalMessage info" id="kssPortalMessage" > style="display:none"> > <dt>Info</dt> > <dd></dd> > </dl> > > <div id="content"> > > <div id="chart_div"></div> > > </div> > > > > </div> > > > <div id="viewlet-below-content"> > </div> > </div> > > > </div> > > <ul id="portal-siteactions"> > > <li id="siteaction-sitemap"><a href=" > http://localhost:8080/Plone/sitemap"; accesskey="3" title="Site Map">Site > Map</a></li> > <li id="siteaction-accessibility"><a href=" > http://localhost:8080/Plone/accessibility-info"; accesskey="0" > title="Accessibility">Accessibility</a></li> > </ul> > > </div> > </body> > </html> > > > > > > On Wednesday, April 17, 2013 5:23:53 PM UTC-4, asgallant wrote: >> >> Open the page that doesn't work in a browser, view the source, and paste >> it here. I'll take a look and see what might be causing you problems there. >> >> On Wednesday, April 17, 2013 4:27:14 PM UTC-4, Patrick Waldo wrote: >>> >>> Hi, >>> >>> A bit of backround. I work with Plone 4.2.4 (CMS) and Python and wanted >>> to integrate Google Charts with an Oracle back end. Plone already has a >>> very nice package called EEA.Daviz <http://plone.org/products/eea.daviz>. >>> However, it was way more than I needed and I thought I could do it on my >>> own, so I created some page templates and Python code that wraps the >>> Javascript. On my laptop (Mac OS X) it all worked fine. >>> >>> However, once I pushed it to my server (SLES 10), BarCharts stopped >>> working. I have only tested Bar, Line and Motion charts. All I get is a >>> red error box that says "e[0].K is undefined". After googling around, I >>> found a very similar description of my problem >>> here<http://www.sebdangerfield.me.uk/2010/08/b0-is-undefined-error-when-using-googles-visualization-api/>that >>> suggests it is a Google Visualization error and the fix is to change >>> the width and height properties. However, changing the height or width did >>> not fix it. What is very strange is that, if I copy the example JS from >>> the BarChart >>> page<https://developers.google.com/chart/interactive/docs/gallery/barchart>and >>> copy it into a vanilla Zope Page Template, it works just fine. >>> However, once I wrap it in the master template (ie my theme for non-Plone >>> folks), I get the red error message again. >>> >>> So I am confused. I have the same theme installed on my laptop and it >>> did not give me any problems. I know I can display BarCharts on the server >>> without the theme in a vanilla Page Template. The one suggestion >>> >>> Can anyone point me in the right direction? >>> >>> >>> ZPT that Works: >>> >>> <html> >>> <head> >>> <script type="text/javascript" src="https://www.google.com/jsapi >>> "></script> >>> <script> >>> google.load("visualization", "1", {packages:["corechart"]}); >>> google.setOnLoadCallback(drawChart); >>> function drawChart() { >>> var data = google.visualization.arrayToDataTable([ >>> ['COUNTRY', ' COUNT'], >>> ['Austria', 19], >>> ['Belgium', 73], >>> ['Bosnia-Herzegovina', 4], >>> ['Bulgaria', 20]] >>> ); var options = { >>> title: 'Test Bar Chart'}; var chart = new >>> google.visualization.BarChart(document.getElementById('chart_div')); >>> chart.draw(data, options);} >>> </script> >>> </head> >>> >>> <body> >>> <div id="chart_div" style="width: 900px; height: 1000px;"></div> >>> </body> >>> </html> >>> >>> ZPT that does NOT work: >>> >>> <html xmlns="http://www.w3.org/1999/xhtml"; xml:lang="en" >>> xmlns:tal="http://xml.zope.org/namespaces/tal"; >>> xmlns:metal="http://xml.zope.org/namespaces/metal"; >>> xmlns:i18n="http://xml.zope.org/namespaces/i18n"; >>> lang="en" >>> metal:use-macro="context/main_template/macros/master" >>> i18n:domain="plone"> >>> >>> <metal:main fill-slot="javascript_head_slot"> >>> <script type="text/javascript" src="https://www.google.com/jsapi >>> "></script> >>> <script> >>> google.load("visualization", "1", {packages:["corechart"]}); >>> google.setOnLoadCallback(drawChart); >>> function drawChart() { >>> var data = google.visualization.arrayToDataTable([ >>> ['COUNTRY', ' COUNT'], >>> ['Austria', 19], >>> ['Belgium', 73], >>> ['Bosnia-Herzegovina', 4], >>> ['Bulgaria', 20]] >>> ); var options = { >>> title: 'Test Bar Chart'}; var chart = new >>> google.visualization.BarChart(document.getElementById('chart_div')); >>> chart.draw(data, options);} >>> </script> >>> </metal:main> >>> >>> <body> >>> <metal:main fill-slot="main"> >>> <tal:main-macro metal:define-macro="main"> >>> >>> <div id="chart_div" style="width: 900px; height: 1000px;"></div> >>> >>> </tal:main-macro> >>> </metal:main> >>> </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 http://groups.google.com/group/google-visualization-api?hl=en. For more options, visit https://groups.google.com/groups/opt_out.
![http://localhost:8080/Plone/touch_icon.png"](http://localhost:8080/Plone/touch_icon.png"){kind=link}