我目前正在为客户开发一个房地产网站。客户坚持要创建这样的东西:
http://woodfield-sillery.com/plans/
基本上,我正在寻找一种方法来重新创建相同的东西,从技术上讲,它需要:
- 管理图像映射行为(以便能够对鼠标悬停使用react)
- 管理 onclick 以打开所选楼层的 View
- 选择后,第二张 map 将显示该楼层以及可用的公寓
- 然后再次点击,就会显示价格、库存情况等。
我在通过 CSS 管理翻转图像映射时遇到问题。
除此之外,当然,客户希望自己管理一切(这样他就可以更新公寓状态),而我计划通过 Wordpress 托管该网站
问题:
- 有人研究过这样的解决方案并愿意分享经验吗?
- 有人遇到过可以实现此目的的 WordPress 解决方案吗?
- 有人有这方面的技术解决方案吗(Javascript、HTML5、CSS 组合?)
最佳答案
我是 MapSVG WordPress/jQuery 插件的作者,它能够满足您的需求:http://mapsvg.com
首先,您需要在任何矢量编辑器(InkScape、Adobe Illustator 等)中创建一个空白图像。然后将建筑物图像(png/jpeg)嵌入到背景中。然后在图像顶部添加形状并为它们提供透明颜色填充 (=rgba(0,0,0,0))。将图像保存为 SVG,并将其上传到 MapSVG map 生成器。
其他一切都将在 MapSVG Builder 中完成 - 颜色、工具提示、弹出窗口、链接、事件处理程序等。请参阅演示。
关于javascript - 管理图像 map ,管理与区域 map 的交互,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35230434/