Yaxis和xAxis的位置

时间:2015-05-13 18:09:22

标签: d3.js

如何在0中将两个轴相交?

我正在使用d3图表。请解释它的工作原理。

请找到我得到结果的图片。

d3 chart axis

代码:

var margin = {top: 400, right: 100, bottom: 100, left: 100},
    width = 600 - margin.left - margin.right,
    height = 600 - margin.top - margin.bottom;

    var svgContainer = d3.select("div#chart").append("svg")
                                     .attr("width", width + margin.left + margin.right)
                                     .attr("height", height + margin.top + margin.bottom)
                                     .append("g")
                                     .attr("transform", "translate(" + margin.left + "," + margin.top + ")");

                                     // .attr("transform", "translate(10000,1)");

    var xAxisScale = d3.scale.linear()
                     .domain([0, 0.10])
                     .range([1, 1000]); 

var yAxisScale = d3.scale.linear()
                     .domain([0.100,-0.100])
                     .range([1000, 1]);       

     var xAxis = d3.svg.axis().scale(xAxisScale).ticks(20).orient("bottom");
     var yAxis = d3.svg.axis().scale(yAxisScale).ticks(20).orient("left");

     var xAxisGroup = svgContainer.append("g").attr("class", "x axis").call(xAxis).attr("transform", "translate(0,0)"); 

     xAxisGroup.append("g").attr("class", "y axis").call(yAxis); 

0 个答案:

没有答案