JavaScript esri/views/Magnifier用法及代码示例

基本信息

以下是所在类或对象的基本信息。

AMD: require(["esri/views/Magnifier"], (Magnifier) => { /* code goes here */ });

ESM: import Magnifier from "@arcgis/core/views/Magnifier";

类： esri/views/Magnifier

继承: Magnifier > Accessor

自从：用于 JavaScript 4.19 的 ArcGIS API

用法说明

放大镜允许最终用户将视图的一部分显示为放大图像。可以通过 MapView.magnifier 或 SceneView.magnifier 访问此类的实例。

magnifier-overlay

正如您在上面的屏幕截图中所见，放大镜使用放大镜玻璃的默认叠加图像。使用overlayUrl 属性设置覆盖图像。您可以通过将 Magnifier.overlayEnabled 设置为 false 来禁用覆盖图像。下面演示了使用没有叠加图像的放大镜。

magnifier-no-overlay

放大镜包含使用 maskUrl 设置的默认蒙版图像，并确定放大图像的可见区域。默认情况下，放大区域为圆形。下面演示一个以正方形形状设置的蒙版图像的示例。请注意，在此示例中，overlayEnabled 也设置为false，以隐藏叠加图像，仅显示放大区域。

magnifier-maskUrl

例子：

view.when(() => {
  view.magnifier.visible = true;

  const offset = view.magnifier.size / 2;
  view.magnifier.offset = { x: offset, y: offset };

  //The magnifier will be displayed whenever the cursor hovers over the map.
  view.on("pointer-move", function (event) {
    view.magnifier.position = { x: event.x, y: event.y };
  });
});

相关用法

注：本文由纯净天空筛选整理自arcgis.com大神的英文原创作品 esri/views/Magnifier。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。