JSFiddle - React, Tailwind, and code Playground
by Krn Prz
HTML
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="max-height: 400px"></div>
CSS
.myImage {
width: 30px;
height: 30px;
}
JavaScript
$(function () {
$(document).ready(function () {
$('#container').highcharts({
chart: {
type: 'pie'
},
title: {
text: 'ELECCIÓN DE JEFE DELEGACIONAL'
},
subtitle: {
text: 'SEGÚN FUERZA POLÍTICA</a>'
},
tooltip: {
//pointFormat:'<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}%</b><br/>',
useHTML: true,
formatter: function () {
var img = {
'PAN': '<img class="myImage" src="http://intra.iedf.org.mx/deoyge/resultados2015/LogosPartidos/pan.png"/>',
'PRI': '<img class="myImage" src="http://intra.iedf.org.mx/deoyge/resultados2015/LogosPartidos/pri.png"/>',
'PVEM': '<img class="myImage" src="http://intra.iedf.org.mx/deoyge/resultados2015/LogosPartidos/pvem.png"/>',
'NA': '<img class="myImage" src="http://intra.iedf.org.mx/deoyge/resultados2015/LogosPartidos/na.png"/>',
'PRI-PVEM': '<img class="myImage" src="http://intra.iedf.org.mx/deoyge/resultados2015/LogosPartidos/pri-pvem.png"/>',
'PRD-PT-NA': '<img class="myImage" src="http://intra.iedf.org.mx/deoyge/resultados2015/LogosPartidos/prd-pt-na.png"/>',
'VOTOS NULOS': '<img class="myImage" src="http://intra.iedf.org.mx/deoyge/resultados2015/LogosPartidos/nulos.png"/>'
}[this.point.name];
return '<center>'+ this.series.name +'<br/>'+'<b>'+ this.point.name +': '+'</b>'+'</font>'+ this.point.y + '%'+'<br/>' +img+'</center>';
},
},
plotOptions: {
series: {
dataLabels: {
enabled:...