JSFiddle - React, Tailwind, and code Playground
by mhctoledo
HTML
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/funnel.js"></script>
<div id="container" style="min-width: 410px; max-width: 600px; height: 400px; margin: 0 auto"></div>
JavaScript
$(function () {
$('#container').highcharts({
chart: {
type: 'pyramid',
marginRight: 100
},
title: {
text: '',
x: -50
},
plotOptions: {
series: {
dataLabels: {
enabled: true,
//format: function(){ return '<b>{point.name}</b>'},
formatter:function(){
return (this.point.id=='b') ? this.point.name: '';
},
color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black',
softConnector: false
}
}
},
legend: {
enabled: true
},
series: [{
name: ' ',
data: [{
y: 150,
name: "",
id: "a"
}, {
y: 1,
name: "15",
id: "b",
}, {
y: 10,
name: "",
id: "c"
}]
}]
});
});