Make choropleth map data labels rule for mobile

Ask the community
1

Hi,

I have 2 maps, a bubble map and a choropleth map.

For the bubble map I can add custom code and have the data labels reduce in size when viewing smaller than 600px.

For the Choropleth map, I want to do the same, only the code doesn’t seem to work. How can I reduce my data label text size when viewing on a smaller screen?

I am using this code:

Highcharts.merge(true, options, {
	responsive: {
		rules: [{
			condition: {
				maxWidth: 600
			},
			chartOptions: {
				plotOptions: {
					series: {
						dataLabels: {
							style: {
								fontSize: '12px'
							}
						}
					}
				}
			}
		}]
	}
});
2

There must have been something interfering with the code. I have recreated the whole thing and now it works.

1 Like
3

Awesome Kerry! Great work