chartjs中是否有任何选项可以将基线值从0更改为其他数字，例如50，我想使用“填充”选项，并且我想将正弦波从0更改为100如果我使用-50到50或-100到+100范围，基线是0，这是确定的，工作完美，但当我使用0到100中心不是50，是0和填充模式只是彩色的所有向下部分将chartjs中的基线值从0更改为例如50
chartjs
h7appiyu1#
是的，有{fill: {value:<value>}}。
{fill: {value:<value>}}
const data = { labels: ['E-commerce', 'Enterprise', 'Grey'], datasets: [{ label: 'random testdata', data: [12, 19, 5, 3, 3], fill: {value: 12}, }], }; const config = { type: 'line', data: data, options: { maintainAspectRatio: false, } }; new Chart( document.getElementById('chart'), config );
<script src="//cdn.jsdelivr.net/npm/chart.js"></script> <div class="chart" style="height:184px; width:350px;"> <canvas id="chart" ></canvas> </div>
ma8fv8wu2#
我应该使用fill选项，传递您希望作为基础的值。参见文档：https://www.chartjs.org/docs/latest/charts/area.html在您的用例中，fill: {value: 50}
fill: {value: 50}
const config = { type: 'line', data: { labels: ['January', 'Fabruary', 'March', 'April', 'May', 'June', 'July'], datasets: [{ data: [50, 35, 45, 47, 21, 13, 27], fill: {value: 20} }] }, options: { responsive: true, plugins: { legend: false, } }, }; const ctx = document.getElementById("myChart"); const myChart = new Chart(ctx, config);
.myChartDiv { max-width: 600px; max-height: 400px; }
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.2.1/dist/chart.umd.min.js"></script> <html> <body> <div class="myChartDiv"> <canvas id="myChart" width="600px" height="400px"/> </div> </body> </html>
2条答案
按热度按时间h7appiyu1#
是的，有
{fill: {value:<value>}}。这里有一个简短的演示，我将如何做到这一点：
ma8fv8wu2#
我应该使用fill选项，传递您希望作为基础的值。
参见文档：https://www.chartjs.org/docs/latest/charts/area.html
在您的用例中，
fill: {value: 50}