Pengumuman: Semua project nonkomersial yang terdaftar untuk menggunakan Earth Engine sebelum
15 April 2025 harus
memverifikasi kelayakan nonkomersial untuk mempertahankan akses Earth Engine.
ui.Thumbnail
Tetap teratur dengan koleksi
Simpan dan kategorikan konten berdasarkan preferensi Anda.
Gambar thumbnail berukuran tetap yang dibuat secara asinkron dari ee.Image.
Penggunaan | Hasil |
---|
ui.Thumbnail(image, params, onClick, style) | ui.Thumbnail |
Argumen | Jenis | Detail |
---|
image | Gambar, opsional | ee.Image yang akan digunakan untuk membuat thumbnail. Default-nya adalah ee.Image kosong. |
params | Objek, opsional | Untuk penjelasan tentang kemungkinan parameter, lihat ui.Thumbnail.setParams(). Default ke objek kosong. |
onClick | Fungsi, opsional | Callback diaktifkan saat thumbnail diklik. |
style | Objek, opsional | Objek gaya CSS yang diizinkan dengan nilai yang akan ditetapkan untuk label ini. Nilai defaultnya adalah objek kosong. |
Contoh
Code Editor (JavaScript)
// The goal is to create a series of thumbnail images for an elevation dataset
// with different backgrounds. The background layers and image visualization
// are previewed in the Code Editor map before creating the thumbnails.
// Define a black background.
var blackBg = ee.Image.rgb(0, 0, 0)
.visualize({min: 0, max: 255});
Map.addLayer(blackBg, {}, 'Black background');
// Define a water / land background.
var waterLandBg = ee.Image('NOAA/NGDC/ETOPO1').select('bedrock').gt(0.0)
.visualize({palette: ['cadetblue', 'lightgray']});
Map.addLayer(waterLandBg, {}, 'Water / land background');
// A map display of a digital elevation model (DEM).
var image = ee.Image('AU/GA/DEM_1SEC/v10/DEM-S').select('elevation')
.visualize({
min: -10.0,
max: 1300.0,
palette: [
'3ae237', 'b5e22e', 'd6e21f', 'fff705', 'ffd611', 'ffb613', 'ff8b13',
'ff6e08', 'ff500d', 'ff0000', 'de0101', 'c21301', '0602ff', '235cb1',
'307ef3', '269db1', '30c8e2', '32d3ef', '3be285', '3ff38f', '86e26f'
],
});
Map.addLayer(image, {}, 'Elevation');
// Set the center of the map.
var lon = 133.95;
var lat = -24.69;
Map.setCenter(lon, lat, 4);
// Set the basic parameters for the thumbnail.
// Half-width of the thumbnail in degrees in EPSG:3857.
var delta = 22;
// Width and Height of the Thumbail image.
var pixels = 256;
var areaOfInterest = ee.Geometry.Rectangle(
[lon - delta, lat - delta, lon + delta, lat + delta], null, false);
var parameters = {
dimensions: [pixels, pixels],
region: areaOfInterest,
crs: 'EPSG:3857',
format: 'png'};
// Create a thumbnail with no background fill.
// Masked pixels will be transparent.
print(ui.Thumbnail({image: image, params: parameters}));
// Use a black background to replace masked image pixels.
var imageWithBlackBg = blackBg.blend(image);
print(ui.Thumbnail({
image: imageWithBlackBg, params: parameters}));
// Use the water / land background to replace masked image pixels.
var imageWithWaterLandBg = waterLandBg.blend(image);
print(ui.Thumbnail({
image: imageWithWaterLandBg, params: parameters}));
Kecuali dinyatakan lain, konten di halaman ini dilisensikan berdasarkan Lisensi Creative Commons Attribution 4.0, sedangkan contoh kode dilisensikan berdasarkan Lisensi Apache 2.0. Untuk mengetahui informasi selengkapnya, lihat Kebijakan Situs Google Developers. Java adalah merek dagang terdaftar dari Oracle dan/atau afiliasinya.
Terakhir diperbarui pada 2025-07-26 UTC.
[null,null,["Terakhir diperbarui pada 2025-07-26 UTC."],[[["\u003cp\u003e\u003ccode\u003eui.Thumbnail\u003c/code\u003e creates a fixed-size thumbnail image from an \u003ccode\u003eee.Image\u003c/code\u003e asynchronously.\u003c/p\u003e\n"],["\u003cp\u003eThumbnail generation is customizable with parameters like dimensions, region, CRS, and format.\u003c/p\u003e\n"],["\u003cp\u003e\u003ccode\u003eui.Thumbnail\u003c/code\u003e allows for setting an \u003ccode\u003eonClick\u003c/code\u003e callback function and custom styles.\u003c/p\u003e\n"],["\u003cp\u003eBackgrounds can be blended with the primary image for thumbnail visualizations.\u003c/p\u003e\n"],["\u003cp\u003eThe example demonstrates thumbnail creation for an elevation dataset with different background options.\u003c/p\u003e\n"]]],[],null,["# ui.Thumbnail\n\n\u003cbr /\u003e\n\nA fixed-size thumbnail image generated asynchronously from an ee.Image.\n\n\u003cbr /\u003e\n\n| Usage | Returns |\n|------------------------------------------------------------------|--------------|\n| `ui.Thumbnail(`*image* `, `*params* `, `*onClick* `, `*style*`)` | ui.Thumbnail |\n\n| Argument | Type | Details |\n|-----------|--------------------|-----------------------------------------------------------------------------------------------------------|\n| `image` | Image, optional | The ee.Image from which to generate the thumbnail. Defaults to an empty ee.Image. |\n| `params` | Object, optional | For an explanation of the possible parameters, see ui.Thumbnail.setParams(). Defaults to an empty object. |\n| `onClick` | Function, optional | A callback fired when the thumbnail is clicked. |\n| `style` | Object, optional | An object of allowed CSS styles with their values to be set for this label. Defaults to an empty object. |\n\nExamples\n--------\n\n### Code Editor (JavaScript)\n\n```javascript\n// The goal is to create a series of thumbnail images for an elevation dataset\n// with different backgrounds. The background layers and image visualization\n// are previewed in the Code Editor map before creating the thumbnails.\n\n// Define a black background.\nvar blackBg = ee.Image.rgb(0, 0, 0)\n .visualize({min: 0, max: 255});\nMap.addLayer(blackBg, {}, 'Black background');\n\n// Define a water / land background.\nvar waterLandBg = ee.Image('NOAA/NGDC/ETOPO1').select('bedrock').gt(0.0)\n .visualize({palette: ['cadetblue', 'lightgray']});\nMap.addLayer(waterLandBg, {}, 'Water / land background');\n\n// A map display of a digital elevation model (DEM).\nvar image = ee.Image('AU/GA/DEM_1SEC/v10/DEM-S').select('elevation')\n .visualize({\n min: -10.0,\n max: 1300.0,\n palette: [\n '3ae237', 'b5e22e', 'd6e21f', 'fff705', 'ffd611', 'ffb613', 'ff8b13',\n 'ff6e08', 'ff500d', 'ff0000', 'de0101', 'c21301', '0602ff', '235cb1',\n '307ef3', '269db1', '30c8e2', '32d3ef', '3be285', '3ff38f', '86e26f'\n ],\n });\nMap.addLayer(image, {}, 'Elevation');\n\n// Set the center of the map.\nvar lon = 133.95;\nvar lat = -24.69;\nMap.setCenter(lon, lat, 4);\n\n// Set the basic parameters for the thumbnail.\n// Half-width of the thumbnail in degrees in EPSG:3857.\nvar delta = 22;\n// Width and Height of the Thumbail image.\nvar pixels = 256;\n\nvar areaOfInterest = ee.Geometry.Rectangle(\n [lon - delta, lat - delta, lon + delta, lat + delta], null, false);\n\nvar parameters = {\n dimensions: [pixels, pixels],\n region: areaOfInterest,\n crs: 'EPSG:3857',\n format: 'png'};\n\n// Create a thumbnail with no background fill.\n// Masked pixels will be transparent.\nprint(ui.Thumbnail({image: image, params: parameters}));\n\n// Use a black background to replace masked image pixels.\nvar imageWithBlackBg = blackBg.blend(image);\nprint(ui.Thumbnail({\n image: imageWithBlackBg, params: parameters}));\n\n// Use the water / land background to replace masked image pixels.\nvar imageWithWaterLandBg = waterLandBg.blend(image);\nprint(ui.Thumbnail({\n image: imageWithWaterLandBg, params: parameters}));\n```"]]