显示'[object]‘而不是value的Datalabels插件图表
问题背景
在使用Datalabels插件时，有时会遇到图表上的数据标签显示为[object]而不是预期的数值或文本。这种情况通常是由于数据格式不正确或插件配置不当引起的。
基础概念
Datalabels是一个用于在图表上添加数据标签的JavaScript插件，支持多种图表库如Chart.js、Highcharts等。它允许你在图表的每个数据点上显示额外的信息，如数值、百分比等。
相关优势
- 增强可读性：通过数据标签，用户可以更直观地理解图表中的数据。
- 自定义性强：可以自定义标签的样式、位置和内容。
- 灵活性高：支持多种图表类型和数据格式。
类型
Datalabels插件支持多种图表类型，包括但不限于：
- 折线图
- 柱状图
- 饼图
- 散点图
应用场景
- 数据报告：在商业报告中显示关键指标。
- 数据分析：帮助用户快速理解数据分布和趋势。
- 仪表盘：在实时监控系统中显示关键数据点。
问题原因
显示[object]的原因通常有以下几种：
- 数据类型不匹配：传递给Datalabels的数据类型不正确，可能是对象或其他非字符串类型。
- 配置错误：Datalabels插件的配置选项设置不当，导致无法正确解析数据。
- 数据格式问题：数据源本身的格式有问题，导致插件无法正确读取数据。
解决方法
以下是一些常见的解决方法：
1. 检查数据类型
确保传递给Datalabels的数据是字符串或数字类型。例如：
options: {
plugins: {
datalabels: {
formatter: (value, context) => {
return value.toString(); // 确保返回字符串
}
}
}
}2. 正确配置插件
确保Datalabels插件的配置选项正确无误。例如：
options: {
plugins: {
datalabels: {
color: '#000',
anchor: 'end',
align: 'top',
formatter: (value, context) => {
return value;
}
}
}
}3. 处理数据源
如果数据源本身有问题，可以在传递给插件之前进行处理。例如：
const processedData = data.map(item => ({
...item,
label: item.value.toString() // 确保label是字符串
}));示例代码
以下是一个使用Chart.js和Datalabels插件的示例：
<!DOCTYPE html>
<html>
<head>
<title>Datalabels Example</title>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-datalabels"></script>
</head>
<body>
<canvas id="myChart"></canvas>
<script>
const ctx = document.getElementById('myChart').getContext('2d');
const chart = new Chart(ctx, {
type: 'bar',
data: {
labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'],
datasets: [{
label: '# of Votes',
data: [12, 19, 3, 5, 2, 3],
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)',
'rgba(75, 192, 192, 0.2)',
'rgba(153, 102, 255, 0.2)',
'rgba(255, 159, 64, 0.2)'
],
borderColor: [
'rgba(255, 99, 132, 1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)',
'rgba(75, 192, 192, 1)',
'rgba(153, 102, 255, 1)',
'rgba(255, 159, 64, 1)'
],
borderWidth: 1
}]
},
options: {
plugins: {
datalabels: {
color: '#000',
anchor: 'end',
align: 'top',
formatter: (value, context) => {
return value.toString();
}
}
}
}
});
</script>
</body>
</html>参考链接
通过以上方法，你应该能够解决Datalabels插件显示[object]的问题。如果问题仍然存在，请检查数据源和插件配置，确保所有数据都是正确的字符串或数字类型。
相关·内容
我使用NodeJS和直接将图形呈现给一个文件，它工作得很好。
我是通过安装 npm模块来完成的。
为了在图形上显示标签，我使用了正式的ChartJS插件
但是似乎画布模块有一个不同的激活ChartJS插件的方案，而且很可能我不正确地激活了数据标签插件。所以我不能把标签显示在图表上。
const Chart = require('chart.js');
const datalabels = require('chartjs-plugin-datalabels')
const { CanvasRenderService } = require('chartj
浏览 1提问于2020-08-06得票数 0
回答已采纳
我的Range8应用程序使用了一些图表，这些图表是我使用Cartjs (使用ng2-charts)创建的。
对于一个图表，我需要显示每个数据点的数据标签。因此，我将chartjs-plugin-datalabels添加到项目中，导入了插件
import * as DataLabelPlugin from 'chartjs-plugin-datalabels'
将其添加到图表的插件列表中
chartPlugins = [DataLabelPlugin]
并相应地配置如下：
plugins: {
datalabels: {
align: "top"
浏览 6提问于2020-01-12得票数 0
你好，我想在有NG2图表的角度项目的chartOptions中使用数据标记：
根据文档，我添加了以下config对象：
@ViewChild(BaseChartDirective) chart: BaseChartDirective | undefined
public pieChartOptions: ChartConfiguration['options'] = {
responsive: true,
plugins: {
legend: {
display: true,
position: 'top
浏览 5提问于2022-11-02得票数 0
我正在使用Ionic 3，我正在显示一个条形图，我需要在图表上的条形图旁边显示数据标签，就像这个问题how to display data values on Chart.js 我按照到目前为止为chartjs-plugin-datalabels找到的说明进行了操作，但不起作用，它在我的图表上没有显示任何数据标签。 我通过npm安装了chartjs和chartjs-plugin-datalabels，它们在我的package.json中看起来像这样 "chart.js": "^2.7.3",
"chartjs-plugin-datalabels"
浏览 25提问于2019-02-06得票数 2
回答已采纳
我正在从app.js文件中传递对象并将其串化，但它在数据库中不能正常工作，并显示[object，如图所示 ? 以下是我的代码:它在ejs中，但与js几乎相同，只是将变量作为<%- variable %>传递，而不是${} app.js let bubbleData=[];
let dataObj = {
"pastObservation": [
{
"value": "
浏览 62提问于2021-08-14得票数 4
回答已采纳
4回答
我有一个问题，以获得正确的数据标签插件与我的图表在我的角5应用程序。
图表按预期显示，除非插件没有创建标签。也没有产生控制台错误，这似乎很奇怪。
我的“进口”部分看起来如下：
import {Chart} from 'chart.js';
import 'chartjs-plugin-datalabels';
我的图表创建部分看起来如下：
ngAfterViewInit() {
this.canvas = document.getElementById(this.chartID);
this.canvas.height = this.graphH
浏览 3提问于2018-03-31得票数 9
回答已采纳
当试图将系列添加到高图表时，只显示系列的名称，而不显示图形本身。
如果我手动输入序列，图表将正确显示，但是当它通过.each循环完成时，它只显示添加的系列名称。
这是我的代码：
function my_pie(){
// Build the chart
$('#pie_chart').highcharts({
chart: {
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false,
浏览 3提问于2015-02-11得票数 1
回答已采纳
我试图使用chartjs-plugin-datalables对特定的图表使用vue-chartjs。因此，首先，我从我的main.js文件中注销了插件，因为它是在导入时在全球注册的。
import Chart from 'chart.js';
import ChartDataLabels from 'chartjs-plugin-datalabels';
Chart.defaults.global.plugins.datalabels.display = false;
然后我要为特定的图表添加插件。但没有任何标签显示。
import { Pie } from
浏览 0提问于2020-06-17得票数 2
回答已采纳
2回答
我想显示百分比在我的jquery 3D谷歌图表(请参阅附图)。请告诉我如何做到这一点。
我使用了下面的代码来实现jQuery谷歌图表。我得到的3D图表，但希望显示百分比在每个不稳定的谷歌图表。
$('#pieChart').gchart({
type : 'p3',
series : data,
legend : 'top',
dataLabels : [ 'HR', 'SRM', 'MM', 'SD' ],
pieSliceText: &#
浏览 3提问于2014-06-17得票数 0
1回答
大家好！
我使用chartjs-plugin-datalabels通过显示其栏上方的值来防止不可悬空的微小值，但是当其中一个值最高时，数据标记就会超过图表容器的限制。
更新：
另外，您可以使用suggestedMax选项，我认为这比提供一个填充更好
const options = {
plugins: {
datalabels: {
color: '#374774',
font: { family: 'MyriadSemiBold', size: 14 },
align: 'end',
浏览 3提问于2021-08-03得票数 5
回答已采纳
我试图在下面的ngchart水平条形图上添加粉红色散点点(但不是绿色条)的标签。
但是，如果我试图使用：
import ChartDataLabels from "chartjs-plugin-datalabels";
我得到以下错误：
Error: node_modules/chartjs-plugin-datalabels/types/context.d.ts:1:16 - error TS2724: Module '"../../@types/chart.js"' has no exported member '
浏览 17提问于2022-09-02得票数 0
回答已采纳
最近我在工作的一个项目上做了一些前端的工作，我遇到了一些问题。我们在网站上显示了一个图表，它显示了从数据库中提取的一些实时数据。
这是为创建图形而编写的代码：
const weeklyBarData = {
labels: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday'],
datasets: [
{
label: 'Pens Assembled',
backgroundColor: 'r
浏览 0提问于2018-11-14得票数 1
回答已采纳
1回答
我使用的是angular 7的ng2图表。我有一个曲线图 如何增加图例和图表之间的间距？ 我正试着这样做，但它不起作用。 public pieChartOptions: ChartOptions = {
responsive: true,
rotation: 0,
plugins: {
afterFit: function(chart, options) {
chart.plugins.register({
afterFit: function() {
this.height = this.h
浏览 9提问于2019-03-24得票数 1
树状地图在闪闪发亮的情况下工作得很好，但当我转换成shinydashboard时，树状地图就停止工作了。现在只显示一个空白块。有什么办法解决这个问题吗？
这是我的服务器
output$TreeMap<-renderHighchart2({TM1<-hctreemap2(data = M,
group_vars = c("Status","Class","Order", "Family","Species&
浏览 0提问于2017-10-11得票数 0
回答已采纳
我是vue和顶点图表的新手，基本上我需要的是从顶点图表选项中调用一个方法，我创建了一个文件，显示了我遇到的问题：
我需要从currencyValue调用chartOptions.dataLabels方法
dataLabels: {
enabled: true,
offsetX: -25,
formatter: function(val) {
return val + " Reais"; <--- This works
// return this.currencyValue(val) <
浏览 2提问于2022-04-07得票数 0
回答已采纳
2回答
我现在真的被卡住了。
使用Chart.js v3.2.1显示一些图表，这些图表工作得很好。
然后，当我尝试使用chartjs- plugin -datalabels插件在圆环图上显示标签时，该图表不再显示。
我看不出我做错了什么。我需要帮助！
注意:谷歌和Stackoverflow上有很多类似的问题，但大多数都是关于以前的版本，但我的工作只是批准我使用最新版本的Chart.JS。
//DOUGHNUT GRAPH
var doughnutChartData = {
labels: [
'Dr @ Fault',
'TP @ Fault
浏览 0提问于2021-05-20得票数 0
1回答
我使用高图表js来创建行图表，我使用php作为json响应。问题是，当我从响应填充图表时，年份是显示的，但线条不是绘制的。
$(document).ready(function () {
$.ajax({
type: "GET",
url: 'resp_highChart.php',
dataType: "json",
contentType: "application/json",
success: function (response) {
浏览 1提问于2016-06-16得票数 1
回答已采纳
2回答
在第一个图表"config.categoriesChart“的条形单击事件中得到控制台错误"chart.js:10403 Uncaught TypeError:无法读取未定义的属性'handleEvent‘”，该以chart.legend.handleEvent(args.event)的形式显示；
该问题发生在销毁第一个图表在栏上单击事件的第一个图表。
但是如果我使用$(‘#how_i_spend_canvas’).replaceWith($(‘’))，它的工作状态很好而不会破坏图表。
请让我看看有什么问题吗？
document.ready中的所有代码
let Char
浏览 8提问于2021-07-13得票数 0
我正在使用以下版本：
角: 14.0.6
TypeScript: 4.7.4
chart.js：^3.8.2
图表-插件-注释：^1.4.0
图表-插件-数据标记：^2.0.0
NG2-图表：^4.0.0
我正在尝试用虚拟数据创建一个简单的演示Doughnat图表。问题是，无论我尝试了什么，这些值都不会显示在图表上。我以为例帮助自己，但我发现，对于较新的版本，这种方法是行不通的。这是我迄今尝试过的..。
My app.module.ts
import { NgModule } from '@angular/core';
import { Brow
浏览 1提问于2022-07-25得票数 1
回答已采纳
我不明白为什么当我把一个漏斗图添加到我的chartjs图表中时，所有的图表在加载时都会压缩变形。每当我调整页面大小时，图表都会迅速恢复到我期望的加载方式。谢谢你的帮助。
require.config({
paths: {
chart: "//cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.min",
datalabels: "//cdn.jsdelivr.net/npm/chartjs-plugin-datalabels@0.3.0/dist/chartjs-plugin-datalabe
浏览 18提问于2021-02-17得票数 1
1回答
我试图在我创建的所有图表中为图表js数据标记插件编写一个全局格式变量。这是我的尝试-
全局变量：
var datalabels_format_sanssymb = {
function (value) {
if (value >= 1000000000 || value <= -1000000000) {
return (value / 1000000000).toFixed(1).replace(/\.0$/, '');
}
if (value >= 1000000 || val
浏览 0提问于2018-07-25得票数 2
回答已采纳
因此，我制作了这个图表，如下所示，目前它的工作原理与预期差不多，但我对ChartDataLabel plugin.For有一个问题--为什么现在ChartDataLabels会在“所有”其他图表上显示呢？没有我的实现，进口或其他任何东西。
除了我想使用的地方之外，还有什么方法可以禁用其他所有东西的“插件”吗？
import React from "react";
import {
Chart as ChartJS,
CategoryScale,
LinearScale,
BarElement,
Title,
Tooltip,
Legend,
} fr
浏览 11提问于2022-04-15得票数 1
我正在使用角(v9)、NG2-图表、chart.js (v2.9)和。
我用标签显示了我的图表，太棒了。现在，我想使用一些选项来着色标签并定位它们。
我进口的标签如下：
import * as pluginDataLabels from 'chartjs-plugin-datalabels';
这一切都很好：
public barChartOptions = {
maintainAspectRatio: false,
scaleShowVerticalLines: false,
responsive: true,
plugins: {
pluginDat
浏览 4提问于2020-10-09得票数 0
回答已采纳
1回答
我正在尝试使用高图表中的可变半径饼系列。
它工作得很好，以伪装的方式显示图表。但是我想隐藏标签，例如，在本例中，我希望国家名称消失，只显示在工具提示中。
我正在尝试使用像这样的启用数据标记
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
},
}
}
但是不要工作，我认为是因为图表的类型
浏览 0提问于2019-04-15得票数 2
回答已采纳
我使用的是chart js和angular js，我想用格式化程序显示数字或百分比，但它不起作用，所以在html中我是这样做的 <canvas baseChart class="chart" [data]="doughnutChartData" [labels]="doughnutChartLabels"
[options]="doughnutChartOptions" [chartType]="doughnutChartType"
浏览 17提问于2021-08-24得票数 0
2回答
我有一个创建一系列图表的程序，这些图表似乎是在他们自己的工作表上创建的。然后对图纸进行重命名。之后，我想将所有新创建的工作表移动到一个新的工作簿中。问题是，当我循环浏览工作簿中的工作表时，循环中似乎没有新的工作表。在项目资源管理器中，它将它们显示为图表，而不是工作表。我如何在它们之间循环，并将它们移动到新的工作簿中，因为它不会将它们作为工作表拾取？
谢谢
BeneficiaryNameFind = BeneficiaryList(i)
If InStr(1, BeneficiaryList(i), "/") > 0 Then
Benef
浏览 7提问于2015-01-22得票数 0
1回答
我的javascript代码如下：
var plot1 = jQuery.jqplot ('chartdiv', [data],
{
seriesDefaults: {
// Make this a pie chart.
renderer: jQuery.jqplot.PieRenderer,
rendererOptions: {
// Put data labels on the pie slices.
// By default, labels show the percent
浏览 0提问于2012-04-03得票数 7
回答已采纳
1回答
嗨，伙计们，我有以下显示图表的脚本
`$(function () {
$('#container').highcharts({
chart: {
type: 'line'
},
title: {
text: 'Monthly Average Temperature'
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May'
浏览 0提问于2015-04-24得票数 0
我在更改两个到达顶点图表的大小时遇到了问题。现在，作为一个占位符，我从Apex图表网站复制了启动代码，并将其粘贴到我的react应用程序中。我试图给页面一种仪表板类型的感觉，几乎没有相同大小的图表。但是，我不能增加一个图表的大小来匹配另一个图表(我需要使左边的图表更大)。 你知道我怎么解决这个问题吗？我尝试改变图表的“高度”，它们都在具有相同格式的div中(除了div的颜色之外)。下面是我从Apex图表中摘取的代码，并对其进行了略微修改。还有一张显示图表大小差异的图像。 ? 我是一个新的反应和CSS，所以我感谢任何建议(和耐心)在这里。 constructor(props) {
浏览 32提问于2021-07-27得票数 1
1回答
我对Django很陌生。我正在进行投票应用程序，并希望使用高图表来显示图形。我有一个显示所有投票的模板。我想以图表的形式在它旁边显示相应的投票结果。模板的一部分：
{% for question in poll_questions %}
<div class="col-sm-6">
<div class="panel panel-default">
<div class="panel-body">
<div class=
浏览 2提问于2016-08-25得票数 0
1回答
我有一个散点图，它使用dataLabels对某些元素快速显示有关项目的信息。
这是图表定义：
chart: {
type: 'scatter',
height: 700
},
series: [
{
data: [
{ marker: { enabled: true }, x: 1, y: 18
, dataLabels: { enabled: true, formatter: function () { return '1.0.0.1197'
浏览 0提问于2015-05-26得票数 1
回答已采纳
我有这个图表，对于不存在的数据，它将显示"undefined%“。 ? 如果数据不存在，我如何摆脱“未定义的%”，并在图形中什么也不显示？ 代码如下： import { Bar } from "react-chartjs-2";
import "chartjs-plugin-datalabels";
import { Chart } from "chart.js";
import ChartDataLabels from "chartjs-plugin-datalabels";
Chart.register(Ch
浏览 64提问于2021-11-12得票数 1
回答已采纳
2回答
我有一张表，在那里我正在生成图表。我正在生成集群列图表，我希望将图表的y轴更改为百分比。我尝试了下面的代码，它给了我一个错误
对象不支持此属性或方法。
有人知道我是怎么改变轴的吗。
任何线索都会有帮助
Sub chartResult()
Dim rng As Range
Dim cht As Object
Set rng = ActiveSheet.Range("B2:H53")
'ThisWorkbook.Sheets("Result").ChartObjects.Delete
Set sh = ActiveSheet.Shapes.AddCh
浏览 5提问于2017-07-26得票数 0
回答已采纳
1回答
我使用高图表，包装气泡图表，我需要显示不同大小的气泡，根据其价值(负值)。当我传递正值时，它工作得很好，但是当我传递负值时，圆圈的大小没有变化。有什么方法显示负值图表吗？
Highcharts.chart('container', {
chart: {
type: 'packedbubble',
height: '100%'
},
title: {
text: 'TOP Countries'
},
tooltip: {
use
浏览 0提问于2019-07-08得票数 0
1回答
我在Django应用程序中有图表2.9.3，它工作得很好。现在，我需要使用chartjs-plugin-注释将一个框添加到我的图表中，并且我遵循了所有步骤，但我无法让它工作。我使用了chartjs-plugin-注释v0.5.7，用于v2.9.3。控制台日志中没有错误。首先，使用chart.js和插件的脚本：
<script src="https://cdn.jsdelivr.net/npm/chart.js@2.9.3/dist/Chart.min.js"></script>
<script src="https://cdn.jsdeli
浏览 2提问于2022-04-11得票数 1
回答已采纳
2回答
更新系列后重新绘制太阳暴晒图
、、、、
我正在尝试更新Sunburst图表系列关于下拉列表的变化。但我的图表数据系列没有更新。现在，当我试图更新图表时，工具提示正在更新，图表没有重新绘制。下面是我的代码和JS小提琴演示网址：
var options = {
chart: {
height: '70%',
// type: 'sunburst'
renderTo: 'container'
},
plotOptions: {
sunburst: {}
},
series: [{
type: "sunburst"
浏览 5提问于2022-07-14得票数 1
1回答
如何向High图表组件中的第一个元素添加标签，如下所示：
我的图表样式代码：
chart: {
height: 143
},
plotOptions: {
area: {
fillOpacity: 0.00001
},
series: {
浏览 2提问于2016-02-01得票数 0
回答已采纳
如何使用chartjs-plugin-datalabels在Chart.JS甜甜圈图表中永久显示自定义标签 示例现在看起来如下所示： ? 在https://chartjs-plugin-datalabels.netlify.com/guide/formatting.html#data-transformation下，我发现以下代码应该将标签更改为自定义格式： formatter: function(value, context) {
return context.dataIndex + ': ' + Math.round(value*100) + '%
浏览 16提问于2019-04-08得票数 0
回答已采纳
1回答
祝你们每周快乐
我想知道您是否可以帮助我，我正在使用服务器端的Chartjs在报表中应用图表，并从前端调用它们。
我使用的技术是用类型记录和表达式开发的nodejs节点，我使用工具栏作为HTML模板，集成了Chartjs，因为除了免费，社区还强烈推荐它，但是现在我在实现上遇到了一些问题。
为了更好地集成来自服务器的图表，我使用并通过库生成图像，一旦我有了图像，我就把它传递给我的模板
所以，我想要添加子标记来分组信息，添加多级类别标记，但是当我想使用插件中的钩子时，它会抛出以下错误
如何正确访问Chartjs插件钩子？
最后，我希望取得这样的成就：
我留下的代码配置我的图形，任何类型的帮助都
浏览 6提问于2022-09-19得票数 1
回答已采纳
1回答
我想在我的一个项目中使用高级图表，但是我在Javascript上遇到了一些问题，因为我对这个语言相当陌生。我已经定制了我的当前图表，除了数据标签相互重叠，因为数据数组中有多个元素。
// The speed gauge
$('#container-speed').highcharts(Highcharts.merge(gaugeOptions, {
yAxis: {
min: 0,
max: 200,
title: {
text: 'Speed'
}
},
浏览 1提问于2015-04-14得票数 2
回答已采纳
1回答
我对高级图表非常陌生，文档对于我解决我的小问题来说是相当大的。
我正在为跑步者开发应用程序，并希望在图表上以分钟显示跑步速度:一公里一秒，以05:30的格式显示，这意味着速度5分30秒前公里或英里。
我的当前(且不起作用)代码在这里：
Highcharts.chart('container', {
yAxis: {
type: 'datetime',
categories: ['03:30','04:00','04:30','05:00','05:30','06
浏览 0提问于2018-04-12得票数 0
回答已采纳
我目前正在更新ConsoleTvs /图表6到7。图表是用预期的数据绘制的。
该图表没有按照图例options圆圈、padding顶部50、显示'y‘& 'x’轴labelString、不显示gridlines、以开始偏移以粗体和绿色定位datalabels结束时的任何设置datalabels对象键来呈现：
const chart = new Chartisan({
el: '#test_chart',
url: "@chart('test_chart_route')
浏览 5提问于2021-10-16得票数 0
回答已采纳
我正在从事一个项目，应该采取csv数据，这是在实时编写，并显示在一个html页面上。我使用的是Javascript以及JQuery、HighCharts和PapaParse库。
下面是我的JSFiddle和代码：
我知道它看起来不对劲，但我不知道如何让它在我的电脑上看起来像它。我应该使用不同的托管网站吗？
当我像这样将虚拟数据硬编码到图表中时：
//Altitude
$(function () {
$('#altGraph').highcharts({
chart: {
type: 'lin
浏览 3提问于2015-03-17得票数 0
2回答
当IE使用Chrome和FF时，我无法显示2个图表。仅显示一个图表。下面是我的代码：
function pie() {
$('#pie_projet').highcharts({
chart: {
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
title: {
text: 'Nombre de projet ANRU par communes'
},
too
浏览 0提问于2013-09-27得票数 0
我有一个堆叠成组的列，如
目前，在stackLabels中，我正在添加堆栈名称，现在我试图在每一列的顶部添加一列的总数。但是，当我将它们添加到dataLabels中时，我会看到其他系列的标签也会出现。
plotOptions: {
column: {
stacking: 'normal'
},
formatter : function() {
return "<span>" + this.total + "</span>";
浏览 3提问于2020-10-01得票数 0
回答已采纳
我使用HighChart来显示图表。我做了一个带有条形图和线条的组合图表。它工作得很好，但我想只在线上显示标签，而不是在栏上，但我不能管理。
下面是我显示标签的代码：
plotOptions: {
series: {
dataLabels: {
enabled: true
}
}
},
使用“序列”选项，我在每种类型的图表(条形图和折线图)上都有标签。
plotOptions: {
line: {
dataLabe
浏览 5提问于2013-09-26得票数 0
1回答
这是一个类似的问题(高级图表解析了钻取，没有显示在页面上，而是在控制台中显示)，但是尝试做一些稍微不同的事情(谢谢Pawel/Salman)(谢谢Pawel/Salman)，所以我作为一个新的问题来问。我正在创建一个列图表与多个系列与钻取。数据来自CSV文件( jsFiddle使用模拟模型，这要归功于Pawel关于如何做到这一点)。
我需要用[name: x，data{name: Y，y: Z，drilldown: id}]设置高海图API中的系列。我遇到的问题是，该系列在日志中显示为一个正确的数组系列，其中包含所需格式的数据，但没有将数据推送到实际的series[]中。我在下面修改了代码，它
浏览 1提问于2015-07-17得票数 1
回答已采纳
我正在尝试使用Chartjs中的数据标签插件，但是标签根本不显示在图表上！我正在使用>= 2.7.0 (实际上是2.9.0)版本的Chart.js。
这是我的密码：
var ctx = this.pieChartRef.nativeElement;
this.pieChart = new Chart(ctx, {
type: 'pie',
data: {
labels: Object.keys(pieData),
datasets: [
{
data: Object
浏览 2提问于2020-04-15得票数 0
1回答
有几个例子与速度计在高图表。
有没有办法，显示一个额外的dataLabel只有，而没有拨号表？它可以显示一个旅行记录器，里程计数器或日计数器。
我尝试了额外的系列和dataLabels，但无法运行它。
series: [{
name: 'mileage counter',
data: [],
dataLabels: {
x: 0, y: 20,
format: '{y:.0f} km',
}
}]
浏览 2提问于2015-03-22得票数 1
回答已采纳
2回答
我希望饼图的数据标签显示在各节的中间，而不管：
该切片是否已被切割
是否提到了plotOptions中的size属性
解决方案1
为此，我尝试使用plotOptions的距离属性。在图表的load()事件中，我从radius es.points.shapeArgs.r中得到了半径。然后使用以下方法：
series[0].update({
dataLabels: {
distance: -(radius/2)
}
});
但这带来了两个问题:饼图加载动画丢失，如果任何部分被切片，数据标签放置不正确
解决方案2
为了解决动画问题，我尝试使用上面的
浏览 1提问于2016-07-06得票数 3
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
云直播活动推荐
腾讯云开发者
