条形图不显示图表中低值的条形。
条形图不显示图表中低值的条形。例如,具有16、100000002、21030404020、3020291020之类的值。然后,除值16以外的所有条都显示出来。
var data = [
{"code": "China", "value": 4},
{"code": "UK", "value": 17016},
{"code": "Japan", "value": 256536955},
{"code": "USA", "value": 29740072}
]
var margin = { top: 4, right: 80, bottom: 30, left: 30 };
const width = 1200 - (margin.left + 30) - margin.right;
const height = 600 - margin.top - margin.bottom;
let x: any;
if(id === 'currrencySvg') {
x =d3.scaleBand().rangeRound([0, width]).padding(0.81);
} else {
x = d3.scaleBand().rangeRound([0, width]).padding(0.91);
}
var leastValue = parseFloat(4);
var highestVal = parseFloat(256536955);
let labels = [];
x.domain(res.map(function (d) {
labels.push(d['code']);
return d['code'];
}));
const rangeVal = this.getStepVal(leastValue, highestVal, 10);
const y = d3.scaleLinear().domain([rangeVal['low'], rangeVal['high']]).range([height, 0]);
const chart = d3.select('#barchart')
.append('g')
.attr('transform', 'translate(' + (margin.left + 50) + ',' + margin.top + ')');
let xAxis: any;
xAxis = d3.axisBottom(x).tickSizeOuter(0);
const self = this;
const yAxis = d3.axisLeft(y).tickFormat(function(d) {
return self.valueToMillions(d);
}).tickSizeOuter(0);
chart.append('g').call(yAxis);
chart.append('g').attr('transform', 'translate(0,' + height + ')').call(xAxis);
let tooltip = d3.select("body").append("div").attr("class", "toolTip");
chart.append("text")
.attr("transform", "rotate(-90)")
.attr("y", 0 - (margin.left + 43))
.attr("x", 0 - (height / 2))
.attr("dy", "1em")
.attr("class", "chartYaxisText")
.style("text-anchor", "middle")
.text('Spend');
// bar chart
let bar = chart.selectAll("rect")
.data(res)
.enter().append("g");
bar.append("rect")
.attr("class", "barGraph")
.attr("width", 20)
.attr("x", function (d, i) {
return x(labels[i]);
})
.attr("y", function (d, i) {
return y(d['value']);
})
.attr("height", function (d, i) { return height - y(d['value']); });
酒吧应该为中国作图。