d3.js 线性比例尺

         var linear = d3.scale.linear()  //设置为线性比例尺
                        .domain([0,20])  //设置定义域为[0,20]   
                        .range([0,100]); //设置值域为[0,100]

        console.log(linear(10));
        console.log(linear(30));
        console.log(linear.invert(80));  //输入值域的值返回定义域的值

        //默认false，当比例尺接收一个超出定义域范围的值时，依然按同样方法计算出一个可能超出值域范围的值，如歌设置为true，任何超出值域范围的值，都会缩小到值域范围内。
        linear.clamp(true);              
        console.log(linear(30));

        //可对输出的数值进行四舍五入 rangeRound
        linear.rangeRound([0,100]) 
        console.log(linear(13.33)); //输出67

        // 定义域中有无穷小数，可用nice()
        linear.domain([33.6111111111111,45.22222222]).nice()
        console.log(linear.domain()); //输出[33,46]

        // ticks 和 tickFormat() 主要用在坐标轴上的
        var linear = d3.scale.linear()  //设置为线性比例尺
                        .domain([-20,20])  //设置定义域为[0,20]   
                        .range([0,100]); //设置值域为[0,100]
        var ticks = linear.ticks(5);
        console.log(ticks); //输出 [-20,-10,0,10,20]
        //tickFormat() 返回值是一个函数，因此调用时要使用函数的调用方式,此处设置的为 "+" 表示正负数  
        var tickFormat = linear.tickFormat(5,"+");
        for(var i = 0;i<ticks.length;i++){
            ticks[i] = tickFormat(ticks[i]);
        }
        console.log(ticks);  //输出["-20","-10","+0","+10","+20"]

 

转载于:https://www.cnblogs.com/webmc/p/11076844.html