我在d3中创建了一个散点图.问题是y轴标签没有出现在firefox和chrome中(在IE中工作正常).我已经尝试过做svg宽度100%的事情,但由于某种原因,标签总是被切断.
//Width and height var w = 600; var h = 300; var padding = 30; var margin = { top: 20, right: 20, bottom: 30, left: 20 }; var df = d3.time.format("%b-%y"); //Create scale functions var xScale = d3.time.scale() .domain([d3.min(dataset, function (d) { return d[0]; }), d3.max(dataset, function (d) { return d[0]; })]) .range([padding, w - padding * 2]) .nice(5); var yScale = d3.scale.linear() .domain([0, d3.max(dataset, function (d) { return d[1]; })]) .range([h - padding, padding]); //Define X axis var xAxis = d3.svg.axis() .scale(xScale) .orient("bottom") .ticks(5) .tickFormat(df); //Define Y axis var yAxis = d3.svg.axis() .scale(yScale) .orient("left") .ticks(5); //Create SVG element var svg = d3.select("#TimeSeriesChartDiv") .append("svg") .attr("width", w + margin.left + margin.right) .attr("height", h + margin.top + margin.bottom); //Create X axis svg.append("g") .attr("class", "axis") .attr("transform", "translate(20," + (h - padding) + ")") .call(xAxis); //Create Y axis svg.append("g") .attr("class", "axis") .attr("transform", "translate(" + 50 + ",0)") .call(yAxis); svg.append("text") .attr("class", "axislabel") .attr("text-anchor", "end") .attr("x", w / 2) .attr("y", h + 8) .text("Date"); svg.append("text")//-->>this is the text that gets cut off .attr("class", "axislabel") .attr("text-anchor", "end") .attr("x", -100) .attr("y", -15) //.attr("dy", ".75em") .attr("transform", "rotate(-90)") .text(unit);
任何想法将不胜感激.谢谢