d3 图表和 google 字体在 github 页面上不可见

d3 chart and google font not visible on github page

我上传了一个页面到 Github 和 HTML、CSS 和 Jquery 和 Jquery UI 运行很好。但是,d3 图表没有 运行。 (PS:图表是隐藏的,点击中间的卡片就可以看到。d3图表上的数据是手动输入的,没有链接到外部数据文件。)

当你点击中间(黑色)卡片时,你可以在 the original page 上看到。

the github page 上,如果您单击中间的卡片,则会出现折叠的 css 容器,但没有图表:(。 在Github页面,除了d3问题,我看到我用的Google字体(Lato)也没有上传。

我是 Github 的新手,我可能缺少一些明显的东西。我将整个文件上传为 html 文件(而不是 css 和 js 脚本的单独文件夹。

糟糕 找到了我自己的问题的线索和(不完整的)答案:这是我的 Chrome 浏览器。我试图弄清楚发生了什么,我的 chrome 浏览器上有一个东西说“此页面正在尝试加载不受信任的脚本”。我点开说"yes",我要加载它,它加载了。图形弹出。字体仍然无法加载,但没关系。这不是什么大问题。 (更新:感谢 Stephen,他的评论解释了为什么会发生这种情况。)

此外,我刚刚在我的存储库中创建了一个包含 d3 基本代码的文件夹并链接到它(而不是像以前那样将其链接到外部)这解决了这个问题,我可以很容易地看到图表。我将继续对 Google 字体执行相同的操作(将其上传到存储库)。

无论如何谢谢,请忽略这个问题:)

更新回复:Google字体问题:发布问题后大约 2 小时,我已将字体上传到文件夹中;那没有用。

然后我回到代码...好吧,这是一个我不好意思承认的简单错误:(我没有正确关闭一个样式标签,所以字体没有读取。我一d 修复了这个问题,它运行完美。(我之前在 Tumblr 上托管过相同的页面,所以他们可能有一些事情发生,这些错误被他们的系统以某种方式自动发现并纠正)。

现在一切都解决了:)

您遇到了 https 问题(尝试在 https 站点上加载 http 资产)。

与其将协议定义为您引用资产的 http://https://,不如尝试使用与协议无关的 //

这可能是因为 github 页面使用的是 HTTPS 但字体 URL 是 HTTP。

您能否尝试通过删除 http: 来更改 URL 像这样,

@import url(//fonts.googleapis.com/css?family=Hind:300,500);

<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Hind:300,500">