我正在尝试制作一些基于网络的棋盘游戏,我希望界面可以平移和缩放.就像在Google地图中如何平移和缩放地图一样,我希望移动和缩放游戏板.当然,不同的谷歌地图,我不希望与图像瓷砖工作.
谁能给我推荐使用什么技术?这是否适合纯HTML?HTML 5画布?还是SVG?是否需要推荐任何特定的JS库?
我想避免使用flash和Java.浏览器兼容性是加号,但不是最重要的因素.例如,我认为要求旧版IE的Chrome Frame可能没问题.
任何想法/建议将不胜感激.
一些想法:
使用具有" 固定 "策略的OpenLayers UI一次性为您的主板加载矢量图形.(这可能是过于沉重的重量,但它具有全变焦和IE兼容性.)
使用Raphael在SVG中构建您的电路板,使用RaphaelZPD进行平移缩放.RaphaelZPD不是跨浏览器(即使Raphael是),因此你需要Chrome Frame以兼容IE.我想这会非常轻巧.
为主板使用纯SVG,使用SVGpan进行平移缩放.此处也需要Chrome Frame,但如果您愿意,可以使用SVGweb.您可以直接在Inkscape中绘制您的主板,清理SVG并在XML中添加您需要的任何ID(SVG是引擎盖下的XML),如果您愿意,可以使用jQuerySVG与主板交互,或者手动编写脚本交互.我是否提到CSS可以与SVG一起使用? 我认为这是你最好的选择.
我不能想到在这里使用Canvas的优势,除非你有很多动画或位图.SVG在工作方式上更加透明 - 它是引擎盖下的XML,当在页面中呈现时,成为DOM节点,您可以在现代浏览器中轻松操作.
纯HTML可能很难处理扩展.我已经看过很多图像缩放器,但是没有看到复杂的HTML结构,并且需要在缩放级别进行平移会增加复杂性.