Chart.js如何为webAPP重写x

Question

我使用 chart.js 作为 webApp，但这不是我想要的。

这个x轴怎么重写或者换其他js画图表，demo:

Answer 1

您可以扩展图表以从 x 轴删除不需要的点，就像这样（改编自）

Chart.types.Line.extend({
    name: "LineAlt",
    initialize: function (data) {
        Chart.types.Line.prototype.initialize.apply(this, arguments);

        if (this.options.every) {
            var every = this.options.every;
            var xLabels = this.scale.xLabels
            xLabels.forEach(function (label, i) {
                if (i % every !== 0)
                    xLabels[i] = '';
            })
        }
    }
});

你这样称呼它

var ctx = document.getElementById("chart").getContext("2d");
var myLineChart = new Chart(ctx).LineAlt(data, {
    every: 3
});

将 every 调整为 2, 3,... 以每 2、每 3,... 点显示一个。

Fiddle - http://jsfiddle.net/3p2ekjyn/

Chart.js如何为webAPP重写x

Chart.js how to rewrite x for webAPP

chart.js