在我的一个项目中，我使用Chart.JS进行一些与图形相关的工作。其中我对图例、记号、scaleLabel和工具提示使用不同的字体大小。在大型设备上一切正常，但当我在移动设备上测试图形时，问题就出现了。字体大小变得太大。所以我的计划是使用两种不同的字体大小来解决这个问题。 但是，我没有在chart.js中找到任何选项来使用多种字体大小，或者没有选项来使用px以外的任何其他单位。 有人能帮我解决如何为chart.js调整不同设备上的字体大小吗？
浏览 16提问于2021-01-11得票数 0
我正在尝试用QuickChart和Chart.Js创建图形。我有以下内容，但想知道如何更改所有文本的字体大小和字体样式。我也想把YAxis改为10，有人能帮忙吗？
浏览 3提问于2020-08-28得票数 1
回答已采纳
8回答
在chart.js中，如何在不触及全局配置的情况下为x轴标签设置字体大小？
我已经尝试过设置'scaleFontSize‘选项-- my对象。我也试过设置：
{
...
scales: {
xAxes: [{
scaleFontSize: 40
...
}]
}
}
浏览 25提问于2016-07-08得票数 66
回答已采纳
我正在使用Chart.js。
我想让我的图表图例标签字体更大。
所以我试着这样做：
<code>A0</code>
但它不起作用。我该怎么办？
浏览 28提问于2019-08-20得票数 3
回答已采纳
1回答
我想在Chart.js中更改图片组的宽度。原因是，如果工具提示太宽，就会隐藏在iFrame下面。
我试着移动它们，但我只找到了选项position: 'nearest'。但这并不能解决问题。
是否没有选项将工具提示的宽度设置为200 no (带换行)？
我只找到了边框宽度或字体大小(应该更大)的选项。
浏览 1提问于2019-02-22得票数 1
回答已采纳
我在这里使用的是最新版本的chart.js ( CDN网站的第一个链接)。我想更改pointLabels的字体大小，但失败了。我也无法为刻度设置display: false。它们唯一起作用的就是勾号的字体大小。有人能帮我吗？
const data = {
labels: [
'Eating',
'Drinking',
'Sleeping',
'Designing',
'Codin
浏览 0提问于2021-04-11得票数 1
1回答
我发现chart.JS已经有一段时间了，我想在我的网站上实现它。我在他们的网页上写了最简单的代码，工具提示确实出现了，但是当我在我的CSS中使用html标签的zoom属性时(因为我想让整个页面变小)，工具提示似乎变得疯狂。其中一些不再出现，而另一些则仅在悬停图表的某些区域时出现。有什么办法解决这个问题吗？
浏览 8提问于2021-05-20得票数 0
回答已采纳
3回答
我对CHART.JS的图形有问题。当我把时间间隔为2年时，几个月的标签会重叠。我想要所有的标签都出现，时间间隔并不重要。
var g = new Chart(ctx, {
type: 'bar',
data: {
labels: labelsHeader,
datasets: listData,
},
options:{
maintainAspectRatio: false,
}
});
浏览 0提问于2019-07-24得票数 1
回答已采纳
(嘿！)我发现了JS和Chart.js，我需要更改dataset中标签的字体大小和字体粗细，但我在文档或谷歌上找不到任何东西。有没有人能给我一些建议？ import Chart from 'chart.js'
let ctx = document.getElementById('rentResumeChart').getContext('2d');
let rentResumeChart = new Chart(ctx, {
responsive: true,
maintainAspectRatio: false,
type: 'b
浏览 10提问于2019-03-21得票数 1
回答已采纳
1回答
我用chart.js创建了一个线条图。我将图例符号形式从rects更改为圆圈，使用：
legend: {
display: true,
labels: {
usePointStyle: true,
},
}
我想改变圆圈的大小。但是，根据文档，只有当我还更改字体大小时，这才是可能的：
标签样式将匹配相应的点样式(大小基于fontSize，在本例中不使用boxWidth )。-
有没有人知道是否还有另一种选择来改变尺寸？还是必须使用generateLabels()。
下面是一个来查看这一点。
浏览 2提问于2019-02-25得票数 9
回答已采纳
正在尝试在chart.js 3.2.1版中更改条形图的字体大小。以下方法不起作用，到目前为止，我在网上找到的选项适用于不同的版本。如何更改以下条形图的字体大小。谢谢。
<script>
var ctx = document.getElementById('myChart').getContext('2d');
var myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: ['Red', &#
浏览 16提问于2021-05-19得票数 0
回答已采纳
我使用的是Chart.js版本: 2.7.3
我的图表标题有三行。我想把最上面一行的字体大小定为16，然后是第二行14和第三行12。我不知道这是否可行，而且还没有找到解决办法。
下面是我的代码的一部分，它定义了我的图表的选项.
options: {
title: {
display: true,
// Supply the title as an array and each array index prints on a separate line in the title section
text: ['My Chart
浏览 3提问于2019-04-16得票数 6
回答已采纳
我使用Chart.js版本: 2.1.6创建一个雷达图表，如下所示：
我正在尝试禁用点标签(在图片上标记为红色)。
我尝试过几种方法，最后将标签的字体大小设置为0，但没有产生效果。请帮忙，如果可以的话，这是我的代码：
var radarChartData = {
labels: ["some labels"],
datasets: [
{% for data in datas %}
{
backgroundColor: "rgba({{ radarColors[loop.index
浏览 2提问于2016-06-25得票数 2
回答已采纳
如果X轴满足特定条件，我会尝试强调X轴上的特定值。 例如，在我的codepen中，我只想更改“蓝色”栏的字体大小。使用Chart.js可以做到这一点吗？ var ctx = document.getElementById("myChart").getContext('2d');
var myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: ["Red", "Blue", "Yellow", "Gree
浏览 19提问于2019-03-01得票数 0
回答已采纳
我试图增加标签的字体大小在一个图例中，我已经完成了与chart.js。随信附上一张截图：
我想增加“标签1,2,3”的字体大小。
下面是我现在使用的javascript配置：
var data = {
labels: x_axis_labels,
datasets: [
{
label: 'Label 1',
data: data_1,
borderColor: 'rgb(46,138,207)',
backgroundColor:
浏览 4提问于2022-06-23得票数 1
回答已采纳
1回答
我正在使用chart.js来绘制甜甜圈图表，我试着用下面的代码改变标签的字体大小，但对我不起作用。
此外，我尝试将其包装成两行以显示完整的标签，但包装也不起作用。
附件是阿拉伯联合酋长国标签的示例图表，该标签正在剪切，没有完全显示给我/
我的代码是：
var myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: ["Red", "Blue", "Yellow", "Green", "Purple", "O
浏览 0提问于2018-04-16得票数 1
我正在使用编写测试，它使用chart.js创建了一个线条图。当我运行测试时，我会出错。
ReferenceError:未定义ResizeObserver
[ 290 ]\x} 291 \ ngAfterViewInit() {> 292 \ this.chart =新图表(this.chartRef.nativeElement，this.chartConfig)；{ at (../../../node_modules/chart.js/dist/chart.js:2428:20) at DomPlatform.addEventListener (../../../node_module
浏览 8提问于2021-08-06得票数 10
回答已采纳
我正在使用Chart.js。当我使用设定值时，图表显示正确。但是，当我使用变量时，图表不会显示，并且控制台中出现错误。我不理解错误消息。 图表如下： function showChart(chartName, xAxis, yAxis){
alert("chartName: " + chartName);
alert("xAxis: " + xAxis);
alert("yAxis: " + yAxis);
//Charts
//Select the chart element
const ctx
浏览 105提问于2021-07-05得票数 0
3回答
我很难在y轴响应中制作标签。我希望标签移动到多行，并在空间不足时具有相应的字体大小。我正在使用chart.js数据标签库在horizontalBar Graph.Also上添加标签。由于外部图表容器，标签将被隐藏。
var chart = new Chart('ctx', {
type: 'horizontalBar',
data: {
labels: ["Something something something", "blah blah..", "blah blah..",
浏览 0提问于2018-05-23得票数 8
回答已采纳
我正在使用Chart.js在我的网站上绘制图表。问题是，如果数据的值为0，则需要更改图中数据的样式。
例如，我有数组(array1)，它具有这样的数据: 0；0；0.125；0；0；0；0；0；
这样就会显示这样的聊天：
生成样式的代码如下所示：
function MoreChartOptions(){}
var ChartData = {
labels : labelsArray,
datasets : [{
fillColor : "rgba(52,152,219,1)",
浏览 2提问于2015-02-04得票数 1
回答已采纳
角图:误差ReferenceError: UIChart.initChart (chart.js:53)中没有定义图表
进口：
"../node_modules/chart.js/dist/Chart.js",
"../node_modules/chart.js/dist/Chart.bundle.js",
"../node_modules/chart.js/dist/Chart.min.js",
"../node_modules/chart.js/dist/Chart.bundle.min.js"
import { Ch
浏览 0提问于2018-11-12得票数 7
回答已采纳
我得到了这个错误： ERROR RangeError: Maximum call stack size exceeded
at ChartElement.update (Chart.js:11474)
at fitBoxes (Chart.js:7127)
at fitBoxes (Chart.js:7145)
at fitBoxes (Chart.js:7145)
at fitBoxes (Chart.js:7145)
at fitBoxes (Chart.js:7145)
at fitBoxes (Chart.js:7145)
浏览 23提问于2020-07-25得票数 1
回答已采纳
我正在做我的第一个Cordova项目，并尝试使用Chart.js。文档指出，Chart.js应该包含如下内容：
<script src="Chart.js"></script>
<script>
var myChart = new Chart({...})
</script>
我使用bower安装库，它现在位于www/lib/chart.js下。当我加载Chart.js或lib/chart.js时，Chrome会给我Failed to load resource: the server responded with a s
浏览 6提问于2017-02-01得票数 4
我正在工作的角度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
回答已采纳
2回答
使用chart.js 2.5.0和webpack 2.2.1，最小化后的束数为357 K。我尝试过各种选择，但似乎没什么大不了的。
使用这些文件：
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Hello webpack</title>
</head>
<body>
<div id="root"></div
浏览 4提问于2017-02-15得票数 1
我正在尝试导入像popper、jquery和chart.js这样的库，以便在angular项目中使用。 我已经使用cli下载了它们，并在我的index.html和angular.json文件中引用了它们。 index.html <head>
...
<script src="node_modules/chart.js/dist/Chart.js"></script>
</head> angular.json ...
"styles": [
"node_modules/boots
浏览 15提问于2019-09-06得票数 0
回答已采纳
我正在尝试将Chart.js与node.js结合使用。我从以下git源代码下载了Chart.js：并使用php进行了测试，一切都很顺利。
现在我正在与node.js合作，但我有一个问题：
资源被解释为脚本，但使用MIME类型text/html传输："url/Chart.js/Chart.js“localhost/:3 Uncaught :意外令牌< /Chart.js/Chart.js:1
debug.html
<html><head>
<script src="Chart.js/Chart.js"></scr
浏览 1提问于2014-01-29得票数 2
回答已采纳
我有一个非常简单的webpack项目使用超文本标记语言插件从一个单一的js文件条目生成一个Html文件。
我用"npm install c3“安装了c3
chart.js
import * as c3 from "c3";
var chart = c3.generate({
bindto: '#chart',
data: {
columns: [
['data1', 30, 200, 100, 400, 150, 250],
['data2', 50, 20,
浏览 0提问于2020-01-21得票数 1
我正在尝试将图表包含到我的Ionic应用程序中，但遇到错误。我已经将angular.js文件夹和chart.js文件夹下载到我的lib文件夹中，并在index.html中添加了以下行：
<script src="lib/angular-chart.js/dist/angular-chart.js"></script>
<script src="lib/chart.js/dist/Chart.js"></script>
<script src="lib/angular-chart.js/dist/ang
浏览 11提问于2016-07-04得票数 4
回答已采纳
我想在aurelia项目中使用chart.js，但我遇到了错误。如何将第三方节点包添加到aurelia应用程序中？
我在用奥雷利亚-克莱，BTW
以下是我所做的
npm install --save chart.js
在aurelia.json中，我添加了以下内容
"dependencies": [
...,
{
"name": "chart.js",
"path": "../node_modules/chart.js/dist",
"main": "Char
浏览 2提问于2016-12-12得票数 9
回答已采纳
我使用Chart.js(新版本)作为：
<script src="~/Plugin/Chart.js/src/chart.js"></script>
但是当我用铬演示时，我会得到一个错误：
chart.js:4 Uncaught ReferenceError: require is not defined
浏览 13提问于2016-07-04得票数 12
回答已采纳
我找到了一个使用Chart.js和创建HTML文件的示例。这个例子运行得很好。现在我想在本地使用chart.js。因此，我换了下面这一行：
// <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/0.2.0/Chart.min.js"
进入：
<script src="C:\Temp\Chart.js" type="text/javascript"></script>
(The file: Chart.js is copied into th
浏览 4提问于2020-02-17得票数 1
1回答
我想在我的项目中使用，所以我已经安装了chart.js和具有bower的角图js，有以下步骤
添加.bowerrc
{“解决器”：“bower-npm-解析器”}
而且比
npm install -g bower-npm-resolver
bower install npm:chart.js --save
bower install --save angular-chart.js
我的bower_components文件夹也有angular-chart.js和chart.js文件夹
|-- angular
|-- angular-chart.js
|-- chart.js
由于我没
浏览 4提问于2016-09-08得票数 1
回答已采纳
5回答
我有一个网络应用程序，运行webpack，打字记录和吞咽。我想使用chart.js库，我已经安装了chart.js npm包。我试图在其中一个JS文件上定义chart.js，我得到了以下内容：error TS2307: Cannot find module 'chart.js'
我的JS文件如下所示：
import Chart = require( "chart.js" );
tsconfig：
{
"compilerOptions": {
"module": "commonjs"
},
浏览 11提问于2016-04-12得票数 4
回答已采纳
1回答
Chart.js面
、、、
在chart.js中是否有任何插件或配置选项来创建分面图表？
我需要使用chart.js创建分面图表。图面图在多个图表之间共享X和/或Y轴。(请参阅附件中的图像)，它是许多设计可视化问题的一个非常常见的解决方案，但在chart.js中却没有。
Chart.js V3添加了，它可能用于在chart.js中创建分面图表。
刻面图的例子
浏览 7提问于2022-08-12得票数 0
回答已采纳
我使用Angular2-rc4和角-cli webpack，并希望实现一个chart.js库。
我已经使用以下方法将chart.js安装到我的项目中：
安装chart.js --保存
然后，我尝试导入组件中的chart.js：
import {Component, OnInit, ViewChild} from '@angular/core';
import 'chart.js/src/chart.js';
declare let Chart;
@Component({
selector: 'app-dashboard',
te
浏览 11提问于2016-08-22得票数 18
1回答
我想问一下如何安装chartjs@2.9.4与我的laravel应用程序。
我现在使用cdn链接，但稍后它不会是我的一个选择。
已使用的cdn链接：
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js"</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.4/Chart.min.js"></script&
浏览 7提问于2021-05-18得票数 2
回答已采纳
我在asp内核2.0中有一个项目。
我在web.config中建立了下一个规则：
<rewrite>
<rules>
<rule name="wwwroot" >
<match url="([\S]+[.](js|css|png|gif|jpg|jpeg))" />
<action type="Rewrite" url="wwwroot/{R:1}" logRewrittenUrl="true
浏览 0提问于2017-10-27得票数 0
回答已采纳
折叠错误：
ERROR TypeError: Cannot read property '15' of undefined
at ChartElement.getPixelForValue (Chart.js:14599)
at ChartElement.updateElement (Chart.js:5930)
at ChartElement.addElementAndReset (Chart.js:3781)
at ChartElement.insertElements (Chart.js:4068)
at ChartElement.resyncElements (Char
浏览 1提问于2020-07-30得票数 0
回答已采纳
我试图在我的应用程序中使用，尽管我得到了以下错误：
Error: [$injector:nomod] Module 'chart.js' is not available
我遵循了其他问题的建议，在html文件中的角图表to之前包含了Chart.js，尽管这对我没有用。
下面是我安装的库的版本：
下面是我的目录结构：
app/
----libs/
------Chart.js/
----------src/
------------chart.js
------angular-chart.js/
--------dist/
----------angu
浏览 4提问于2016-06-19得票数 0
1回答
当我使用包含图表的组件运行测试时，我会得到错误TypeError: Cannot read property 'getBasePixel' of undefined。我不知道是怎么回事，我试着去查东西，但是我没有找到任何相关的东西。我有测试导入图表模块，我真的想不出任何可能是错误的东西。我唯一的想法可能是在异步beforeEach中导入图表模块，这意味着它无法立即用于组件？或者因为它是在“较小的”浏览器中呈现的，所以它不能正常工作？我搞不懂。
我的测试看起来如下：
import { HttpClientModule } from '@angular/common/htt
浏览 2提问于2020-06-11得票数 0
回答已采纳
我在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
我正在尝试使用NG2-Charts ()的基本示例。
在其github回购()中提到：
重要:在应用程序中嵌入Chart.js是强制性的！
<script src="node_modules/chart.js/src/chart.js"></script>
但是当我嵌入这个脚本时，它显示了一个错误。
chart.js:4未定义ReferenceError: require未定义
有谁知道怎么解决这个问题吗？谢谢
浏览 4提问于2016-10-14得票数 1
回答已采纳
1回答
我正在编写一些Jenkins插件，我想在大多数插件中使用Chart.js。但是每个插件都负责生成一小部分页面，这意味着我在页面上多次包含Chart.js：
<script src="${rootURL}/plugin/jenkins-report-rpms/Chart.js"></script>
<script src="${rootURL}/plugin/jenkins-report-jck/Chart.js"></script>
<script src="${rootURL}/plugin/jen
浏览 5提问于2016-01-07得票数 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
我的应用程序使用的是对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
我想使用angular-chart.js，所以我按照安装说明，首先从Charts.js 的github下载了最新版本，然后从github 下载了最新版本的angular-charts.js。
我将此文件复制并粘贴到我的项目中：
这个文件来自chart.js chart.js (我从chart.js复制了这个文件，注意第一个字母是小写的)
THis文件来自angular-chart.js angular-chart.min.js
都包含如下所示
<script src="/myApp/chart.js"></script>
<script src=&
浏览 6提问于2016-10-24得票数 4
我使用带有typescript + react的react-chartjs-2，并试图创建一个简单的条形图，但我的浏览器控制台抱怨width未定义。我不太确定下面是否有什么我没有配置的东西？ 浏览器控制台错误： Uncaught TypeError: Cannot read property 'width' of undefined
at n.draw (Chart.js:15474)
at Object.draw (Chart.js:7231)
at $t.draw (Chart.js:9825)
at $t.render (Chart.js
浏览 12提问于2020-03-30得票数 0
我使用的是有角度和离子的图表：
安装：
安装chart.js --保存
HTML
<!-- Graph -->
<div class="chart">
<canvas #myChart></canvas>
</div>
TS
import { Chart, registerables } from 'chart.js';
Chart.register(...registerables);
const ctx = this.myChart.nativeElement;
this.ch
浏览 0提问于2021-07-01得票数 0
在chart.js中，如何多行显示标题，如下图所示？我尝试使用title: 'Chart.js\nLine Chart'和'Chart.js<br>Line Chart'，但它们都不起作用。
浏览 5提问于2018-03-29得票数 5
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
