#冲刺创作新星#GEE用特定的方式加载指定的图片和素材 原创
今天分享一个非常有趣的GEE加载图片的功能,但是值得注意的是,这里的图片都智能来源于特定的网站(https://fonts.google.com/icons)
这个网站的主要内容:材料符号是我们最新的图标,在一个单一的字体文件中整合了超过2500个字形,具有广泛的设计变体。符号有三种风格和四种可调整的可变字体风格(填充、重量、等级和光学尺寸)。
进入网站后选择我们所需的标签,然后再顶部选择链接分享的图表,就会跳出来一个链接,我们直接copy link即可:
具体的操作流程:
// 你可以包括从https://fonts.google.com 提供的材料图标。
// 1.进入https://fonts.google.com/icons
// 2、找到并选择你喜欢的图标。
// 3.在右下角,右击SVG按钮并复制URL。
// 4.将URL粘贴为imageUrl参数。
同样也可以从https://www.gstatic.com获取图片:
// 你也可以包括从https://www.gstatic.com 提供的图片。这些都是谷歌托管的图片。
//主要用于品牌宣传。这里显示的是地球引擎的标志。你可以用gstatic这个选项做的事情并不多。
// 选项,你能做的并不多。
第三种方式:
// 1.用一些数据URI制作一个JSON文件(使用Python的base64包进行编码)。
// 2.将JSON文件上传到云存储桶中
// 3.在EE中把JSON文件作为blob加载,并处理成字典。
// 4.从字典中获取图像数据URI
代码:
// __ __ __ ____ ____ ____ ____ __ __ ____ ___ _____ _ _ ___
// ( \/ ) /__\ (_ _)( ___)( _ \(_ _) /__\ ( ) (_ _) / __)( _ )( \( )/ __)
// ) ( /( )\ )( )__) ) / _)(_ /( )\ )(__ _)(_ ( (__ )(_)( ) ( \__ \
// (_/\/\_)(__)(__) (__) (____)(_)\_)(____)(__)(__)(____) (____) \___)(_____)(_)\_)(___/
print(ui.Label({imageUrl: 'https://fonts.gstatic.com/s/i/materialiconsoutlined/rocket_launch/v1/24px.svg'}));
print(ui.Label({imageUrl: 'https://fonts.gstatic.com/s/i/materialiconstwotone/satellite_alt/v1/20px.svg'}));
print(ui.Label({imageUrl: 'https://fonts.gstatic.com/s/i/materialicons/location_on/v15/24px.svg'}));
print(ui.Label({imageUrl: 'https://fonts.gstatic.com/s/i/materialiconsround/park/v10/24px.svg'}));
print(ui.Label({imageUrl: 'https://fonts.gstatic.com/s/i/materialiconsoutlined/pedal_bike/v14/24px.svg'}));
// ___ ___ ____ __ ____ ____ ___
// / __)/ __)(_ _) /__\ (_ _)(_ _) / __)
// ( (_-.\__ \ )( /( )\ )( _)(_ ( (__
// \___/(___/ (__) (__)(__) (__) (____) \___)
// 你也可以包括从https://www.gstatic.com 提供的图片。这些都是谷歌托管的图片。
//主要用于品牌宣传。这里显示的是地球引擎的标志。你可以用gstatic这个选项做的事情并不多。
// 选项,你能做的并不多。
print(ui.Label({imageUrl: 'https://www.gstatic.com/images/icons/product/earth_engine-128.png'}));
// Earth Engine logo
// ___ __ _____ __ __ ____ ___ ____ _____ ____ __ ___ ____
// / __)( ) ( _ )( )( )( _ \ / __)(_ _)( _ )( _ \ /__\ / __)( ___)
// ( (__ )(__ )(_)( )(__)( )(_) ) \__ \ )( )(_)( ) / /( )\ ( (_-. )__)
// \___)(____)(_____)(______)(____/ (___/ (__) (_____)(_)\_)(__)(__) \___/(____)
// 1.用一些数据URI制作一个JSON文件(使用Python的base64包进行编码)。
// 2.将JSON文件上传到云存储桶中
// 3.在EE中把JSON文件作为blob加载,并处理成字典。
// 4.从字典中获取图像数据URI
var eeDict = ee.Blob('gs://ee-blob-test/blog.json').string().decodeJSON();
eeDict.evaluate(function(eeDict) {
print(ui.Label({imageUrl: eeDict.img1}));
});
// Banana man
// JSON文件中的URI看起来是这样的(一个加载旋钮) ↓
var spinnerUri = 'data:image/gif;base64,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';
// 找到了一个 GIF 微调器,调整它的大小,然后上传到 https://www.base64-image.de/
// 复制 HTML <img> 的结果数据 URI 并粘贴到代码编辑器中或添加到 JSON 对象,如上所示。您还可以使用 base64 库在 Python 中创建 URI。
print(ui.Label({imageUrl: spinnerUri}));
// Loading spinner
ee.Blob(url)
Loads a Blob from a Google Cloud Storage URL.
Arguments:
url (String):
The Blob's Google Cloud Storage URL.
Returns: Blob
ee.Blob(url)
从谷歌云存储的URL中加载一个Blob。
参数:
url (String):
Blob的谷歌云存储URL。
返回。Blob
ui.Label(value, style, targetUrl, imageUrl)
一个文本标签。
参数。
value(字符串,可选)。
要显示的文本。默认为空字符串。
style (Object, optional):
一个允许的CSS样式的对象,其值将被设置为这个小组件。参见style()文档。
targetUrl(字符串,可选)。
要链接的URL。默认为空字符串。
imageUrl(字符串,可选)。
可选的图片地址。如果提供,标签将被渲染成图片,鼠标悬停时将显示数值文本。只允许使用数据:从gstatic.com加载的url和图标。
返回:ui.Label
加载后的结果: