python - 如何在 Wagtail CMS 中使用图表

Question

我需要在流场函数中包含自定义图表，如Tauchart 所示。

但是用户怎么可能修改来自 wagtail 管理员的数据呢？我完全不知道如何做到这一点。

我正在考虑一个表单，但可以将表单添加到流场吗？我想是的，我可以通过指向现有表单的链接来做到这一点。但这似乎很难做到，也不是一个好主意。

你有什么想法？对您来说最佳做法是什么？

您是否有任何将 Taucharts 集成到 CMS 中的示例？

Answer 1

您可以在 blocks.py 中创建一个自定义块，例如 LineChartBlock() 引用名为 line_chart.html 的模板。您需要将自定义块导入您的 models.py 文件，以将其添加到您的 StreamField。然后 CMS 管理员端的用户可以输入值并将其保存为参数。然后您可以将其作为动态 JavaScript 变量传递到模板中，您可以使用它来创建自定义图表。这是一个超级粗略的想法......

所以 blocks.py 看起来像这样：

from wagtail.core import blocks

class LineChartBlock(blocks.StructBlock):
    title = blocks.CharBlock()
    x = blocks.DecimalBlock()
    y = blocks.DecimalBlock()
    data = JSONField()

    class Meta:
        template = 'blocks/line_chart.html'

你的models.py：

class BlogPage(Page):
    body = StreamField([
        ('paragraph', RichTextBlock()),
        ('line_chart', LineChartBlock()),
    ])

您的模板：

<script>
    const title = "{{ title }}";
    const x = "{{ x }}";
    const y = "{{ y }}";
    const data = "{{ data }}";

    makeChartWizardry = () => {
       doStuff;
    }

</script>

<section>
    <div id="chart"></div>
</section>