Search code examples
typescriptionic-frameworkleafletmapquest

Getting a Runtime Exception when using MapQuest direction routing on Ionic 3


I am using the Ionic 3 framework, and I can generate the map successfully but receive a runtime error when using the L.mapquest.directions().route() function.

These are the imports:

<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"

  integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A=="

  crossorigin=""/>

<script src="https://unpkg.com/[email protected]/dist/leaflet.js"

  integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA=="

  crossorigin=""></script>

<script src="https://api.mqcdn.com/sdk/mapquest-js/v1.3.2/mapquest-core.js"></script>

<link type="text/css" rel="stylesheet" href="https://api.mqcdn.com/sdk/mapquest-js/v1.3.2/mapquest-core.css"/>

These are the code:

L.mapquest.key = MapQuestKey;
      this.map = L.mapquest.map('map', {
        center: [lat, lng],
        layers: L.mapquest.tileLayer('map'),
        zoom: 13
      });
L.mapquest.directions().route({

        start: '350 5th Ave, New York, NY 10118',

        end: 'One Liberty Plaza, New York, NY 10006',

});

The error looks like this:

ERROR Error: Uncaught (in promise): 
TypeError: this._rawPxBounds is undefined _updateBounds@https://unpkg.com/[email protected]/dist/leaflet.js:5:79584 
setStyle@https://unpkg.com/[email protected]/dist/leaflet.js:5:75174 
setPathStyle@https://api.mqcdn.com/sdk/mapquest-js/v1.3.2/mapquest-core.js:6:161888
updateRibbonWidth@https://api.mqcdn.com/sdk/mapquest-js/v1.3.2/mapquest-core.js:6:163063

New to Mapquest so not sure what's wrong. Any ideas?


Solution

  • I take away the import from [email protected] and [email protected] and just import the [email protected] only. It now functions normally.

    <script src="https://api.mqcdn.com/sdk/mapquest-js/v1.3.2/mapquest.js"></script>
    
    <link type="text/css" rel="stylesheet" href="https://api.mqcdn.com/sdk/mapquest-js/v1.3.2/mapquest.css"/>