在接下来的几个星期里,我将很乐意为公寓楼开发一个交互式平面图导航仪和观众,这将使其基于闪存的前身成功.
我现在正在评估最适合在HTML5中实施这些技术和技术的技术和技术.
我将不得不支持所有常见的浏览器(IE从7开始).
我需要的是相当简单：
用户可以看到建筑物的几个静态户外视图,两者之间可以用简单的窗口小部件切换.
他可以在这个外部视图中选择一个楼层.在鼠标悬停(点击触摸设备)时,会突出显示地板.
点击楼层后,您可以切换到平面图,这也是鼠标悬停/ onclick上的详细信息.
应该参与一些动画,但也没有什么太花哨.
您可以在这里查看基于Flash的版本：http://salitergasse.at/sg9/eigentumswohnungen/moedling/perchtoldsdorf
我一直在考虑实施这个的选择.
我还需要一个快速的选择多边形的方式(总览)公寓(平面图),以允许非开发者创建新的建筑物.
我想出的选择：
– )使用平面图像和图像映射作为中介.
– )使用画布(在不支持的情况下,使用Google的Javascript解决方案进行浏览).将图像加载到画布标签中并动态创建排版.
– )使用SVG
你们有什么感想？
跨浏览器兼容性的最佳选择是什么？
有这样的经验吗？
我会感谢任何建议.
解决方法
这里有一些其他的考虑：
> Canvas适用于所有“现代”浏览器,但不能用于IE7 / 8
> SVG在所有现代浏览器中工作,VML(非常接近)在IE7 / 8中
> Canvas中的文本呈现可以看起来与每个浏览器相当不同
> Canvas在一定程度上在Android和iOS中起作用(文字渐变的小事情仍然混乱)
> SVG在Android中不起作用(至少在一年前没有改变任何内容)它在iOS中有效
SVG的可访问性更好.文本是可搜索的,因此SEO友好,盲人友好,复制和粘贴友好等.与DOM的其余部分进行交互更为自然.
>画布表现更好,但您不需要.
在这一点上,它们相当平等,除了旧版本的IE.您可以使用excanvas库来获取Canvas的工作,但是它有点吸引人,尤其是如果有任何事情要移动.
我建议使用SVG,因为您可以在平面图类型的应用程序上快速地开发出更快的地面.一切都已经是一个DOM对象.事件,鼠标处理等已经为您完成.
但是如果你真的想要它(旧的)android手机,Canvas可能是现在更好的赌注.