Hello, I have several charts that work fine when running on my local machine but stop rending NumberRangerFilter and the CategoryFilter (and others). I've gone so far as to load the examples from this page: https://developers.google.com/chart/interactive/docs/gallery/controls onto my server just to test it to no avail.
Please see the pictures below. In the first picture the "Age Filter" shows correctly as a slider, but in the second picture, with the exact same code (but launched from my web server) the Age Filter shows as text. Any thoughts as to why this might occur? Thank you! Here's the code--as I mentioned, it just copied and pasted from the Google Charts site because I thought it might be my own code that was the issue. But it's consistent. (IE 11) <!DOCTYPE html> <html> <head> <title>Google Developers</title> <link href ="//fonts.googleapis.com/css?family=Roboto:300,400,400italic,500,500italic,700,700italic|Roboto+Mono:400,700|Material+Icons" rel="stylesheet"> <link rel="stylesheet" href ="https://google-developers.appspot.com/_static/18908e5f48/css/devsite-cyan.css";> <script src ="https://google-developers.appspot.com/_static/18908e5f48/js/prettify-bundle.js";></ script> <meta name="robots" content="noindex"> <script src ="https://google-developers.appspot.com/_static/18908e5f48/js/jquery-bundle.js";></ script> <script src ="//www.google.com/jsapi?key=AIzaSyCZfHRnq7tigC-COeQRmoa9Cxr0vbrK6xw"></ script> <script src ="https://google-developers.appspot.com/_static/18908e5f48/js/framebox.js";></ script> </head> <body class="devsite-layout-docs devsite-framebox "> <p style="display: none; height: 0; width: 0">This is a snippet from developers.google.com</p> <script type="text/javascript" src ="https://www.gstatic.com/charts/loader.js";></script> <div id="dashboard_div" style="border: 1px solid #ccc; margin-top: 1em"> <p style="padding-left: 1em"><strong>Donuts eaten per person</strong></p> <table class="columns"> <tr> <td> <div id="slider_div" style="padding-left: 15px"></div> </td><td> <div id="categoryPicker_div"></div> </td> </tr><tr> <td> <div id="chart_div" style="padding-top: 15px"></div> </td><td> <div id="table_div" style="padding-top: 30px"></div> </td> </tr> </table> </div> <script type="text/javascript"> google.charts.load('current', {'packages':['corechart', 'table', 'gauge', 'controls']}); google.charts.setOnLoadCallback(drawMainDashboard); function drawMainDashboard() { var dashboard = new google.visualization.Dashboard( document.getElementById('dashboard_div')); var slider = new google.visualization.ControlWrapper({ 'controlType': 'NumberRangeFilter', 'containerId': 'slider_div', 'options': { 'filterColumnIndex': 2, 'ui': { 'labelStacking': 'vertical', 'label': 'Age Filter:' } } }); var categoryPicker = new google.visualization.ControlWrapper({ 'controlType': 'CategoryFilter', 'containerId': 'categoryPicker_div', 'options': { 'filterColumnIndex': 1, 'ui': { 'labelStacking': 'vertical', 'label': 'Gender Selection:', 'allowTyping': false, 'allowMultiple': false } } }); var pie = new google.visualization.ChartWrapper({ 'chartType': 'PieChart', 'containerId': 'chart_div', 'options': { 'width': 300, 'height': 300, 'legend': 'none', 'chartArea': {'left': 15, 'top': 15, 'right': 0, 'bottom': 0}, 'pieSliceText': 'label' }, 'view': {'columns': [0, 3]} }); var table = new google.visualization.ChartWrapper({ 'chartType': 'Table', 'containerId': 'table_div', 'options': { } }); var data = google.visualization.arrayToDataTable([ ['Name', 'Gender', 'Age', 'Donuts eaten'], ['Michael' , 'Male', 12, 5], ['Elisa', 'Female', 20, 7], ['Robert', 'Male', 7, 3], ['John', 'Male', 54, 2], ['Jessica', 'Female', 22, 6], ['Aaron', 'Male', 3, 1], ['Margareth', 'Female', 42, 8], ['Miranda', 'Female', 33, 6] ]); dashboard.bind([slider, categoryPicker], [pie, table]); dashboard.draw(data); } </script> <input class="google-analytics-id-json" type="hidden" value="{"dimensions": {"dimension6": null, "dimension5": "en", "dimension3": false, "dimension8": "scriptsafe", "dimension1": "Signed out"}, "gaid": "UA-24532603-1"}"> <input class="google-analytics-id-json" type="hidden" value="{"dimensions": {}, "gaid": "UA-47037920-1"}"> <script> var dataLayer = [{"freeTrialEligibleUser": "False", "userCountry": "US", "language": {"requested": "en", "served": null}, "projectName": null, "scriptsafe": "scriptsafe", "signedIn": "False", "internalUser": "False"}]; </script> <script> window.onload = function() { // Initialize the settings variables we get from the server side devsite.settings.initSettings({'FULL_SITE_SEARCH_ENABLED': 1, 'ENABLE_BLOCKED_VIDEO_PLACEHOLDER': 0, 'VERSION_HASH': '18908e5f48', 'SITE_NAME': 'devsite', 'HISTORY_ENABLED': 1, 'ENABLE_BLOCKED_LINK_TOOLTIP': 0, 'ALLOWED_HOSTS': ['.android.com', '.anvato.com', '.apigee.com', '.appspot.com', '.dialogflow.com', '.gonglchuangl.net', '.google.cn', '.google.com', '.googleplex.com', '.nest.com', '.openthread.io', '.openweave.io', '.orbitera.com', '.tensorflow.org'], 'BLOCK_RSS_FEEDS': 0, 'SCRIPTSAFE_DOMAIN': 'google-developers.appspot.com'} || {}); // DevsiteUtilParams rely on devsite.settings. devsite.utils.initDevsiteUtilParams('https://google-developers.appspot.com/' , devsite.settings['ALLOWED_HOSTS'].concat('youtube.com')); devsite.permissions.init({"f62218c009ec029abef196bba5aa34cf": true, "098dafe57affddc137df300142652cfd": false, "8e03e230de0bd8a6fe173fdf172e8b3f": true, "cb025a64a50094835616312f4774a53d": true, "51470233c56fc1fde50f00b73c52b216": false, "d169d485cf24243a263783dbe42029b1": true, "039e5d84b87fd75807ffb37b7f1bbf2c": true, "752953480de00a336d911a46966cc16d": false, "700def1a83e356c06c0925afb05de4b0": false, "6749dcb526ce9bde6993550c7d928d24": true}); devsite.base.init(null, null, top, false); devsite.analytics.InitAnalytics(true); } </script> </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/90f48db0-279b-43c5-9b19-ec3290221859%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
