Escape Characters in d3.js ticks

问题

I need to display micromoles per liter (µmol/L) in my chart's tickFormat, but when I pass in "µmol/L", it shows the characters "µ" instead of the symbol for mu. How do I get it to render the symbol?

回答1:

In that case, you shouldn't use an HTML entity. Once you're dealing with an SVG , use this:

\u00B5

Check this snippet:

var svg = d3.select("body")
	.append("svg")
	.attr("width", 500)
	.attr("height", 200);
	
var scale = d3.scaleLinear()
	.range([40, 460])
	.domain([0, 100]);
	
var axis = d3.axisBottom(scale)
	.tickFormat(function(d){ return d + "\u00B5mol/L"})
    .ticks(5);

svg.append("g")
	.attr("transform", "translate(0,100)")
	.call(axis);

text { font-size: 14px;}

<script src="https://d3js.org/d3.v4.min.js"></script>

来源：https://stackoverflow.com/questions/38734835/escape-characters-in-d3-js-ticks