Google的嵌入式API第三方可视化无法显示图形。
我的问题页面:
http://www.yoursitename.us/tpv.html
我将组件(Git)下载到我的服务器,我相信它已正确放入/public/javascript/embed-api/components
。
以Google Analytics帐户的所有者身份登录Google Chrome。 导航到https://ga-dev-tools.appspot.com/embed-api/third-party-visualizations/页面会正确显示我的Google分析数据。
我按照页面上的说明将代码嵌入到简单的html页面中:
-Basic Dashboard (basic.html)
-Multipleviews (mv.html)and
-Interactive Charts (ic.html)
-Custom Components (cc.html)
and
-Third Party Visualizations (tpv.html)
所有显示都符合预期(需要CSS)但是,第三方可视化进行身份验证,然后显示“您以登录身份登录:”并且选择器正确显示并且功能正常但图形不显示。
Chrome开发人员的控制台显示错误,“Uncaught TypeError:无法设置属性'innerHTML'为null”。
错误图片位于http://www.yoursitename.us/images-errors/github-error-tpv.png。 上面第一部分中的第二个和第三个错误是我更改页面上的选择器的结果。
我尝试移动标签以确保元素全部加载到页面上并且没有任何区别且错误是相同的。
违规代码似乎是:
/**
* Update the activeUsers component, the Chartjs charts, and the dashboard
* title whenever the user changes the view.
*/
viewSelector.on('viewChange', function(data) {
var title = document.getElementById('view-name');
title.innerHTML = data.property.name + ' (' + data.view.name + ')';
上一个问题解决了这个问题: Embed API Third party visualization > Uncaught TypeError: Cannot set property 'innerHTML' of null (cb=gapi.loaded_0:139)
决议报告为:
“我刚刚添加了一个带有'view-name'的元素作为ID ......”
这里重复了一个类似的解决方案:Embed API Third Party Visualizations
我补充说:
<div> id="view-name"></div>
在演示HTML中的其他容器(DIV)之上。
新页面:
http://www.yoursitename.us/tpv-mod.html
现在线条图和条形图显示时尚,但是甜甜圈图表因Chrome开发人员控制台中的错误而失败:
"Uncaught TypeError: Cannot read property 'clientWidth' of null". (see above image)
这就是页面的样子:
http://www.yoursitename.us/images-errors/github-error-tpv.png.
几个小时后,我刷新了该页面,Chrome开发者控制台中没有显示任何错误。 (好奇,但也许不是问题的核心。)
为什么页面不显示甜甜圈图形?
谢谢。