如何使用 ChartJS 和 FreeMarker 执行 JavaScript 函数？答案

【问题标题】：How to execute a JavaScript function with ChartJS and FreeMarker?如何使用 ChartJS 和 FreeMarker 执行 JavaScript 函数？
【发布时间】：2021-11-05 09:31:21
【问题描述】：

我正在尝试在 chartjs 饼图中执行 JavaScript 函数，但使用的是 FreeMarker，这有点困难。

我有以下 javaScript 函数：

function randomColor(){
        var hue = Math.floor(Math.random() * 360);
        var color = 'hsla(' + hue + ', 70%, 70%, .8)';
        return color;
}

我想填充chartjs属性“背景”：

"backgroundColor": [
    <#list object.array as something>
        "${randomColor()}",
    </#list>       
]}]

但它不起作用......

如何将此函数包含到我的chartjs中？

我使用的是 chartjs 2.9.3 版本。

【问题讨论】：

标签： javascript chart.js freemarker

【解决方案1】：

删除"${ 和}"，以便在浏览器中调用该函数。 FreeMarker 语句（如 ${...}）在服务器上解析，这为时过早（那里没有运行 JavaScript）。

【讨论】：

当我删除它时，我得到一个包含函数名称的列表，但不是这个函数返回的值。换句话说，我得到一个“randomColor()”列表。
@Victor 我假设 "backgroundColor": [ ... ] 是 JavaScript。在这种情况下，您应该在浏览器的源视图中看到randomColor()-s（不带引号），但实际运行时值应该具有随机颜色。