Imagem mapeada responsiva

     

<img src="SEE_ingre_prep_dimensoes_trabalho.jpg" alt="Dimensões da gestão escolar" width="707" height="680" role="presentation" class="img-responsive" usemap="#image-map">
<map name="image-map">
    <area alt="Gestão pedagógica" title="Gestão pedagógica" href="#" coords="286,534,122" shape="circle" target="">
    <area alt="Gestão de pessoas e equipes" title="Gestão de pessoas e equipes" href="#" coords="468,429,120" shape="circle" target="">
    <area alt="Gestão de processos administrativos" title="Gestão de processos administrativos" href="#" coords="271,339,121" shape="circle" target="">
</map>

<script src="/repository/coursefilearea/file.php/1/efap/js/jquery.rwdImageMaps.min.js"></script>
<script>
    $(document).ready(function (e) {
        $('img[usemap]').rwdImageMaps();
    });
</script>