请在下面找到代码和fiddle
var width = 900,
padding = 30;
var yScale = d3.scale.linear()
.domain([0,0 ])
.range([0, 0]);
var xScale = d3.scale.linear()
.domain([-2000000000,2000000000])
.range([(padding/2), width - padding * 2]);
// console.log('hi');
var yAxis = d3.svg.axis()
.orient("left")
.scale(yScale);
// define the y axis
var xAxis = d3.svg.axis()
.orient("bottom")
.scale(xScale)
.ticks(5)
.tickSubdivide(10)
.tickSize(-60,-60,60)
.tickFormat(function (d) { return toYear(d);});
var containerSvg = d3.select("#primaryTimelineBackground").append("svg")
.attr("class","primaryTimelineSvg")
.attr("width", "850px")
.attr("height","100px");
containerSvg.selectAll("line.x")
.data(xScale.ticks(50))
.enter().append("line")
.attr("class", "xMinor")
.attr("x1", xScale)
.attr("x2", xScale)
.attr("y1", -45)
.attr("y2", 45)
.style("stroke", "#808080");
containerSvg.selectAll("line.x")
.data(xScale.ticks(5))
.enter().append("line")
.attr("class", "x")
.attr("x1", xScale)
.attr("x2", xScale)
.attr("y1", -50)
.attr("y2", 50)
.style("stroke-width",3)
.style("stroke", "#808080");
// draw y axis with labels and move in extentStart the size by the amount of padding
containerSvg.append("g")
.attr("transform", "translate(200,0)")
.call(yAxis);
containerSvg.append("g")
.attr("class", "primaryXAxis")
.attr("transform", "translate(0,40)")
.call(xAxis);
var zoom = d3.behavior.zoom().x(xScale).on("zoom");
我想在时间轴上应用对数缩放。此处缩放距离可由brushextent
管理,如果我使用Math.log(xScale)
,则会引发错误。所以问题是如果应用了日志,地图x-axis
如何。
如何使d3变焦对数?????