如何在 Plot.ly JS 标题中创建新行

Question

我正在使用 Plot.ly JS 来制作图表。这些图表绘制了调查中某些问题的答案。因此，图表的标题就是问题本身，可能会有点长。现在，标题超出图表并被隐藏，如下图所示（无法在 Stack Overflow 上嵌入图像，因此它为图像创建了一个 link）：

这是被调用的代码，其中 values 和 labels 是在别处定义的变量：

var graph_data = [
    {
        values: values,
        labels: labels,
        type: 'pie'
    }
];
var layout = {
 title: 'How responsive has our support team been to your questions or concerns?'
};
Plotly.newPlot( chartID, graph_data, layout );

我尝试在字符串中添加换行符，例如 \r、\n 和 \r\n，但没有成功。我也尝试更改 CSS 属性的 word-wrap 但它没有用。在 Plot.ly JS 中轻松显示多行标题有什么建议吗？

Answer 1

使用 <br> 在情节字符串中换行。

Answer 2

为了获得更多控制权，我正在为 multiple-lines 标题这样做：

multipleStringLines: (title) => {
    if (title.length > 20) { // check if greater than threshold!
                let y_axis = title.split(' ');    //break into words
                let interval = title.split(' ').length / 2;     //2-lines
                return y_axis.slice(0, interval).join(' ') + '<br>' + y_axis.slice(interval, y_axis.length).join(' ');
    }
     return title;
}

如何在 Plot.ly JS 标题中创建新行

How to create new line in Plot.ly JS title

javascript

charts

title

plotly