时间戳

首页 > 解决方案 > 在 Antora 中嵌入 Vega-Lite 图表

vega-lite - 在 Antora 中嵌入 Vega-Lite 图表

问题描述

我正在尝试将这个 vega-lite 图嵌入到我的 antora 文档中：https ://vega.github.io/vega-lite/examples/line_overlay.html

我的 Asciidoc 文件如下所示：

... some text ...

== Attachments
[vegalite, rendered-vega-image, svg]
----
{
  "$schema": "https://vega.github.io/schema/vega-lite/v4.json",
  "description": "Stock prices of 5 Tech Companies over Time.",
  "data": {"url": "data/stocks.csv"},
  "mark": {
    "type": "line",
    "point": true
  },
  "encoding": {
    "x": {"timeUnit": "year", "field": "date"},
    "y": {"aggregate":"mean", "field": "price", "type": "quantitative"},
    "color": {"field": "symbol", "type": "nominal"}
  }
}
----

... some more text ...

问题是找不到包含我的数据的 CSV 文件。我尝试了我想象的每条路径......相对和绝对文件系统路径以及相对和绝对 http url。我仍然总是收到这条消息：

[DONE] build ui bundle
Skipping vegalite block. No such file: http://localhost:8080/vegalite/svg/eNpVkEFywyAMRfc5BcN0mdibdpNtj9D0AAQrWA0gArKnnozvXoHbpl0Zv9F_X3DfKaWfih0hGH1UemRO5dj3MzjTOeRxOndI_TbQ6MEjQz8_dx-Fot7X_ADFZkyMAsTxxmSvKmW0UBRd1Is6gR3VK4VkIlY2Q1YnDNB95w3X8ruesq-Cu2E2dgwQuQyY1z5QRKaM0R08OVe_GRJlllNfal3pbJn12nTB5GvVyVn-eElQpR4jtDphiTCyQM4TCNliEC0NInxEP9tSLIu-S3-VLGCy3it9QfBDBbI6bLUyv7R541yWdxJ-1AFM_DffXqWSn7Vuk4mMbBjnh8iSp9xkv8GyhDP5v8lIAaPxeq032K1fIi6OZQ==
[DONE] build docs

Skipping vegalite block不应该出现。

我用直接在 json 块中定义的数据尝试了 vega-lite。这个片段有效。所以 Vega-Lite 在一般工作中（我使用 Kroki 服务器来生成图表）。

[vegalite, rendered-vega-image, svg]
----
{
  "description": "A simple bar chart with embedded data.",
  "data": {
    "values": [
      {"a": "A","b": 28}, {"a": "B","b": 55}, {"a": "C","b": 43},
      {"a": "D","b": 91}, {"a": "E","b": 81}, {"a": "F","b": 53},
      {"a": "G","b": 19}, {"a": "H","b": 87}, {"a": "I","b": 52}
    ]
  },
  "mark": "bar",
  "encoding": {
    "x": {"field": "a", "type": "ordinal"},
    "y": {"field": "b", "type": "quantitative"}
  }
}
----

直接在图表定义中定义我的数据对我来说不是一个解决方案。现在我只是想用 demo-CSV 文件让它工作。但之后我将切换到我自己的自动生成的大型 CSV 文件。我的真实 CSV 和演示文件都位于docs/modules/technical-docs/assets/attachments/monitoring-logging-reporting/stocks.csv.

我的一般设置包括几个项目。

  1. 包含 antora 剧本和 shell 脚本的项目，用于在我的本地主机上生成我的文档
  2. 包含 Asciidoc、CSV 文件和一堆其他文档和源代码的项目
  3. 其他几个包含与手头问题无关的 asciidoc 文档的项目。

有人有想法吗？谢谢你的帮助。

标签： vega-liteasciidocantora

解决方案

Kroki 提供了限制对文件系统和网络上文件的访问的安全级别。每个级别都包括在之前的安全级别中启用的限制：

  • UNSAFE：禁用任何安全功能。
  • SAFE：假设图表库安全模式请求清理就足够了。
  • SECURE: 防止尝试从文件系统或网络读取文件。

默认情况下，Kroki 以SECURE模式运行。

结果，"data": {"url": "data/stocks.csv"}将被删除/忽略。

如果您使用 Asciidoctor Kroki，预处理器应该解析路径，读取内容并替换data.url为实际值。见：https ://github.com/Mogztter/asciidoctor-kroki

或者，由于您正在运行 Kroki 的本地实例，您可以使用KROKI_SAFE_MODE=unsafe环境变量将安全模式配置为unsafe.

推荐阅读