当前位置: 首页 > 知识库问答 >
问题:

chart.js,向图表添加页脚

司空镜
2023-03-14

使用Chart.js2.0。我正在寻找一种在图表底部添加页脚(一行文本)的方法,以便显示数据源。

我尝试通过option对象来解决它,就像title和legend被包括和修改一样。像这样:

`options: { ... 
  footer: {
    display: true,
    text: 'data from xy'
  }
}`

我在文档中几次提到了“footer”,以及样式化它或在“工具提示”上下文中使用它的方法,但还没有看到如何具体添加它。

编辑/更新:我找到了两种方法(但没有完美的解决方案)来在图表中添加页脚,同时尝试解决这个问题。如果有人遇到了和我一样的问题,这里有一些解决这个问题的建议。

NR.1:添加HTML元素。这种解决办法的缺点是,如果用户以.png形式下载图表,则不会显示添加的HTML元素。也许这是最好的解决方案,如果用户以.png形式下载图表时元素不一定是可见的。

`var myChart = new Chart(ctx, {
  type: 'line',
  data: { ... },
  options: {
   legend: { ... },
   ... 
   legendCallback: function(){
    return '<p>bla bla</p>';
   },
  ...
 },
});
document.getElementById('legendID').innerHTML = 
myChart.generateLegend();` 

在画布后面添加div以追加新的HTML元素

nr.2:添加另一个数据集,该数据集是空的,但包含要显示的信息的标签。borderColor和backgroundColor设置为透明。添加一些空标签(“”)使标签与添加的页脚之间有一定距离。这种变通方法的缺点是样式化的可能性有限。

NR.3:ana Liza的解决方案。最后,这对我的情况最有效,因为添加的信息在.png上是可见的。

暂时还没有答案

 类似资料:
  • 我正在使用 iReport 4.0.2 创建一个包含一个子报表的主报表。我尝试在子报表的页眉带和页脚带中添加一些静态文本,我希望页眉带和页脚带中的文本将重复,但如果子报表本身有多个页面,则这些文本仅显示在子报表的第一页(但不显示在其余页面上)。 实际上,我想做的是在子报表中放置一个“第 x 页,共 n 页”变量,以便子报表可以有自己的一组页码。 这是我当前报告的布局:(对不起,我没有权限在这里上传

  • 创建了一个阴阳烛图表,四分位数用于合唱青蛙活动。试图找出如何将实际数据点添加到图表中(使其成为组合图表)。 以下是烛台图的代码: 我想在每个相关的烛台图上添加基础数据(带红点的散点图)。以便用户能够更好地可视化数据的传播,并最终识别异常值。 下面是前三个烛台图的基础数据。[69, 78, 87, 91, 102, 109, 111, 112, 117, 118, 120, 126, 129, 13

  • 抱歉,如果这不是正确的提问方式。我没有“声誉50”来评论对同一个问题的回答,礼节上说我不应该用一个问题来“回答”。 我有相同的问题,如使用添加数据到折线图chart.js但解决方案不适合我。我正在运行一个较新版本的Chart.js(1.0.1-beta.4),我已经尝试了旧版本1.0.1-beta.3建议。除了addData(),一切都为我工作。我已经注释了其他有效的方法。 顺便说一句,我不清楚a

  • 报告中可以包含多个图表。 启动或关闭状态 包含实例的启动或关闭状态图表。 面积图或折线图 包含实例的图表。 图表 选择要包含在报告中的图表。 【注意】如果选择了多种类型的实例,则可以为每种类型的实例添加相应的面积图或折线图。 图表类型 选择图表的类型:面积图或折线图。 复制图表 包含实例的复制图表。如果要包含复制列表的详细信息,请勾选“包含复制列表”选项。 费时查询分析 包含实例的费时查询图表。

  • 图表提供了数据源中数据的直观表示。 添加一个图表 在仪表板选项卡中,点击 “添加图表”。 工作区中所有可用的图表将显示为缩略图。如果没有可用的图表,请点击 “新建图表”以创建一个。有关创建图表的详细说明,请参阅构建图表。 将图表拖到设计窗格中。 属性 图表的可用属性: 选项 描述 位置 自定义图表的位置。 大小 自定义图表的大小。

  • 图表提供了数据源中数据的直观表示。 添加一个图表 在仪表板选项卡中,点击 . 工作区中所有可用的图表将显示为缩略图。如果没有可用的图表,请点击 以创建一个。有关创建图表的详细说明,请参阅构建图表。 将图表拖到设计窗格中。 属性 图表的可用属性: 选项 描述 位置 自定义图表的位置。 大小 自定义图表的大小。