0

I'm trying to set up a map using Rapheal (v2.1.4) and Mapael (v1.1.0) plugins but I get this error :

Uncaught TypeError: Cannot read property 'x' of undefined

I don't understand where my error is

DOM:

<div class="row">
    <div class="col-md-12">
        <div class="mapDepFr"></div>
    </div>
</div>

JS:

<script src="{{ asset('js/raphael-min.js') }}" type="text/javascript"></script>
<script src="{{ asset('js/jquery.mapael.js') }}" type="text/javascript"></script>
<script src="{{ asset('js/maps/france_departments.js') }}" type="text/javascript"></script>
    <script>
        $(".mapDepFr").mapael({
            map: { name: "france_departments", }

        });
    </script>

The mapDepFr div is placed before the Js part and all the js files are well loaded.

Where is my mistake ?

Tanks.

John Slegers
  • 45,213
  • 22
  • 199
  • 169
Steph D
  • 1
  • 4

1 Answers1

0

You'll want to create the map after the DOM is loaded.

<script>
  $(function(){ // jQuery shorthand for DOM ready
    $(".mapDepFr").mapael({
      map: { name: "france_departments", }
    });
  });
</script>
Tobias Lønnerød Madsen
  • 1
  • Thanks, I allready tried this. I abandoned Mapael.js to only focus on Raphael.js and everything is allright now. – Steph D Dec 02 '15 at 18:55