Angular 8 中的图像地图动态调整大小

Question

我想动态调整一个图像地图的大小。我只找到了一个jQuery的解决方案 (https://github.com/stowball/jQuery-rwdImageMaps)

在Angular中，我该如何实现这个功能？

- hfs23

---

嘿，你找到解决方案了吗？ - ZINE Mahmoud

Answer 1

之前的答案是正确的，但您需要将 imageMapResizer.min.js 下载到资源文件夹中。

然后，您应该在 index.html 文件中像这样导入它：

<script src="./assets/imageMapResizer.min.js"></script>

我原本以为应该在 angular.json 文件中导入该文件，但是没有起作用... index.html 对我有帮助。

- Tomas Lukac

Answer 2

您可以使用https://github.com/davidjbradshaw/image-map-resizer，它可以通过JavaScript调用来实现：

示例

在HTML中：

 <img src="...." width="100%"  usemap="#usaMap" (load)="imageResized();">

在TS中：

declare function imageMapResize(): void;

@Component({...

})
...
imageResized() {
  imageMapResize(); // Javascript function in imageMapResizer.min.js 
}

- FeelCode