我需要展示一个非常长的领域(没有界定的长度),有许多多动体(模拟——圈子、广场、部分案文)。 显然,我只需要一时看到的小块碎片。 主要问题是高效的滚动活动和交火活动。 我写在WT。 1. 迄今审议的事项:
1) canvas. create a canvas with the size of visible area. Create buffer canvas larger then visible area. Render to the buffer (only changes - if something is changed in the visible area or new parts to the right/left during scrolling). And when required, render proper part of the buffer to visible canvas. This seems to work fast enough. But! I have to implement this smart buffering, decide which part needs to be rerendered and which not. And I need to remember all object to detect mouse clicks and mouseovers (and it should be some nice structure like interval tree or segment tree, as mouseover checks are very frequent - but this is already implemented in the browser, sounds like reinventing the wheel) - this is A LOT OF WORK! Maybe there is something ready?
2) html(divs/images)——因此,想法是让所有元素都具备四分五裂和图像(可产生于Sevas,先是 does。 他们绝对处于长期状态,并使用浏览器进行滚动。 在你结束这一漫长的阶段之前,你必须重新定位一切,以便有更多的空间进行滚动(这将冻结一段时间的滚动)。 因此,也许有可能在第二批时间内完成,然后转换。 它可能发挥作用,但象一个黑板这样的声音,它可能与当时可见的多个物体存在严重问题。 在浏览器中开展模拟活动。
3) SVG - I haven t tried, but I think I will run into the same performance problems as with html/divs (when scrolling to right/left)
Any ideas? Which approach is the best? Is there anything better? WebGL (it won t work in IE and porting to IE would be hard prob). How should I implement this?