javascript - 谷歌图表不显示

Question

我正在尝试使用 polymer 组件，但它没有显示。元素在那里。我可以在检查器中看到它，但它只是不显示。也没有没有帮助的错误消息。我试图在 polymer 文档中重新创建 demo.html，但仍然没有任何显示。 goole-chart 元素有问题吗？

<dom-module id="stats-page">

    <style>
    code {
      color: #007000;
    }
    google-chart {
      height: 300px;
      width: 400px;
    }
    #selection-demo {
      position: relative;
      height: 300px;
    }
    #selection-chart {
      float: left;
    }
    #selection-display {
      display: inline-block;
      position: relative;
      top: 50%;
    }
  </style>

    <template>
        <!-- local DOM for your element -->
        <section>
            <h1>Stastistics Page</h1>

              <p>Here's a bar chart:</p>

              <google-chart
                type='bar'
                options='{"title": "Days in a month"}'
                cols='[{"label": "Month", "type": "string"},{"label": "Days", "type": "number"}]'
                rows='[["Jan", 31],["Feb", 28],["Mar", 31],["Apr", 30],["May", 31],["Jun", 30]]'>
              </google-chart>


            <!-- Pie Chart of Clicks per Category Selection  -->
            <h3>Clicks Per Category</h3>

            <div id="category-piechart">
                <google-chart   type="pie" 
                                id="selection-chart" 
                                options='{"title": "Clicks per Category"}' 
                                cols='[{"label": "Category", "type": "string"},{"label": "Clicks", "type": "number"}]' 
                                rows='[["Health", 31],["Jobs", 28],["Services", 31],["Shopping", 30],["Finance", 31],["Social Media", 30]]'>
                </google-chart>

            </div>
            <!-- End of Pie Chart of Clicks per Category Selection  -->

            <!-- Cicks and Logins over Time  -->
            <h3>Logins</h3>

            <div id="clicksovertime-line">
                <google-chart   type='line' 
                                options='{"title": "When do Users Login"}' 
                                cols='[{"label": "Hour", "type": "string"},{"label": "Logins", "type": "number"}]' 
                                rows='[["00", 1],["01", 0],["02", 00],["03", 02],["04", 04],["05", 06]]'>
                </google-chart>
            </div>
            <!-- End of Cicks and Logins over Time   -->

        </section>

    </template>

</dom-module>
<script>
    // element registration
    Polymer({
        is: 'stats-page',
    });

Answer 1

这个刚才也捕获了我。

尝试在前两个 [[ 之间添加一个空格。

rows='[ ["一月", 31],["二月", 28],["三月", 31],["四月", 30],["五月", 31], ["君", 30]]'

我猜 Polymer 一定认为它是用来装订的。 :)