Line height does not respect text format
by Tristen Brown
HTML
<link rel="stylesheet" href="https://api.tiles.mapbox.com/mapbox-gl-js/v1.1.0/mapbox-gl.css">
<script src="https://api.tiles.mapbox.com/mapbox-gl-js/v1.1.0/mapbox-gl.js"></script>
<div id="map">
</div>
CSS
body {
margin: 0;
padding: 0;
}
#map {
position: absolute;
top: 0;
bottom: 0;
width: 100%;
}
JavaScript
mapboxgl.accessToken = 'pk.eyJ1IjoidHJpc3RlbiIsImEiOiJjajZoOXU4Z2kwNnppMnlxd2d6bTFvZ2xtIn0.PP7AoUakMfeqdXFHdsY0oA';
const style = {
version: 8,
center: [139.772, 35.681],
zoom: 17,
sources: {
composite: {
url: 'mapbox://mapbox.mapbox-streets-v8',
type: 'vector'
}
},
sprite: 'mapbox://sprites/tristen/cjwurvssn93s01cny9t91anji/a3zx8crhca28a1j1ljgwyyo1z',
glyphs: 'mapbox://fonts/tristen/{fontstack}/{range}.pbf',
layers: [{
id: 'foo',
type: 'symbol',
source: 'composite',
'source-layer': 'housenum_label',
layout: {
'text-field': [
'format',
'Hello', {},
'\n', {},
'world', {}
],
'text-size': 12.5,
}
}, {
id: 'bar',
type: 'symbol',
source: 'composite',
'source-layer': 'place_label',
layout: {
'text-field': [
'format',
'Hello', {},
'\n', {},
'world', {}
],
'text-size': 12.5,
'text-line-height': 0.1
},
paint: {
'text-color': 'red'
}
}]
};
new mapboxgl.Map({
container: 'map',
style
});