使用非代码文件

GitHub AE supports rendering and diffing in a number of non-code file formats.

呈现图像和比较差异

GitHub AE 可显示几种常见的图像格式,包括 PNG、JPG、GIF、PSD 和 SVG。 In addition to simply displaying them, there are several ways to compare differences between versions of those image formats.'

注:如果您使用 Firefox 浏览器,则 GitHub 上的 SVG 可能无法呈现。

查看图像

You can directly browse and view images in your repository on GitHub AE:

内联图像

SVG 目前不支持内联脚本或动画。

查看差异

您可以在三种不同模式下直观比较图像:两张图滑动多层皮肤

两张图

两张图是默认模式;它让您可以快速浏览两张图像。 此外,如果图像在不同版本之间更改了大小,则会显示实际的尺寸更改。 这应在内容调整大小时变得非常明显,例如前端资源升级到更高分辨率时。

两张图

滑动

滑动可让您并排查看图像的各个部分。 不确定不同版本之间颜色是否发生变化? 将滑动滑块拖动到相关区域上并自行比较像素。

滑动

多层皮肤

当元素以很小而难以察觉的量移动时,多层皮肤真的很方便。 图标是否向左移动了两个像素? 稍微向后拖动不透明度滑块,注意内容是否移动。

多层皮肤

3D 文件查看器

GitHub AE 可托管和渲染扩展名为 .stl 的 3D 文件。

直接在 GitHub AE 上查看 STL 文件时,可以:

  • 单击并拖动以旋转模型。
  • 右键单击并拖动便可转换视图。
  • 滚动可放大和缩小。
  • 单击不同的视图模式可切换视图。

差异

查看包含 STL 文件的提交或更改集时,可以看到文件前后的差异。

默认情况下,您会在线框图中获取一切尚未更改时的视图。 添加的内容为绿色,删除的部分为红色。

线框图

也可选择 Revision Slider(版本滑块)选项,使用文件顶部的滑块在当前版本与之前的版本之间切换。

修复性能慢的问题

如果在查看器的角上看到此图标,则表示您的浏览器无法使用 WebGL 技术:

WebGL 弹出错误

为最大程度利用计算机的硬件,必须具有 WebGL。 建议尝试 ChromeFirefox 等默认启用 WebGL 的浏览器。

错误:“无法显示”

如果您的型号无效,GitHub 可能无法显示文件。 此外,超过 10 MB 的文件对 GitHub 过大,无法显示。

在其他位置嵌入您的型号

要在互联网上其他位置显示您的 3D 文件,请修改此模板并将其放入支持 JavaScript 的 HTML 页面:

<script src="https://embed.github.com/view/3d/<username>/<repo>/<ref>/<path_to_file>"></script>

例如,如果您的型号的 URL 是 github.com/skalnik/secret-bear-clip/blob/master/stl/clip.stl,则嵌入的代码是:

<script src="https://embed.github.com/view/3d/skalnik/secret-bear-clip/master/stl/clip.stl"></script>

默认情况下,嵌入的渲染器是 420 像素(宽)x 620 像素(高),但您可以在 URL 结束时将高度和宽度变量作为参数传递,以自定义输出,如 ?height=300&width=500

ref 可以是分支或个别提交的哈希(如 2391ae)。

呈现 CSV 和 TSV 数据

GitHub 支持以 .csv(逗号分隔)和 .tsv(制表符分隔)文件的形式呈现表格数据。

呈现的 CSV 示例

When viewed, any .csv or .tsv file committed to a repository on GitHub AE automatically renders as an interactive table, complete with headers and row numbering. 默认情况下,我们始终假设第一行是标题行。

您可以通过单击行号链接到特定行,或通过按住 Shift 键选择多行。 只需复制 URL 并将其发送给好友即可。

搜索数据

如果想要在数据集中查找特定值,可以在文件正上方的搜索栏中开始输入内容。 行将自动过滤:

