相关疑难解决方法(0)

Chart.js - 添加渐变而不是纯色 - 实现解决方案

我正在使用Chart.js,一切正常,但我想用渐变替换当前的颜色背景(fillColor:"rgba(250,174,50,0.5)").我有替换渐变的解决方案,但对我来说,用我糟糕的JS知识来实现​​这个太难了.对于懂JS的人来说,我觉得很容易.

所以我的Chart.js代码:

        <script>

        var data = {
            labels : ["02:00","04:00","06:00","08:00","10:00","12:00","14:00","16:00","18:00","20:00","22:00","00:00"],
            datasets: [
                {
                    fillColor : "rgba(250,174,50,0.5)",
                    strokeColor : "#ff6c23",
                    pointColor : "#fff",
                    pointStrokeColor : "#ff6c23",
                    pointHighlightFill: "#fff",
                    pointHighlightStroke: "#ff6c23",
                    data : [25.0,32.4,22.2,39.4,34.2,22.0,23.2,24.1,20.0,18.4,19.1,17.4]
                }
            ]
        };

        var options = {
            responsive: true,
            datasetStrokeWidth : 3,
            pointDotStrokeWidth : 4,
            tooltipFillColor: "rgba(0,0,0,0.8)",
            tooltipFontStyle: "bold",
            tooltipTemplate: "<%if (label){%><%=label + ' hod' %>: <%}%><%= value + '°C' %>",
            scaleLabel : "<%= Number(value).toFixed(0).replace('.', ',') + '°C'%>"
        };

        var ctx = document.getElementById("temp-chart").getContext("2d");
        var myLineChart = new Chart(ctx).Line(data, …
Run Code Online (Sandbox Code Playgroud)

javascript chart.js

18
推荐指数
4
解决办法
3万
查看次数

ChartJs 中折线图下方区域的背景颜色?

我正在创建一个图表来使用图表 js 呈现一些数据。

  const data = {
    labels: ["1 Dec", "8 Dec", "16 Dec", "31 Dec"],
    datasets: [
      {
        label: "Sales Made",
        data: [3, 7, 4, 5],
        borderColor: ["#03A9F5"],
      },
    ],
  };
  const options = {
    tension: 0.4,
    title: {
      display: true,
      text: "linechrt",
    },
    scales: {
      y: [
        {
          display: true,
          stacked: true,
          ticks: {
            beginAtZero: true,
            steps: 10,
            stepValue: 5,
            min: 0,
            max: 100,
          },
        },
      ],
    },
  };
Run Code Online (Sandbox Code Playgroud)

现在我已经查看了在线教程甚至文档,但我还没有得到关于如何绘制线下方区域的明确答案。ChartJs 有很多版本,以前对这个问题的答案尤其是在 Stack 上似乎不起作用。

对于其他图表,例如条码

backGroundColor: ["red"] …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs chart.js react-chartjs

6
推荐指数
1
解决办法
8624
查看次数

标签 统计

chart.js ×2

javascript ×2

react-chartjs ×1

reactjs ×1