Question

这一切都在问题中，但我正在使用python-highcharts构建类似this jsfiddle example的内容，以包含在Python Flask应用中。我可以让它在Jupyter笔记本中工作，我可以将它保存到html文件或将其导出为iframe或div代码块。但是我无法在flask html页面中使用任何这些工作。烧瓶页面中的包含块如下所示：

<p>
{% if result != None %}
<div id="my-chart"></div>
<script type="text/javascript">
  {{result|safe}}
</script>
{% endif %}
</p>

以及相关的标题部分：

<script src="//code.highcharts.com/stock/highstock.js"></script>
<script src="//code.highcharts.com/highcharts-more.js"></script>
<script src="//code.highcharts.com/modules/exporting.js"></script>

我设法让它与pandas-highcharts一起工作，但是这样我就无法通过dict-to-json到浏览器路径发送工具提示格式化javascript函数...所以解决方案要么问题会很棒。

学家

Answer 1

首先关闭：

可以（几乎）始终阻止在HTML中编写JS函数！

您应该坚持的首要原则之一是分离您的静态文件。有关here的更多信息。

您只应使用this之类的Jinja2/DjangoTemplatingLanguage标记将变量传递到您的脚本中，并将所有javascript功能写入单独的.js文件中，然后将其与其他脚本一起导入。例如：

<script src="//code.highcharts.com/stock/highstock.js"></script>
<script src="//code.highcharts.com/highcharts-more.js"></script>
<script src="//code.highcharts.com/modules/exporting.js"></script>
<script src="{{ static_url }}/js/my-highstock-project.js"></script>

通过这种方式，您可以获得良好的代码分离，并且（在某种程度上）也更安全。

这引出了我们手头的问题;导入...

其次： HighCharts需要jQuery才能在其工作之前实施。这可能是你的问题。

要导入jQuery，请将此内容添加到标题中：

<script src="https://code.jquery.com/jquery-3.1.1.js"></script>

如何导出python-highcharts图表以在flask或django中使用？

1 个答案:

可以（几乎）始终阻止在HTML中编写JS函数！

这引出了我们手头的问题;导入...