问题标签 [chart.js2]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
9752 浏览

javascript - Modifying the X-Axis Labels of a Scatterplot in Chart.js 2

In Chart.js 2 I am generating a scatter-plot where there x coordinates are Epoch timestamps and the y coordinates are integers. I was wondering if there was a way to format the x-axis labels of the graph, so that the dates are displayed in a human-readable format.

Update: Currently I am building my graph from Unix timestamps in milliseconds. The other parts of this prototype format those dates with the toDateString method of the Date class (eg. Fri Aug 5 2016).

0 投票
2 回答
9108 浏览

javascript - 在 React Js 中工作的 Chart js 中无法获得条形图颜色

这是我第一次使用 Chart Js,我设法让它显示在我的页面上,但键 'label'、'backgroundColor'、'borderColor' 和 'borderWidth' 不会显示。键“标签”和“数据”工作得很好,因为我可以看到图表中的标签和条形。我尝试将非显示键分配给变量,就像“标签”和“数据”一样,看看它是否会这样工作,但没有运气。我还尝试传递十六进制颜色和常规颜色名称,如红色、蓝色等,但这也不起作用。如果有人能提供一些帮助,将不胜感激,谢谢!

0 投票
1 回答
4032 浏览

javascript - 将对象解析为 chart.js 而不是数组?

我正在尝试将对象解析为 chart.js 而不是使用数组。这是我的对象:

我想将我的解析obj为chart.js,因此它会根据该对象的数据创建一个图表。例如,如果我们采用条形图,它会and在 Y 轴上方放置 2。其次two是 Y 轴向上 1,依此类推。

如何创建条形图:

这是直接从他们的网站上获取的。我所需要的只是data.labels用我的对象中的键和data.datasets[0].data值来改变。这样做相对容易,因为我可以将对象反转为数组,但真正的问题是:是否可以将对象解析为图表的数据而不是数组?. 谢谢!

0 投票
2 回答
36765 浏览

javascript - using array values in chart.js data and label field

I wish to pass values of an array to the data and label fields of the chart.js dataset.

Here the code from success of ajax call made to fetch json data. I fetch the json data and store it into an array.

Now i wish to use this label values into the labels filed.

But there seems some issue and the data is not getting rendered on the chart

0 投票
1 回答
907 浏览

bar-chart - 如何在chart.js的堆积条形图中的每个条形图中添加数据标签?

我正在使用指令在 Angular JS 中使用 chart.js。Git 链接:https ://jtblin.github.io/angular-chart.js/

我对使用堆积条形图很感兴趣。如何在条形上添加数据标签以显示堆叠条形图中的每个条形值?

0 投票
1 回答
1706 浏览

charts - 扩展 chart.js 水平条形图以包含垂直线

我正在尝试在水平条形图的设定点处添加一条垂直线。我发现的示例似乎不适用于charts.js 2. 即使我创建了一个新的图表类型并使用未修改的horizo​​ntalBar 绘制方法,图表也不会绘制。

谁能解释如何扩展此图表?

这是我目前的尝试:https ://jsfiddle.net/dwelch/6f1gfog2/

0 投票
0 回答
331 浏览

chart.js2 - Chart.js 2 条形和折线组合图表。将两个 y 轴对齐在 0

我正在尝试创建一个条形图和折线图。如图所示,一些条形图具有负值,这会产生图片中那种丑陋的图表。

有没有办法对齐两个轴的 0,使线的 0 与条的 0 匹配?

(注:2 y 轴测量不同的量)

问题

0 投票
1 回答
2239 浏览

javascript - Chart.js 2.0(条形图)减少每2条之间的x轴距离

就像标题所说的,如何减少chart.js 2.0中条形之间的x轴距离,如下图所示。

例子

目前,这是我的酒吧

在此处输入图像描述

这是我的代码

https://jsfiddle.net/mx2gh59k/

0 投票
0 回答
336 浏览

javascript - Chart.js - 点之间而不是周围的贝塞尔曲线

我想自定义我的 Chart.js 折线图的呈现。现在这条线是弯曲的(使用默认的贝塞尔样条曲线)。此默认实现使曲线围绕数据点而不是在它们之间。这使得图表看起来低于零,但事实并非如此。

是否有可能在点之间而不是周围获得贝塞尔曲线?

如果我用 lineTension = 0 禁用曲线,我会得到直线,但我喜欢曲线。

chartjs-张力

0 投票
0 回答
753 浏览

javascript - Chartjs:在一年内显示的多行年份数据集

我用下面的代码创建了这个图表,数据比较需要多年的时间跨度。我有一个类似于下面的数据集,但每组可以比另一个短或长。

现在,这段代码将生成一个图表,如下所示: 图表

我希望它像这样绘制,从 1 月到 12 月,但可以读取介于两者之间的每一天(数据点)的工具提示: 图2

关于数据是否应该采用不同的格式或可以使用的图表属性有什么建议吗?