my.createMapContext

2024-01-26 08:06

Call this API to create and return a map context object mapContext.

For more information about the related components, see map.

Parameter

Property	Required	Description
mapId	Yes	The ID of the map component.

Return value

The return value is MapContext.

Sample code

copy

//.axml 
<view class="page-section">
      <map
        id="map"
        customMapStyle="light"
        longitude="{{longitude}}"
        latitude="{{latitude}}"
        scale="{{scale}}"
        controls="{{controls}}"
        onControlTap="controltap"
        markers="{{markers}}"
        onMarkerTap="markertap"
        polyline="{{polyline}}"
        polygon="{{polygon}}"
        circles="{{circles}}"
        onRegionChange="regionchange"
        onTap="tap"
        onCalloutTap="callouttap"
        show-location style="width: 100%; height: 200px;"
        include-points="{{includePoints}}"
        ground-overlays="{{ground-overlays}}">
      </map>
  </view>

copy

//.js
Page({
  // ... ...
  onReady() {
    //Call my.createMapContext to obtain the map context.
    this.mapCtx = my.createMapContext('map');
  },
  // ... ...
}）

PageContext.setData(Object)

Call this operation to initialize or reset map data. The parameters are optional.

Sample code

copy

//  .js

this.setData({
    scale: 14,
    longitude: 120.131441,
    latitude: 30.279383,
    'show-location':true,
    // Add a ground overlay. Feature added in v10.1.35.
    'ground-overlays':[{
        'include-points':[{// Upper-right
            latitude: 39.935029,
            longitude: 116.384377,
          },{// Lower-left
            latitude: 39.939577,
            longitude: 116.388331,
          }],
        image:'/image/groundoverlay.png',
        alpha:0.75,
        zIndex:0,
    }],
    // Add a tile overlay. It is a feature added in v10.1.35.
    'tile-overlay':{
      url:'http://xixi.fullspeed.cn/public/map',
      type:0,
      tileWidth:256,
      tileHeight:256,
      zIndex:1,
    },
    markers:[{},{}],
    'include-points':[{},{}],
    // New overview logic added in v10.1.35.
    'include-padding':{left:0, right:0, top:0, bottom:0},
    polyline: [{},{}],
    circles: [{},{}],
    controls: [{},{}],
    polygon: [{},{}],
    'include-padding':{},
    // Support settings at map initialization. It is a feature added in v10.1.50.
    setting:{
        // Gesture
        gestureEnable:0/1,
        // Scale
        showScale:0/1,
        // Compass
        showCompass:0/1,
        // Tilt gestures with both hands
        tiltGesturesEnabled:0/1,
        // Show or hide traffic
        trafficEnabled:0/1,                     
        // Map POI
        showMapText:0/1, 
        // Map logo position
        logoPosition:{centerX:150, centerY:90},                       
    },
});