从Github repo Gist从显示bl.ocks.org [英] Make Gist from Github repo for display on bl.ocks.org

问题描述

我创建了一个数据可视化应用，并将其作为 Github页面发布。
现在，我想在 bl.ocks.org 网站上显示此内容，其中聚集了D3.js可视化。
我如何从github repo开始创建一个维护repo代码的相对依赖的gist？我需要重构所有的代码，使一个单文件应用程序，只指向CDN源？

I have created a data visualization app and posted it as a Github page. I would now like to display this on the bl.ocks.org site that aggregates D3.js visualizations. How can I start from the github repo and create a gist that maintains the relative dependencies of the repo code? Will I need to refactor all the code to make a single-file app that points to only CDN sources?

推荐答案

这是最容易学习的例子。以bl.ocks首页为例：

It's easiest to learn by example. Take the example on the bl.ocks home page:

http://bl.ocks.org/mbostock/1353700

现在看看生成它的要点，只需从最后的id号码的网址，并附上它的gist网址，例如：

Now to see the gist that generated it, just take the id number from the end of the url and appent it the gist url, like so:

http://gist.github.com/1353700

该gist包含3个文件，但两个是可选的。要显示的块的唯一要求是具有index.html。该文件应该包含一个完整的html文件与您的js脚本任何包括cdn资源，如d3。或者，您可以将JavaScript代码放在单独的文件中，并将其添加到gist，然后从index.html文件链接到该文件。

That gist contains 3 files, but two are optional. The only requirement for a block to display is to have index.html. That file should contain your a full html file with your js script any includes to cdn resources like d3. Optionally, you could put your javascript code in a separate file and add that to the gist, and then link to it from your index.html file.

如果您想要提供您的示例及其图片的说明，您还可以添加README.md和thumbnail.png。这也在bl.ocks主页上解释。

You can also add a README.md and thumbnail.png, if you'd like to provide a description of your example and an image for it. This is explained on the bl.ocks home page as well.

希望有帮助。

这篇关于从Github repo Gist从显示bl.ocks.org的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！