我有一个计算器，它从两个下拉列表中提取值，并通过一个数组运行它们，以计算某个条件将结束的几率。我让它正常工作，并以文本格式显示结果。我的老板现在想让我以条形图的形式显示结果。我选择使用chart.js，可以让图表在图表中输入实际数据，但需要从所选下拉列表的结果中提取数据。
由于某些原因，jsfiddle中的计算器不能正常工作，但在我的网站上可以正常工作。不知道为什么。
下面是我用于chart.js的脚本
<script src="js/Chart.js"></script>
<script src="js/Chart.HorizontalB
浏览 1提问于2015-07-18得票数 0
1回答
我有一个带有CHart.js的MVC应用程序。可以在View事件上加载CHart.js。
我希望在html按钮单击事件上加载Chart.js。单击按钮，调用控制器，并根据搜索条件对数据进行筛选。我希望这个过滤过的内容显示在chart.js上。
如何调用javascript函数在单击按钮完成控制器进程后按一下按钮加载图表。
输入过滤条件2.单击按钮3.控制器根据过滤器4从数据库中获取数据。然后调用视图中的javascript函数加载chart.js
让我知道该怎么做。
浏览 1提问于2018-09-19得票数 0
回答已采纳
1回答
我想使用Chart.js库在我的网站上绘制图表，但我打算向图表提供大量的数据(>1,000)。但是，当我将数据提供给chart.js折线图时，该图表不是可滚动的，而是将这些值一起推送到一起，从而使该图表不可读。有没有办法让chart.js折线图可以在x轴上滚动？
浏览 6提问于2014-07-18得票数 7
有没有一种方法可以让chart.js自动显示最适合X，Y数据集的标签范围？
我有一个简单的数据集，该数据集基于零，但数据间距不相等，ala：
0.0, 7.0
0.5, 8.0
1.2, 9.0
...
49.9 213.0
有没有一种方法可以将这个数据集传递到chart.js中，让它做正确的事情，计算0 -> 50.0中的10个标签，并显示由一行连接的所有数据点？
浏览 2提问于2016-05-17得票数 7
回答已采纳
您好，我是js新手，我想问一下，我有两个组件，一个是仪表板，另一个是chart.js。我想让仪表板速度日期在图表上绘制图形，js幸运的是，我从用户数据中获得了数据，现在是时候将这些数据发送到chart.js文件了。我已经创建了两个函数，在其中我们可以获得像这样的数据 const graphdata =(graph)=>{
console.log("initial",graph)
speedDataGraph(graph)
}
export const speedDataGraph=(data)=>{
data;
} 现在，我将这个函数speed
浏览 31提问于2021-08-03得票数 0
我的应用程序使用的是对Chart.js进行扩充的Chart.PieceLabel.js：
npm install chart.js chart.piecelabel.js
我正在从DefinitelyTyped安装Chart.js的类型：
npm install @types/chart.js
我想贡献类型到Chart.PieceLabel.js代码库，但我无法让我的应用程序识别它们(它为Chart.js注册类型，但当我直接在npm link _npm link/chart.piecelabel.js中编辑或编辑类型时，TypeScript看不到我的增强。
我在我的应用中使用Chart.js和
浏览 2提问于2017-11-10得票数 1
我是如此的倾斜，如此的倾斜。在我和Django一起创建的网站上，我尝试了一段时间的chart.js工作。我想画两个字段:日期和分数。日期是一个日期，如1/6/2022，分数是浮动。我的问题是，当我把python列表传递给脚本时，它假装它很恶心。但是，当我复制并通过列表，并将其放入图表的数据时，就没问题了。只有当它认为它是一个完全没有意义的变量时，它才不起作用，而我在任何地方都找不到它在谈论这个问题。
views.py
def progress(response):
lessons = StudentLessons.objects.get(name=response.user.emai
浏览 4提问于2022-09-27得票数 0
回答已采纳
3回答
我正在构建一个Angular 2应用程序，并使用Chart.js 2.0来显示“时间”数据。不幸的是，我无法更改moment.js的区域设置。
我安装了moment，并使用SystemJS导入了moment.js和pl.js，但Chart.js抱怨moment.js必须在Chart.js之前加载(不确定如何实现，在每个源文件中，moment都是在chartjs之前声明的)。
然后我试了试Chart.bundle.min.js (包括moment )，它只在英语中有效。我无法将区域设置更改为“pl”。
以下行对Chart.bundle.min.js没有影响，日期仍然以英语显示。
moment.l
浏览 1提问于2016-07-05得票数 5
我已经创建了一个具有多条线(默认情况下为1像素粗细)的Chart.js线条图，我希望用户能够将鼠标悬停在任何特定的线条图上(而不仅仅是点)，并让该图更改其线条粗细(即3像素)。这可以在Chart.js中实现吗？
浏览 2提问于2019-02-09得票数 5
我在Angular中使用了ng2图表和chart.js，特别是折线图。我将图表选项设置如下 我将display属性设置为auto，以便仅当呈现到y轴的数据映射时才显示y轴。然而，当编译angular应用程序时，我得到了一个错误 错误字符串:类型‘TS2322’不能赋值给类型'boolean‘。 我查看了chart.js文档，它说display属性可以是布尔值或字符串，'Auto‘是一个可接受的值。 如果chart.js支持显示属性的字符串，为什么我会得到编译错误？ import {ChartDataSets, ChartData, ChartOptions} from
浏览 17提问于2019-10-08得票数 0
回答已采纳
我正在工作的角度6项目，我想要创建一些图表使用chart.js。
我使用npm安装了chart.js，它的版本类似于3.5.1。我的TypeScript版本类似于2.9.0。
因此，当我尝试服务时。
node_modules/chart.js/types/animation.d.ts(20,37): error TS1005: ',' expected.
node_modules/chart.js/types/animation.d.ts(20,46): error TS1005: ',' expected.
node_modules/chart.js/type
浏览 0提问于2021-08-30得票数 3
回答已采纳
我想要在x轴上创建一个日期和时间的图形，在y轴上创建一个值。如果数据以“x”作为数据中的键，则此操作有效。我的数据以标签“date_time”作为关键。我试图在解析选项中使用xAxisKey参数指定键的名称，但结果是一个空白图表。
这是我的密码：
var xyValues = [{
date_time: '2022-11-13 23:00:00',
value: 2.3
},
{
date_time: '2022-11-14 00:00:00',
value: 3.1
},
{
date_time: &
浏览 21提问于2022-11-21得票数 0
回答已采纳
我有一个纪元时间戳列表，我想用chart.js绘制它。
[1432317109519, 1432318109519, 1432319109519, ...]
分组作为数据提供给chart.js，即每次是Y轴上的一个单位：
[{
x: 1432317109519,
y: 1
},{
x: 1432318109519,
y: 1
},{
x: 1432319109519,
y: 1
}]
我尝试让chart.js将每个时间戳舍入到最近的月份：
chartOptions = {
type: 'line',
scales: {
x
浏览 10提问于2021-09-30得票数 0
当我尝试导入这样的Chart.js模块时，我已经安装了chart.js v4.0.1，以便在我的react项目中使用：
import Chart from 'chart.js/auto'
它显示了我的终端中的一个错误，即模块的解析失败了。
./node_modules/chart.js/dist/chart.js 554:18
Module parse failed: Unexpected token (554:18)
File was processed with these loaders:
* ./node_modules/babel-loader/lib/index.
浏览 15提问于2022-11-25得票数 0
3回答
因此，我已经使用Chart.js库来可视化一些数据。我已经计算过这样的实例，并将它们存储在这样的对象中。问题是，我现在希望对这些价值进行分类，但没有任何参考点可供参考。
Chart.js接受标签、数据和单独的数组，这就是我想出的解决方案。在您希望对数据进行排序之前，它非常有用。第一个标签用于第一个数据等。
什么是更好的解决方案？
var apertures = { "labels": ["example", "exmple"], "data": [4, 18] }
我想用标签存储数据，但我不知道如何让Chart.js做到这样的魔力
浏览 2提问于2017-09-19得票数 0
回答已采纳
看看我这里的代码。我正在从后端获取数据，因此我无法进一步操作它们。我让Chart.js作为散点图工作，但是提供的日期被错误地解析成了1996年，以此类推。 你知道怎样才能正确地格式化x轴吗？ var config = {
type: 'scatter',
data: {
datasets: [
{
label: "US Dates",
data: [
浏览 14提问于2020-04-23得票数 0
回答已采纳
如何从Chart.js创建html图例以隐藏/显示图表的dataset，就像由Chart.js本身生成的图例一样
底部-> Chart.js图例的图例
右边的图例> HTML
如何在"SETOR AGILIZA“中单击并获得相对于它的dataset隐藏/显示
我在chat.js/core.legend.js 中找到了这段代码
onClick: function(e, legendItem) {
var index = legendItem.datasetIndex;
var ci = this.chart;
浏览 3提问于2016-09-15得票数 5
回答已采纳
使用chart.js，我想将底部的图表标签重新格式化为MM DD格式(即Feb 2)如何让chart.js将数据识别为日期并进行转换？在我的csv文件中是这样的: 2020-02-06
这是我的chart.js代码，但它似乎不起作用。
data: {
labels: dollar.years,
datasets: [
{label: 'Cdn dollar in cents',
data: dollar.vals,
fill:
浏览 22提问于2020-02-14得票数 0
回答已采纳
我有一个使用Chart.js的多系列线条图，我一直在试图从一个Chart.js对象中获取隐藏的数据集。我想在图表之外的表格中显示过滤后的数据。
我尝试为每个数据集添加一个隐藏变量，但我仍然很难检索哪些数据集是隐藏的。
浏览 5提问于2018-07-25得票数 0
1回答
我使用的是chart.js .Bar()图表。
但是，在某些情况下，系统中可能没有数据。除了创建空(虚拟)数据集之外，我能以某种方式让chartjs绘制一个空的图吗？
浏览 1提问于2014-12-14得票数 12
1回答
我正在尝试从chart.js 2.9.4升级到chart.js 3.x，以消除大量的moment.js依赖。我的应用程序运行的是角8.2.3和类型记录3.5.3。
安装chart.js@3.x后，导入包时会收到此错误：
node_modules/chart.js/types/utils.d.ts:13:49 - error TS2315: Type 'DeepPartial' is not generic.
13 type _DeepPartialObject<T> = { [P in keyof T]?: DeepPartial<T[P]> };
是
浏览 10提问于2022-03-04得票数 1
回答已采纳
我在PrimeNG中使用图表组件，它依赖于Chart.js，因此我成功地使用npm (版本2.5.0)安装了它，但是，在加载使用图表的页面时，我现在得到了以下错误：
错误错误:未知(承诺)：ReferenceError:图表未定义
我相信这是因为我没有正确地导入它，也没有将它包含在我的systemjs文件中，但是我还没有弄清楚如何做到这一点。我尝试过将其包括在系统in中，方法如下：
'chart.js': 'npm:chart.js/dist/Chart.js',
和
'chart': 'npm:chart.js/di
浏览 2提问于2017-04-25得票数 2
我的C# web forms应用程序中有一个JavaScript图表(Chart.js)。该图表将完美地显示在AJAX UpdatePanel之外，但是当我将其放入UpdatePanel中时，它根本不会出现。我已经阅读了一些相关的帖子，我知道如何让JavaScript在UpdatePanel中工作，但Chart.js就是不能工作。可能的原因是什么&我如何纠正这个问题？ 任何帮助都将得到极大的重视。下面是我的代码： <form id="form1" runat="server">
<asp:ScriptManager ID=&#
浏览 15提问于2020-04-06得票数 0
我的PrimeNG图表有问题。
一开始，我的问题是在html中使用选项，我读到如果我下载了2.9.4 chart.js并这样做更好，现在我有了错误:模块未找到:错误:无法解决‘chart.js/ trabajo\Plots\node_modules\primeng\fesm2015’在'D:\Proyectos trabajo\Plots\node_modules\primeng\fesm2015‘中
我读到它与导入v2的方式有关，但我不理解正确的方法，我试图使用以下方法：
import Chart from 'chart.js';
但我在“chart.js”中有一个
浏览 4提问于2022-01-07得票数 4
1回答
我正试着定期更新图表。数据正在生成数据集，但我无法让它绘制图表。我做错了什么？
const ctx = document.querySelector('#apichart canvas').getContext('2d');
const apichart = new Chart(ctx, {
type: 'line',
data: {datasets:[{
label:'Pressure',
data: [1025,1000],
fill:false,
borderColor: '
浏览 1提问于2021-12-15得票数 2
回答已采纳
我的网页以百分比指定CPU使用率，每10秒更新一次。那么，是否可以使用Chart.js接口的饼图来显示实时内容？
一般来说，Chart.js应用编程接口的饼图支持实时行为还是动态行为？
浏览 0提问于2014-07-16得票数 1
目前，我使用它将数据添加到我的图表中：
targetChart.addData(value,targetDataSetIndex,"");
因为我认为这会将数据添加到特定的集合中，添加一个空标签。
但这并不管用。
然后，我尝试通过在Chart.js脚本中引入一个新方法来自己做这件事，如下所示：
addDataValueToSpecificDataSet :function(value,datasetIndex)
{
this.datasets[datasetIndex].points.push(new this.PointClass({
浏览 0提问于2016-10-24得票数 4
回答已采纳
我有一个用chart.js显示在网页上的线条图，但是我的时间数据在UTC。我想把它转换成丹佛时区在图表上显示。Chart.js有一个，但我不知道如何使用它。
我包括了以下脚本：
<script src="./chart.js/dist/Chart.bundle.js"></script>
<script src="https://cdn.jsdelivr.net/npm/luxon@1.15.0"></script>
<script src="https://cdn.jsdelivr.net/npm/
浏览 0提问于2019-07-23得票数 3
回答已采纳
我的朋友让我做一个简单的应用程序，从Excel文件中生成图表(条形图、曲线图)。我选择使用JavaScript作为一种语言，因为我已经了解了强大的chart.js。然而，在使用chart.js之前，我必须从Excel文件中收集数据。那么如何通过JavaScript读取Excel文件呢？
经过一些研究，我已经设法用it浏览器(使用ActiveX)做到了这一点，但我需要它跨浏览器工作。
浏览 10提问于2013-05-19得票数 14
我有一个从API获取数据的甜甜圈图表。图表显示正常，但我无法让图表数据更新，并且每2秒进行一次。我尝试并搜索了许多主题，但大多数都是过时的chart.js版本，我的javascript技能很差。
Chart.js v3.9.1
const totalRunTime = current_array.MTConnectStreams.Streams.DeviceStream.ComponentStream[12].Samples.DynamicBasicData[1];
const totalTimeRemaining = current_array.MTConnectStreams.Stream
浏览 5提问于2022-10-26得票数 0
回答已采纳
我想用重写Chart.js，我很难弄清楚如何实现日期/时间图的交互。如果您尝试在上选择一个日期范围，您将看到它过滤了其他图表。如何让Chart.js让我在它的时间刻度图上选择这样的范围呢？在默认情况下，它只允许我单击特定的日期点。
耽误您时间，实在对不起。
浏览 1提问于2017-03-17得票数 20
回答已采纳
嗨，我在chart.js上有这个配置的渲染器，我不明白为什么
这是chart.js的版本
/*!
* Chart.js
* http://chartjs.org/
* Version: 2.7.1
*
* Copyright 2017 Nick Downie
* Released under the MIT license
* https://github.com/chartjs/Chart.js/blob/master/LICENSE.md
*/
我用这个函数生成我的图表，我不知道如何解决我的问题，谢谢你的帮助。
new Chart(document.g
浏览 5提问于2022-03-06得票数 0
回答已采纳
1回答
我有一个应用程序(使用Vue)，它在不同的页面上呈现许多不同的图形。我正在添加一个PDF下载功能，允许在一个PDF中下载所有的图形。对于Pdf生成，我使用的是JsPDF。
当前，当打开包含图表的页面时，所有图表都在客户端呈现。在Chart.js中，可以保存任何图表的base64编码的字符串数据。我试图弄清楚如何在不实际呈现图形的情况下获得这个base64字符串数据。为了让chart.js创建一个新的图形，您需要为它提供一个上下文，一个html元素。当我将这个元素的css显示属性设置为none时，base64字符串数据就什么都不是了。当我尝试将元素的可见性转换为隐藏时，我会看到大量的空白显示在图
浏览 1提问于2021-01-25得票数 1
回答已采纳
1回答
因为我是Angular的新手，所以我在Graph中遇到了问题，我现在不知道如何在angular中创建它 我在Chart.js和Canvasjs中尝试过，我遇到了问题1。使用Chart.js我可以创建如下图所示的静态图形，但我不知道如何从API中获取此图形的数据。 注意:我可以使用API显示任何类型的数据，除了Graph所以，请帮助我做这个Graph的事情。 ? LineChart = {};
ngOnInit() {
// Line chart:
this.LineChart = new Chart('lineChart', {
ty
浏览 15提问于2019-03-27得票数 0
回答已采纳
我一直试图让Chart.js 2.2.1版本显示一个简单的图表使用教程从另一个网站..。即使有了最基本的数据，什么也不会显示出来。如果我使用小型化的版本，这个版本就没有CDN，没有，zip。
括号中的版本1.0.2很好，但是2.2.1版出现了很多jshint错误。
我甚至在JSFiddle上尝试过，但仍然没有最新的诗句。
作为新的javascript，我想知道是否有明显的东西我错过了，否则我将继续使用一个旧版本。
这是工作代码。我只添加了Chart.js文件的开头。
<canvas width="300px" height="300px" id="
浏览 2提问于2016-08-14得票数 2
回答已采纳
我正在接收来自API的数据，我想获取这些数据并让它填充我的图表。我可以看到调用API数据并将其传递到setState的位置，但我似乎无法正确地将这些数据传递到我的图表中。
我尝试过使用Chart.js的destroy()和update()方法，但都没有效果。我相信这只是我没有在我的应用程序中正确使用它们的问题。下面的代码不包括这些方法，因为我不知道在哪里使用它们。我还尝试将API数据推入图表的数据数组中，但没有运气。
componentDidMount() {
// create chart
new Chart(myChartRef, {
type: "
浏览 1提问于2019-08-06得票数 3
回答已采纳
1回答
我创建了一个新项目，并尝试使用ChartJS2 实现图表。
app.module.ts
...
import { ChartModule } from 'ng2-chartjs2';
@NgModule({
...
imports: [
ChartModule
],
...
})
export class AppModule {}
index.html
<script src="../node_modules/chart.js/src/chart.js"></script>
<!--<script s
浏览 3提问于2016-10-19得票数 0
回答已采纳
我正在尝试从API动态更新图表数据。我用的是角13和chart.Js 3.7.1。
我没有从他们的文档中找到任何简单的例子。
我也在网上找到了的例子，但这个例子在这里还是行不通的。是否有明确的示例/教程？
浏览 11提问于2022-03-22得票数 -1
1回答
在一个新的成员3.28副词项目中：
npm install chart.js --save
ember g component-class chart
将<Chart />插入虚拟应用程序的application.hbs中，并在加载项/component/chart.js中添加以下内容
import Chart from 'chart.js/auto';
运行中的应用程序提供：
Uncaught Error: Could not find module `chart.js/auto` imported from `chartjs-test/components/ch
浏览 10提问于2022-01-07得票数 0
回答已采纳
2回答
我试图使用Chart.js将从ajax调用获得的数据添加到图表中。
下列代码不起作用：
$(document)
.ready(function () {
fetchBeds($("#site").val());
var ctx = $('#paretoChart');
var paretoChart = new Chart(ctx);
fetchChartData(1, '2016-10-28', '2016-11-2&#
浏览 2提问于2016-11-01得票数 0
回答已采纳
1回答
我想让intellisense为远程库(Chart.js)工作，而不把它作为依赖项(它是通过CDN加载的)。
因此，我使用@types/chart.js来允许智能。
yarn add -D @types/chart.jsadd /// <reference types="chart.js" /> to my脚本
它与雅恩经典和npm的工作很好，但我不能让它与纱2 Pnp。每当我尝试，我得到错误的Cannot find type definition file for 'chart.js'.ts(2688)和智力(显然)停止工作。
在不使用加载程序的情
浏览 7提问于2021-01-06得票数 3
我有一个最初使用options对象创建的chart.js图表对象myBarChart options={
scaleOverride : true,
scaleSteps : ymax,
scaleStepWidth : 1,
scaleStartValue : 0,
...
} 其中ymax被计算为充当“suggestedMax”。 用户通过单击图表的条形图将数据添加到图表；更新功能访问数据的方式为 myBarChart.datasets[0].bars[i].value = newValue[i] (循环遍历所有直方图箱)。这个模式以及docu
浏览 31提问于2019-01-09得票数 1
雷达图表似乎只有一个填充颜色的数据集。
我想让填充的颜色跨轴变化。类似于这样的东西：
这在Chart.js中是可能的还是我应该选择另一个库？
浏览 10提问于2022-06-06得票数 1
回答已采纳
我希望有人能帮助我！我使用的是chart.js 3.5.1，并且在脑海中有一个特定的图表。然而，许多在线文档似乎都是针对旧版本的chart.js的。我需要一个简单的折线图，在y轴上和零下都有数据。为了强调这一点，我想在0上画一条更暗的轴线，所有在线材料都建议我可以使用zeroLineColor。然而，新版本的chart.js似乎不支持这一点。所有的在线材料都在使用xAxis:[]和yAxis:[]，而我的只是使用x:{}和y:{}，这让我认为zeroLinecolor属性已经被弃用了，如果是这样的话，我需要的东西可以用另一种方式实现吗？ 干杯
浏览 49提问于2021-09-27得票数 1
回答已采纳
我已经疯了，弄不明白这件事。我的API中的数据格式如下：
"data": [
{
"sr_count": 91,
"month_name": "October",
"month_num": 10,
"year": 2017
},
{
"sr_count": 50,
"month_name": "September",
浏览 2提问于2017-10-23得票数 2
回答已采纳
1回答
我所要做的就是设置一个简单的全局选项，用逗号来格式化Y轴和工具提示的数字。我已经尝试了上百万的例子，但我无法让它起作用。
版本: Chart.js/2.2.2
我想用逗号格式化所有的Y轴和工具提示值，使用一个简单的全局选项。使用全局操作更容易的原因是，我正在生成并动态发送JSON数据，在此基础上添加更多选项将是一件痛苦的事情，因为所有的数字都需要保持相同的行为。
浏览 5提问于2016-09-12得票数 2
回答已采纳
我试图从一个addData回调中调用Chart.js的signalR方法，以便根据服务器输入动态地向图表添加数据。但是，当触发回调时，Chart.js上的Chart.js方法将引发异常：
Uncaught : window.myChart.addData不是函数
Javascript:
var ctx = $("#myChart");
window.myChart = new Chart(ctx, {
type: 'line',
data: {
labels: ["Red",
浏览 2提问于2016-06-06得票数 0
回答已采纳
1回答
在使用时，可以使用谷歌电子表格作为数据源吗？
我想使用Chart.js创建一个包含多条线的折线图，并且希望用户能够一次查看所有线或选择要显示的某些线。使用Chart.js看起来相当简单，然而，我想知道如何使图表对客户端可更新。
客户已经在谷歌电子表格中有一个数据集，他们定期更新，所以我想让网站上的图表随着电子表格一起更新。
我是否只需要将Google电子表格导出为JSON文件？
浏览 9提问于2017-08-18得票数 0
我正在尝试用chart.js创建图表。我遵循了chart.js网站上的示例代码，并且能够让示例代码正常工作。我尝试修改代码，从创建图表的javascript文件外部处理图表的数据，然后通过图表参数提供数据。这样做，我会得到以下控制台错误：
我的data.js文件中有以下数据：
export const UserData = [
{
id: 1,
year: 2018,
users: 2000,
},
{
id: 2,
year: 2019,
users: 2500,
},
{
id: 3,
year:
浏览 32提问于2022-09-01得票数 0
1回答
我很难让chart.js在时间轴上运行。
我有以下简化代码：
<html>
<head>
<!--
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.bundle.js"></script>
-->
<script src="https://cdn.jsdelivr.net/npm/moment"></script>
<s
浏览 7提问于2021-06-29得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
