html - 当我们使用 CanVG 导出到 PNG 时,多行标题不起作用 - Highcharts
问题描述
我正在创建一个 highchart 示例,我想将图表导出为 PNG 格式。下载 PNG 图像时,它的显示方式与图表上的不同。
我尝试了各种方法来添加标题行,但没有一个对我有用。
下面查看添加标题行的不同尝试
> 1. "text":"<p>Header Line Text</p><p>Line 2</p>Line 3"
> 2. "text":"<span style="display:block">Header Line Text</span><span style="display:block">Next Line</span>Line 3"
> 3. "text":"Header Line Text<br>Line 2<br>Line 3"
请在此 JSFiddle http://jsfiddle.net/deepakpookkote/7jgc1nyq/5/中找到我的示例代码
请帮我解决这个问题或推荐一种方法。
解决方案
从 中删除参数"useHTML":true
(或设置"useHTML":false
)"title":{}
。此外,删除<p>
标签,使用标签产生这种格式<br>
:
"text": "Header Line Text<br>Line 2<br>Line 3"
满的:
"title":{
"style":{
"fontFamily":[
"Arial Narrow"
],
"fontSize":"12pt",
"margin-left":"100px",
"wordWrap":"break-word",
"text-align":"center"
},
"align":"center",
"text":"Header Line Text<br>Line 2<br>Line 3",
"margin":10
}
在 DOM 输出时,每一行(标题行文本、第 2 行、第 3 行)都将被包装在一个<tspan>
标签中。
此外,参数中的指定样式将应用于父<text>
标签。
推荐阅读
- c++ - 运行基本 Avx512 代码时获得非法指令
- mysql - 使用联接和派生表进行查询
- python-3.x - Python 猜数字游戏未正确显示反馈。有什么问题?
- gnuradio - QPSK 调制和解调
- excel - NextSibling.Innertext 错误“对象不支持此属性”
- laravel - 如何在 laravel 中进行此查询?
- r - 如何在 R 中使用 quantmod 获得 3、6、12 个月的回报
- r - 按第一行中的值规范化 dplyr 中的指定列
- loopback - 无法启动应用程序。TypeError:无法在 getFieldsJsonSchemaFor 读取未定义的属性“定义”
- flutter - setState如何只重建AppBar?