画像の一部をマウスオン/クリックして色を変えるとかするにはSVGじゃないと無理

気合でPNG→SVGにするのが一番早い

いわゆるクリッカブルマップとか言われるもの。
手元にpngしかないときはあきらめてSVGを作ること。

一部分だけホバーやクリックで色変えたりするのは無理。
多角形も書けるので画像を下敷きにしてIllustratorとか下記のvectr(無料で使えるしブラウザのみでも使える)でSVGにする方が恐らく早い。

結局はレイヤー情報を残したSVGが必要なのでpng→svgコンバータ的な奴だとダメ。

SVG完成後

できたSVGをテキストファイル等で開いてからHTMLにコピペ。
IDは指定できないのでブラウザの開発者モードで1つずつ特定していく。

残念ながら楽する方法はない……

もはやWeb屋さんの世界なので自前でやるとしたらこれくらいまでかと。
それ以上ならもうお金で他人にやってもらった方がいいかと。
うまく探せば10,000円程度で.ai形式での納品も頼めるはず。

参考

結局使わなかったが、pngやjpgを使ったクリッカブルマップや今回のSVGによるクリッカブルマップ風の実装で参考になる記事を紹介。