2

I want to use Mapbox-GL as power bi custom visual,eg:add data from GeoJSON,draw polygon、polyline and for more GIS function. and code in html is ok,but integrate into power bi got error. code img in visual studio code myMapbox.js Code:

function mapLoad() {
  var mapboxgl = require("mapbox-gl");
  mapboxgl.accessToken =
    "pk.eyJ1IjoibHVvamlhbmRhbiIsImEiOiJjanQ0aHlvMXMyc21zNDRvZGZ6OXY4MXE2In0.a4cxpcMdIShf0Xrm0rHv2w";

  var map = new mapboxgl.Map({
    container: "main", // container id
    style: "mapbox://styles/mapbox/streets-v11", // style URL
    center: [-74.5, 40], // starting position [lng, lat]
    zoom: 5, // starting zoom
  });

  //console.log("mapboxgl", mapboxgl);
}
export { mapLoad };

Code in visual.ts

import * as mp from "./js/myMapbox";
export class Visual implements IVisual {
  private settings: VisualSettings;
  private target: HTMLElement;

  constructor(options: VisualConstructorOptions) {
    this.target = options.element;         
    console.log("constructor");
  }

  public update(options: VisualUpdateOptions) {
    let dataBox = options.dataViews[0];
    this.target.innerHTML = `<div id='main' class='line' name='line' style='width: 100%; height:100%;'></div>`;

    try{
      //mapbox
      mp.mapLoad();
    }catch(error){
      console.log("出错",error);
    }
  }

  private static parseSettings(dataView: DataView): VisualSettings {
    return <VisualSettings>VisualSettings.parse(dataView);
  }

  /**
   * This function gets called for each of the objects defined in the capabilities files and allows you to select which of the
   * objects and properties you want to expose to the users in the property pane.
   *
   */
  public enumerateObjectInstances(options: EnumerateVisualObjectInstancesOptions): VisualObjectInstance[] | VisualObjectInstanceEnumerationObject {
    return VisualSettings.enumerateObjectInstances(this.settings || VisualSettings.getDefault(), options);
  }
}

and get gray map and error:_typeof is not defined gray map typeof is not defined

Can anyone help me getting this done. Your help will be appreciated.

luojiandan
  • 21
  • 2

0 Answers0