时间戳

首页 > 解决方案 > 如何在雷达图上反转比例显示（chart.js）

javascript - 如何在雷达图上反转比例显示（chart.js）

问题描述

你好，有人知道如何在我的图表上反转比例显示吗？我希望它从 100 开始，以 0 结尾

我试过 scale:reverse 但它没有用

var scaling = [10, 10, 10, 10, 10, 10];
var barData = {
  labels: [["PH"],
      ["Heavy Metals"],
      ["Chemical Oxygen Demand"],
      ["Transparency"],
      "Ammonia Nitrogen",
      ["Dissolved", "Oxygen"],],
  datasets: [
    {
      fillColor: "#48A497",
      strokeColor: "#48A4D1",
      data: [2, 10, 7, 10, 7, 10].map(function (e, i) {
        return e * scaling[i];
      }),
    },
  ],
};

var income = document.getElementById("income").getContext("2d");
new Chart(income).Radar(barData, {
  tooltipTemplate: function (valueObject) {
    return (
      valueObject.value / scaling[data.labels.indexOf(valueObject.label)]
    );
  },
});

在此处输入图像描述

标签： javascriptchartschart.js

解决方案

不确定这是否有效，

var scaling = [10, 10, 10, 10, 10, 10];
[2, 10, 7, 10, 7, 10].map(function (e, i) {
    return scaling[i] = e * scaling[i];
})

var barData = {
    labels: [
        ["PH"],
        ["Heavy Metals"],
        ["Chemical Oxygen Demand"],
        ["Transparency"],
        "Ammonia Nitrogen",
        ["Dissolved", "Oxygen"],
    ],
    datasets: [
        {
            fillColor: "#48A497",
            strokeColor: "#48A4D1",
            data: scaling.sort(function(a, b) {
                return b-a;
            }),
        },
    ],
};

var income = document.getElementById("income").getContext("2d");
new Chart(income).Radar(barData, {
    tooltipTemplate: function (valueObject) {
        return (
            valueObject.value / scaling[data.labels.indexOf(valueObject.label)]
        );
    },
});

推荐阅读