---
title: ImageSource
source: https://vjmap.com/doc/ImageSource.html
---

# ImageSource
**扩展事件**


包含图像的数据源。（见`样式规范` 有关选项的详细文档。）

### Parameters
- `id` **`string`**
- `options` **(ImageSourceSpecification | VideoSourceSpecification | CanvasSourceSpecification)**
- `dispatcher` **调度员**
- `eventedParent` **`事件发生`**

### Examples
```
// add to map
map.addSource('some id', {
   type: 'image',
   url: 'https://xxx.png',
   coordinates: [
       [-76.54, 39.18],
       [-76.52, 39.18],
       [-76.52, 39.17],
       [-76.54, 39.17]
   ]
});

// update coordinates
var mySource = map.getSource('some id');
mySource.setCoordinates([
    [-76.54335737228394, 39.18579907229748],
    [-76.52803659439087, 39.1838364847587],
    [-76.5295386314392, 39.17683392507606],
    [-76.54520273208618, 39.17876344106642]
]);

// update url and coordinates simultaneously
mySource.updateImage({
   url: 'https://xxx.png',
   coordinates: [
       [-76.54335737228394, 39.18579907229748],
       [-76.52803659439087, 39.1838364847587],
       [-76.5295386314392, 39.17683392507606],
       [-76.54520273208618, 39.17876344106642]
   ]
})

map.removeSource('some id');  // remove
```

### updateImage
更新图像 URL 和（可选）坐标。为避免更改后图像闪烁，请将`raster-fade-duration`光栅图层上的paint属性设置为0。

#### Parameters
- `options` **`Object`** 选项对象。
    - `options.url` **`string`?** 必需的图像 URL。
    - `options.coordinates` **`Array`< `Array`< `number`\>>？**四个地理坐标，表示为经度和纬度数字数组，用于定义图像的角点。坐标从图像的左上角开始，并按顺时针顺序进行。它们不必表示一个矩形。

返回**[ImageSource][268]**这个

### setCoordinates
设置图像的坐标并重新渲染地图。

#### Parameters
- `coordinates` **`Array`< `Array`< `number`\>>**四地理坐标，表示为经度和纬度的数字阵列，它定义了图像的角上。坐标从图像的左上角开始，并按顺时针顺序进行。它们不必表示一个矩形。

返回**[ImageSource][268]**这个