chart.js相关内容

图表样本不能复制

我希望从Chartjs文档中复制此样本的结果: https://www.chartjs.org/docs/latest/samples/scales/time-line.html 我要找的是x上的比例结果: 我将REACT与REACT-chartjs-2和示例的简化版本一起使用,但我设法为x轴保留了相同的配置和数据: import { DateTime } from 'luxon ..
发布时间:2022-07-25 18:52:38 其他开发

将工具提示放置在栏的中心

找不到像这样将工具提示放置在栏中心的方法(是的,我知道它不完全在此屏幕截图的中心,但仍然): 如果我使用custom工具提示选项,我只能获得插入符号在栏顶部的x和y位置。但无法获取条的高度/宽度。 下面是我传递给图表构造函数的Options对象的一部分: const options = { tooltips: { enabled: false, custom: ..
发布时间:2022-06-26 09:45:30 前端开发

如何在Razor页面中创建一个从数据库中拉取数据的图表?

如何创建从数据库中提取的图表?我试过MorrisJS、ChartJS、Canvas JS、HighChats。但我认为我最接近的是ChartJS,所以希望我们能坚持下去。 我需要创建一个从数据库中提取数据的图表,并使用数据库中的多个表,例如,数据库名称&Finance&;,我需要一个条形图来比较dbo.Revenue中的金额和dbo.Expense中的金额总和。月份是x轴。Something ..
发布时间:2022-05-11 16:46:34 其他开发

如何对Chart.Js进行MMMYY排序并显示与月份匹配的值?

这将是一段很长的时间,可能会令人困惑,但请原谅我。 我上一个问题是问如何从数据库中提取数据并动态地将其显示在图表中,感谢@Rena,我设法做到了这一点。这就是解决方案https://stackoverflow.com/a/67967555/15397944。 我现在面临着一些挑战,我会把我的问题分成两部分,但首先我会展示我的模型设计。 型号 public class payabl ..
发布时间:2022-05-11 15:08:45 C#/.NET

在具有额外维度的ChartJS上的多行上对y轴标签进行分组

我已经在SO(Using ChartJS to create a multiple grouped bar chart - see picture below)上成功地成功地使y轴上的第二行标签正确且动态地工作。 我想知道有没有办法让他们走上多条线?查看下图中的标签: 由于它是动态构建的图表,并且行为非常灵敏,所以我的数据有时会超过允许的空间。 因此,低于2.50有时可能太长,以 ..
发布时间:2022-04-18 22:56:25 其他开发

如何在图表js中显示百分比(%)

我想在图表中显示一个百分比符号。我从控制器获取数据库中的数据,并显示VUE js文件中的数据。以下是我的图表代码。 import { Doughnut } from 'vue-chartjs'; export default { props:['appurl'], extends: Doughnut, data(){ return{ ..
发布时间:2022-02-24 18:59:40 其他开发

ChartJS-设置与x轴描述不同的悬停文本

我正在使用chartjs来可视化条形图中的一些数据。标签很长,所以我把它们剪掉了。但是,我希望工具提示的文本(悬停时)是原始的。我可以使用默认的chartjs配置实现这一点吗? 我使用以下内容来生成图表: function DrawChart(canvasID, remoteFields, remoteData, remoteColors, remoteBorderColors) { ..
发布时间:2022-02-24 18:57:41 前端开发

如何在Chartjs雷达中删除网格线和网格标签?

使用chartjs 2型雷达,如何删除网格线和网格线标签以使雷达图更类似于下面所示的所需雷达图? 当前: 所需: 推荐答案 要删除/减少网格线,可以将ticks的maxTicksLimit属性设置为一个数字(网格线的数量-约),如下所示: scale: { ticks: { maxTicksLimit: 3 } } 奖励:如果您希望删除所有 ..
发布时间:2022-02-24 18:55:51 前端开发

ChartJS 3+x轴仅显示完整的时刻对象,而不是仅显示月份

我尝试使用Momentjs在图表的x轴上仅显示月份和年份,但它只将看似完整的时刻日期放在x轴上。 我看过很多这样做的示例,但似乎没有一个在最新版本的chartjs中起作用。 我知道与Momentjs配合使用所需的适配器(&Q;),但无法知道它是否工作。 这里是我正在使用的代码的jsfiddle,非常感谢您的帮助。https://jsfiddle.net/7z20jg68/ 我告诉 ..
发布时间:2022-02-24 18:54:41 其他开发

如何创建垂直轴(Y轴)为字符串的图形?

我要使用Chart.js制作的图形是一个垂直轴上有字符串、水平轴上有数字的折线图。 例如,横轴是时间,垂直轴是帽子的颜色。 请参见下图 var myChart = new Chart(ctx, { type: 'line', data: { labels: [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21],//Nu ..
发布时间:2022-02-24 18:52:59 前端开发

Chart.js X轴格式化程序更改图表中显示的值

我正在创建一个简单的可视化,显示过去24小时内温度的演变。如图所示。 在x轴上,我正在显示小时数,并尝试将其格式设置为10-&>10:00,依此类推。 但是,当我在选项中包括ticks.callback时,聊天显示如下:它总是在0:00开始,而正确的聊天在这个特定时间从12开始。 ticks: { callback: function(value, index, tick ..
发布时间:2022-02-24 18:51:09 其他开发

在Chart.js中设置图表标题、x轴和y轴的名称?

Chart.js(documentation)是否有选项让数据集设置图表的名称(标题)(例如,我的城市中的温度)、x轴的名称(例如,天)和y轴的名称(例如,温度)。或者我应该用CSS解决这个问题? var lineChartData = { labels : ["January","February","March","April","May","June","July"], ..
发布时间:2022-02-21 16:44:25 其他开发

Chart.js 的垂直网格线问题

我正在使用 Chart.js 库来创建折线图,并且由于数量众多需要的标签我已经使用 Chartjs 上的限制标签数量中的方法跳过了一些折线图问题,另见下文. 我的图表看起来完全符合我的要求,但有一个例外:在第二个标签正常的位置出现一条随机黑线. 这是我用来创建此图表的代码: Chart.defaults.global.elements.point.radius = 2;var c ..
发布时间:2022-01-22 16:24:21 前端开发

React Chartjs - 间隔更新图表

我正在尝试构建一个可以直观地显示不同排序算法的应用程序.我正在使用 react 和 react-chartjs-2.渲染和更新工作完美,我对数据进行洗牌没有问题,然后在算法运行完成后更新图表. 但是,我似乎无法在排序过程中更新它.每当发生交换时,我都会尝试更新状态. import React, { Component } from 'react';从'react-chartjs-2'导入{ ..
发布时间:2022-01-22 16:23:55 其他开发

折线图.js中带有倒置图像的点样式属性

参考小提琴 网址 : https://jsfiddle.net/vL0ta76w/ 当前行为Chart.js 中的点样式属性提供了某些图标,如圆形、三角形、矩形等,以显示在折线图上 var options = {类型:'线',数据: {标签:[“红色",“蓝色",“黄色",“绿色",“紫色",“橙色"],数据集:[{标签:'投票数',数据:[12, -19, 3, 5, 2, 3],边 ..
发布时间:2022-01-22 16:23:47 其他开发