先打个预防针，企业里是有更多标准化的解决方案的，我这个方案就是图个方便省事。

背景

我们有个小程序里有一个弹窗，弹窗里有个蛮复杂的 ui 设计，然后点击不同的内容会打开对应的视频进行播放。
我考虑到视频内容肯定会增加，那就不能写死代码。这个 ui 比较复杂然后又只是个小弹窗，感觉实在没必要用代码去实现了。
但是图片更新起来快啊，oss 里上传一下就完事。考虑到以后有类似的需求都可以偷个懒，于是就做了这个小工具。

功能

简单说就是给图片上加上热区，每个热区可以配置点击后的事件。

当 ui 更新新的图片后，打开这个工具网站给图片配置一下热区事件，然后导出后还是一张图片，往 oss 里一扔就完成更新了。  

代码里集成这个 sdk 后可以直接响应图片上的点击事件，如果 sdk 不合适你的平台，那就集成一下 core 包，一个纯 js 包，ai 实现一下就完事了。集成起来非常简单。 https://i.imgur.com/a/P7MnuE1.png

网址  

项目网址： https://clickable-img.dev.noteloom.app

后续

因为数据是公开的，所以我想上线个加密功能来着，支持配置一个密钥进行加密。不过看有没有人用吧，没人用就不做了。