charts 相关问题

目标：当您调整网页的宽度和高度时，图表应该可以工作。问题：这不起作用。其他： https://jsbin.com/bubonojonu/edit?html,输出目标：当您调整网页的宽度和高度时，图表应该可以工作。问题：没用。其他： https://jsbin.com/bubonojonu/edit?html,输出 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style> </style> <title>Chart</title> </head> <body> <div> <canvas id="myChart"></canvas> </div> <script src="https://cdn.jsdelivr.net/npm/chart.js"></script> <script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-datalabels"></script> <script> const ctx = document.getElementById('myChart'); const data = [10, 12, 14, 20, 16, 11]; Chart.register(ChartDataLabels); new Chart(ctx, { type: 'bar', data: { labels: ['2020', '2021', '2022', '2023', '2024', '2025'], datasets: [{ label: `testtesttest`, data: data, borderWidth: 0, backgroundColor: 'blue', borderColor: 'blue' }] }, options: { responsive: true, plugins: { title: { display: true, text: 'testtesttest', color: 'black', font: { weight: 'bold', size: 13 } }, datalabels: { anchor: 'end', align: 'end', color: 'black', font: { weight: '', }, formatter: function (value, context) { return value; } } } } }); </script> </body> </html> canvas { width: 100% !important; height: auto !important; } canvas { width: 100% !important; height: auto !important; } <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style> </style> <title>Chart</title> </head> <body> <div> <canvas id="myChart" class="chart-canvas w-100"></canvas> </div> <script src="https://cdn.jsdelivr.net/npm/chart.js"></script> <script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-datalabels"></script> <script> const ctx = document.getElementById('myChart'); const data = [10, 12, 14, 20, 16, 11]; Chart.register(ChartDataLabels); new Chart(ctx, { type: 'bar', data: { labels: ['2020', '2021', '2022', '2023', '2024', '2025'], datasets: [{ label: `testtesttest`, data: data, borderWidth: 0, backgroundColor: 'blue', borderColor: 'blue' }] }, options: { responsive: true, plugins: { title: { display: true, text: 'testtesttest', color: 'black', font: { weight: 'bold', size: 13 } }, datalabels: { anchor: 'end', align: 'end', color: 'black', font: { weight: '', }, formatter: function (value, context) { return value; } } } } }); </script> </body> </html>

charts

回答 1 投票 0

为什么我的折线图绘制数据不正确？

我一直在开发一个 Excel 宏来在 Chartsheet 上绘制一些数据图表，但突然之间，它现在绘制了 7 个不同的系列而不是 2 个... 该图的代码是：公共子图Results() ...

vba excel charts linechart

回答 2 投票 0

D3饼图中最多8个标签如何防止标签重叠？

我正在 React 组件中使用 D3 饼图，其中最多有 8 个标签。但是，当值非常接近时，我会遇到折线和标签之间的重叠...

reactjs typescript d3.js charts visualization

回答 1 投票 0

如何通过vba代码将图表xAxes字体颜色从黑色更改为红色？

如何通过vba代码将图表xAxes字体颜色从黑色更改为红色？下图显示了我的问题。我尝试过以下代码但没有成功。公共子宏1() '删除所有字符...