搜索值

处理错误

有时,您可能会发现您的 CSV 或 TSV 文件未呈现。 在这些情况下,原始文本底部会出现一个错误框,提示错误可能是什么。

CSV 呈现错误消息

常见错误包括:

  • 列数不匹配。 即使单元格为空,也必须在每行中具有相同数量的分隔符
  • 超出文件大小。 我们的呈现仅适用于最大 512KB 的文件。 大于此限制的任何内容都会降低浏览器的速度。

呈现 PDF 文档

GitHub 支持呈现 PDF 文档。

呈现的 PDF 文档

目前,PDF 中的链接将被忽略。

散文文档中的呈现差异

包含散文文档的提交和拉取请求能够使用视图和呈现视图来表示这些文档。

源视图显示已输入的原始文本,而呈现的视图显示该文本在 GitHub AE 上呈现后的外观。 例如,这可能是在 Markdown 中显示 **bold** 和在呈现的视图中显示粗体之间的差异。

github/markup 支持的呈现文档支持散文呈现:

  • Markdown
  • AsciiDoc
  • Textile
  • ReStructuredText
  • Rdoc
  • Org
  • Creole
  • MediaWiki
  • Pod

用于查看渲染的散文文档的纸张图标

您可以单击 查看在提交过程中对文档的更改。

呈现的散文更改

可视化属性更改

我们提供一个描述属性更改的工具提示,与字词不同的是,这些更改在呈现的文档中不可见。 例如,如果链接 URL 从一个网站更改为另一个,我们将显示类似如下的工具提示:

呈现的散文属性更改

对更改的评论

提交评论只能逐行添加到视图内的文件。

链接到标题

其他呈现的散文文档一样,将鼠标悬停在文档的标题上会产生一个链接图标。 您可以将呈现散文差异的读者链接到特定部分。

查看复杂的差异

一些拉取请求涉及大型复杂文档的大量更改。 当更改需要太长时间来分析时,GitHub AE 不能总是生成更改的渲染视图。 如果发生这种情况,当您单击渲染按钮时,将会看到错误消息。

无法渲染视图时的消息

您仍可使用源视图来分析和评论更改。

查看 HTML 元素

我们不直接支持 HTML 文档提交的呈现视图。 某些格式(例如 Markdown)可让您在文档中嵌入任意 HTML。 这些文档在 GitHub AE 上显示时,某些嵌入式 HTML 可以在预览中显示,而某些(例如嵌入式 YouTube 视频)则不可以。

一般来说,包含嵌入式 HTML 的文档更改的呈现视图将显示对 GitHub AE 文档视图中支持元素的更改。 必须始终在呈现视图和源视图中检查对包含嵌入式 HTML 的文档的更改以确保完整性。

Mapping geoJSON files on GitHub

GitHub AE 支持在 GitHub AE 仓库中渲染 geoJSON 和 topoJSON 地图文件。 只需像平常一样提交扩展名为 .geojson.topojson 的文件。 也支持扩展名为 .json 的文件,但仅当 type 设置为 FeatureCollectionGeometryCollectiontopology 时才支持。 然后导航到 GitHub.com 上 geoJSON 文件的路径。

单击右侧的纸张图标时,您还会看到在提交时对该文件的更改。

源渲染切换屏幕截图

几何类型

GitHub AE 上的地图使用 Leaflet.js,并且支持 geoJSON 规格中列出的所有几何类型(Point、LineString、Polygon、MultiPoint、MultiLineString、MultiPolygon 和 GeometryCollection)。 TopoJSON 文件类型应为 "Topology"(拓扑),并且遵守 topoJSON 规格

样式功能

