Question

我已经使用c3制作了一些图表，并且对其易用性印象深刻。但是，我不确定是否可以在d3中像3代码那样缩放，如下面的代码：

var yScale = d3.scale.linear（）
            的。域（[0100500]）
        .range（[height，height - 20,0]）;

所以我可以使我的图表主要针对低于100的值进行缩放，因为这是大多数值所在的位置，并且我不希望条形比例被超过100的值倾斜。

是否可以在c3中执行此类操作？或者我是否需要使用d3进行这种缩放？

由于

Answer 1

您可以使用比例来映射值，使用scale.invert来获取所有标签。例如......

var myScale = d3.scale.linear().domain([0, 5, 50]).range([0, 40, 50]);

var chart = c3.generate({
    data: {
        columns: [
            ['A', 3, 2, 1, 4, 1.5, 42.5].map(function (value, index) {
                return index ? myScale(value) : value;
            })],
        type: 'spline'
    },
    tooltip: {
        format: {
            value: function (value) {
                return parseFloat(myScale.invert(value).toFixed(5));
            }
        }
    },
    axis: {
        y: {
            tick: {
                format: function (d) {
                    return myScale.invert(d)
                }
            }
        }
    }
});

parseFloat和toFixed用于在来回转换时消除精度问题。

小提琴 - http://jsfiddle.net/rujx39fw/

在https://github.com/masayuki0812/c3/issues/252的c3 github上存在类似的问题。它被关闭了一个类似的解决方法（也有一个链接的问题 - 通过参考这个解决方法关闭）

如果您有冒险精神，还有一个您可能会对https://github.com/masayuki0812/c3/issues/971感兴趣的相关问题提出另一种选择。

c3缩放类似于d3？

1 个答案: