score:1

Accepted answer

Truncating everything over 50% to the value of 50% is easily done with scale.clamp:

const scale = d3.scaleLinear()
  .domain([0, 0.5])
  .range([0, 500])
  .clamp(true);

d3.range(11).map(d => console.log(d * 10 + "% in the scale is: " + scale(d / 10)))
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script>

On the other hand, if you want a different range for those domain values outside the limit, just set a domain and a range with intermediate values. For instance, here the regular domain (from 0 to 50%) goes from 0 to 500 in the range, and everything over 50% will be positioned at 520:

const scale = d3.scaleLinear()
  .domain([0, 0.5, (0.5 + 1e-6), 1])
  .range([0, 500, 520, 520]);

d3.range(11).map(d=>console.log(d * 10 + "% in the scale is: " + scale(d/10)))
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script>


More Query from same tag