您可以传递 geoJSON 对象属性中的其他元数据,自定义功能显示的方式,例如指定特定的颜色或添加描述性图标。 选项包括:

  • marker-size - smallmediumlarge
  • marker-color - 有效的 RGB 十六进制颜色
  • marker-symbol - Maki 项目中的图标 ID 或单一英数字符(a-z 或 0-9)。
  • stroke - 多边形的边或线的颜色 (RGB)
  • stroke-opacity - 多边形的边或线的不透明度 (0.0 - 1.0)
  • stroke-width - 多边形的边或线的宽度
  • fill - 多边形内部的颜色 (GRB)
  • fill-opacity - 多边形内部的不透明度 (0.0-1.0)

更多信息请参阅开放简单样式规格 1.1.0 版

在其他位置嵌入您的地图

想让您的 geoJSON 地图用在 GitHub AE 以外的地方? 只需修改此模板,并将其放在任何支持 javascript 的 HTML 页面上(如 GitHub Pages):

<script src="https://embed.github.com/view/geojson/<username>/<repo>/<ref>/<path_to_file>"></script>

例如,如果地图的 URL 是 github.com/benbalter/dc-wifi-social/blob/master/bars.geojson,则嵌入的代码是:

<script src="https://embed.github.com/view/geojson/benbalter/dc-wifi-social/master/bars.geojson"></script>

默认情况下,嵌入的地图是 420 像素 x 620 像素,但您可以在结束时将高度和宽度变量作为参数传递,以自定义输出,如 ?height=300&width=500

ref 可以是分支或个别提交的哈希(如 2391ae)。

集群

如果地图包含大量标记(大约超过 750 个),GitHub 将自动以较高的缩放比例集群附近的标记。 只需单击群集或放大便可查看个别标记。

关于底层地图

底层地图(街道名称、道路等)由 OpenStreetMap 驱动,这是一个协作性项目,用于创建可自由编辑的世界地图。 如果您发现什么不正确,只需注册并提交修复,因为它是开源项目。

疑难解答

如果在渲染 geoJSON 文件时遇到问题,请通过 geoJSON 语法检查运行 geoJSON 文件,确认该文件有效。 如果您的地点没有出现在预期的位置(例如在海洋中间),可能是数据在规划中,目前不受支持。 目前,GitHub AE 只支持 urn:ogc:def:crs:OGC:1.3:CRS84 规划。

此外,如果您的 .geojson 文件特别大(超过 10 MB),则无法在浏览器中渲染。 在这种情况下,您一般会看到一条类似以下的消息:

大文件

如果将 .geojson 文件转换为 TopoJSON,可能还是能够渲染数据,TopoJSON 是一种压缩格式,有时能将文件减小 80%。 当然,您始终可以将文件分解为更小的数据块(例如按州或年分解),并将数据在仓库中存储为多个文件。

其他资源

Working with Jupyter Notebook files on GitHub

When you add Jupyter Notebook or IPython Notebook files with a .ipynb extension on your enterprise, they will render as static HTML files in your repository.

笔记本的交互式功能(例如自定义的 JavaScript 图)在 your enterprise 上的仓库中不起作用。 有关示例,请参阅 Linking and Interactions.ipynb

要查看呈现 JavaScript 内容的 Jupyter notebook 或与其他人共享您的笔记本文件,您可以使用 nbviewer。 有关示例,请参阅在 nbviewer 上呈现的 Linking and Interactions.ipynb

要查看 Jupyter Notebook 的完全交互式版本,您可以在本地设置笔记本服务器。 更多信息请参阅“Jupyter 的正式文档”。

疑难解答

如果您在静态 HTML 中呈现 Jupyter Notebook 文件时遇到问题,您可以通过在命令行中使用 nbconvert 命令,在本地转换该文件:

$ jupyter nbconvert --to html NOTEBOOK-NAME.ipynb

延伸阅读

此文档对您有帮助吗?

隐私政策

帮助我们创建出色的文档!

所有 GitHub 文档都是开源的。看到错误或不清楚的内容了吗?提交拉取请求。

做出贡献

或者, 了解如何参与。