JSFiddle - React, Tailwind, and code Playground

HTML

<script type="text/javascript" src="http://davidlynch.org/projects/maphilight/jquery.maphilight.js"></script>
    

<img src="http://www.gilad.co.uk/storage/boat.jpg?__SQUARESPACE_CACHEVERSION=1285594599631" border="0" usemap="#map" class="map" />
<map name="map" id="map">
  <area shape="poly" coords="10,307,20,311,32,322,51,332,67,340,77,344,89,342,103,337,115,334,124,332,136,327,157,322,183,314,213,300,241,286,260,273,291,253,307,235,324,214,335,196,348,175,351,164,306,159,310,154,310,146,306,138,288,136,281,136,275,143,274,152,272,158,223,151,177,170,126,191,85,209,64,222,50,236,27,267,9,300" href="#" />

JavaScript

$(function() {
    $(".map").maphilight({
        fill: true,
        fillColor: 'ffffff',
        fillOpacity: 0.1,
        stroke: true,
        strokeColor: '000000',
        strokeOpacity: 1,
        strokeWidth: 3,
        fade: true,
        alwaysOn: false,
        neverOn: false,
        groupBy: false,
        wrapClass: true,
        shadow: false,
        shadowX: 0,
        shadowY: 0,
        shadowRadius: 6,
        shadowColor: '000000',
        shadowOpacity: 0.8,
        shadowPosition: 'outside',
        shadowFrom: false
    });
});