grist static
1.0.0
这是一种在常规网站上查看.grist文件（Grist 电子表格）并与之交互的方法，无需特殊的后端支持。这里的想法是，如果我们可以像处理 PDF 一样将电子表格放在网站上，并且具有良好的格式和导航选项，并且没有太多麻烦，那么对于制作报告来说将会很棒。
如果您可以运行特殊的后端，grist-core 是托管 Grist 电子表格的最经过考验的方式。对于许多用途，Grist 嵌入可能就足够了，您可以从外部 Grist 安装（例如 Grist Labs 提供的托管服务）嵌入 Grist 电子表格。但是，如果您无法在外部托管数据，并且不希望承担自己安装 Grist 的操作负担， grist-static可以为您提供一种在常规网站上轻松呈现 Grist 电子表格的方法。与 PDF 一样，人们将能够查看电子表格、在其中导航并在其中进行搜索。比 PDF 更好的是，他们将能够更改选择，并尝试更改数字以查看会发生什么。每个查看者都有自己的副本，其他人不会看到或存储他们的更改。这也是向数百万并发用户展示 Grist 文档的可扩展方式。
https://gristlabs.github.io/grist-static 显示了 GitHub Pages 上托管的几个示例 Grist 文档：
如今，PDF 可以放置在网站上，您可以链接到它们，并期望浏览器能够很好地显示它们。浏览器还没有对 Grist 的原生支持 [还:-)]，但是你可以制作一个像这样的小包装页面：
<!doctype html >
< html >
< head >
< meta charset =" utf8 " >
< script src =" https://grist-static.com/latest.js " > </ script >
</ head >
< body >
< script >
bootstrapGrist ( {
initialFile : 'investment-research.grist' ,
name : 'Investment Research' ,
} ) ;
</ script >
</ body >
</ html >.grist文件放在服务器上的该.html文件旁边，然后将选项归档到bootstrapGrist即可。initialData: 'path/to/data.csv'将CSV 文件导入到新表中。在这种情况下， initialFile是可选的。initialContent选项。您可以使用它来传递 CSV 文件的内容。elementId: 'element-id在页面的元素中打开 Grist。singlePage: true以获得不太繁忙的单页面布局。 Grist 可以处理多种格式的数据，包括 CSV。由于 CSV 是一种常见的格式，并且与它在线交互仍然是一件苦差事，因此我们将grist-static打包到简化的csv-viewer.js实用程序中，专门用于直接在 CSV 中查看、排序、过滤、任何复制/粘贴一个网页。
只需将查看器添加到网页的head区域即可：
< head >
< script src =" https://grist-static.com/csv-viewer.js " > </ script >
</ head >然后您可以创建一个按钮来从 URL 打开 CSV：
< button data-grist-csv-open =" transactions.csv " > View CSV </ button >CSV 可以是一个文件，也可以是您的网站为用户动态生成的 CSV 数据的 URL。
如果您使用链接而不是按钮，则可以使用相同的方法：
< a data-grist-csv-open =" transactions.csv " href =" # " > View CSV </ a >当然，您可以根据需要设置按钮和链接的样式。
CSV 查看器还可以用作名为csv-viewer的 Web 组件：
< html >
< head >
< script src =" https://grist-static.com/csv-viewer.js " > </ script >
</ head >
< body >
< csv-viewer initial-data =" path/to/data.csv " style =" height: 500px; border: 1px solid green " >
</ csv-viewer >
</ body >
</ html >事实上，该组件接受与bootstrapGrist函数相同的选项集，因此您可以将其配置为显示 CSV 文件或（尽管其名称）您选择的 Grist 文档。可用选项的完整列表：
initial-file ：要加载的初始 Grist 文档。initial-data ：要导入的 CSV 文件。initial-content ：要导入的 CSV 文件的内容。name ：要使用的 Grist 文档的名称。single-page ：一个布尔属性，如果存在，则以不太繁忙的单页面布局显示文档。loader ：一个布尔属性，如果存在，则会在加载文档时显示加载微调器。 我们已经看到，使用csv-viewer.js ，任何元素都可以转换为打开带有 CSV 文件的弹出窗口的链接。您需要做的就是向其添加data-grist-csv-open属性。
还有其他可用选项。
data-grist-doc-open允许打开 Grist 文档而不是 CSV（尽管实用程序的名称如此）。data-single-page设置为true ；对于多页面布局，将 data-sing-page 设置为false 。data-name覆盖多页面布局中显示的默认文档名称。data-loader在文档加载时显示加载旋转器。默认情况下启用此功能，通过data-loader="false"禁用它。还有一些预定义的按钮类，特别是grist和grist-large ，它们提供了 Grist 的默认样式。
为了更好地控制，有一个全局的previewInGrist函数，其 API 与bootstrapGrist相同，但不是内联渲染，而是在弹出窗口中打开预览。这对于页面加载时不可用的任何动态创建的内容或文件可能很有用。
默认情况下，Grist 电子表格在.grist文件中存储大量历史记录。您可以通过构建grist-core来修剪该历史记录，然后在grist-core目录中执行以下操作：
yarn run cli history prune PATH/TO/YOUR/doc.grist
抱歉，这很尴尬。
git submodule update --init
make requirements
make build
make serve
# now visit http://localhost:3030/page/
上面的序列在page目录中放置了很多链接，以方便开发时使用。要收集要上传的文件，请改用：
make package
# everything you need is in dist/
到目前为止，所有 HTML 示例都使用了https://grist-static.com/ ，这是一个由 Grist Labs 运营的域，仅提供静态文件。该域记录流量以测量使用情况，但不设置或跟踪 cookie。您可以将所有需要的文件复制到您自己的网站或 CDN，以保持您的流量完全私密。
您可以通过以下方式获取所需文件：
npm pack grist-static从 NPM 注册表获取最新的 tarball。 Tarball（ .tgz文件）是一种常见的存档格式，有许多免费工具可用于解压它们。不管你到达那里，最终你都会有一个dist/目录，其中包含csv-viewer.js 、 latest.js和许多其他组成 Grist 的文件。将该材料放置在您希望的位置，并适当更新您的 URL。
jsdelivr CDN 自动镜像放置在 NPM 上的包，所以我们以它为例。我们可以替换：
< script src =" https://grist-static.com/csv-viewer.js " > </ script >和：
< script src =" https://cdn.jsdelivr.net/npm/grist-static@latest/dist/csv-viewer.js " > </ script >当然，这个特殊的改变只是将使用信息移动到jsdelivr.net而不是grist-static.com ，但你明白了。只需在您选择放置文件的任何位置使用相同的模式即可。
让用户更改保留在浏览器中可能会很方便 - 一旦 OPFS 拥有广泛的浏览器支持，它可能是一个不错的选择。其他步骤：
grist-core的上游构建步骤。 
