[Chartjs]-How to create dynamic D3 tickFormat in dc charts

by

1👍

✅

Just check if the datum is smaller than 999 and apply the desired format. For instance:

.tickFormat(function(d) {
    return d < 999 ? d3.format(",d")(d) : d3.format(".2s")(d)
})

Here is a demo:

var svg = d3.select("svg")
var scale = d3.scaleLinear()
  .domain([0, 2000])
  .range([10, 580]);
d3.axisBottom(scale).tickFormat(function(d) {
  return d < 999 ? d3.format(",d")(d) : d3.format(".2s")(d)
})(svg.append("g").attr("transform", "translate(0,50)"))
<script src="https://d3js.org/d3.v5.min.js"></script>
<svg width="600"></svg>

Leave a comment