Skip to main content
D
done111-Visitor
1-Visitor
December 9, 2016
Question

How to use google maps libraries like Drawing Library, Geometry Library and Places Library ?

  • December 9, 2016
  • 2 replies
  • 6616 views

Hi all,

Does anyone know how to use google maps libraries like drawing library , geometry library and places library in google maps widget in thingworx ?

Thanks

2 replies

T
ttielebein5-Regular Member
5-Regular Member
December 9, 2016

There is a section of the Custom Extension Development Guide that talks about using custom widgets, and about using third party libraries in custom widgets.

Hope this helps!

    A
    aduarte1-Visitor
    1-Visitor
    December 26, 2016

    Hello,

    On the metadata.xml you can replace:
    <FileResource description="" isRuntime="true" isDevelopment="false" type="JS" url="https://maps.google.com/maps/api/js?sensor=false"/>
    By:

    <FileResource type="JS" url="https://maps.google.com/maps/api/js?sensor=false&amp;libraries=drawing,geometry"

      description="" isDevelopment="false" isRuntime="true" />

    I hope this can help you.

      D
      done111-VisitorAuthor
      1-Visitor
      January 12, 2017

      Hi Ana,

      Thanks for your help.

      I have updated the metadata.xml file as you said.

      But how to use that in the map ? I am unable to use it .

      A
      aduarte1-Visitor
      1-Visitor
      January 16, 2017

      Hello,

      I added another data source to save the shapes and i call the function that i use to add the drawing option at the updateProperty.

      But I think that you can added the code that you need at the afterRender, after having the map:

            this.map = new google.maps.Map(document.getElementById(this.jqElementId), options);

      var polyOptions = {
        strokeOpacity: 0.9,
        strokeWeight: 2,
        strokeColor: zoneColor,
        fillOpacity: 0.50,
        fillColor: zoneColor,
        editable: true,
        draggable: true             
       };
      drawingManager = new google.maps.drawing.DrawingManager({
        drawingControl: true,
        drawingControlOptions: {
         position: google.maps.ControlPosition.TOP_CENTER,
         drawingModes: [
               google.maps.drawing.OverlayType.CIRCLE,
               google.maps.drawing.OverlayType.POLYGON
         ]
        },
        polygonOptions: polyOptions,
        circleOptions: polyOptions
      });
      drawingManager.setMap(this.map);

      drawingManager is declared as global variable.

      For my case, i just want to give the option to draw polygons and circles.

      This is only for drawing the shapes.

      I hope this can help you,

      Regards.

      drawingManager

      Terms & ConditionsAccessibility statement