The SVG version of the genome browser now actually works. But in order to provide dynamic zooming i have to put all annotations into the tile, which makes the xml tile data quite large. I think it's the render model needs to be improved: in the png implementation I put lots of image map data in the tile too. It can be smaller because if at a certain zooming level, if the track figure width is smaller than 1 pixel, that annotation will not be incorporated into the tile. In this case I will have to make each tile covers smaller regions, the desired length for now is 200kb. So in order to display 1MB i will need 5 tiles, and they could be very poky. The hybrid design says that I use png tiles instead of svg tile when you want to look at very dense annotations globally. The question is: will this actually be necessary? I probably will just forget the performance tuning for now.
Summary
- Performance issues. When svgs are rendered, the tile size determines performance. If tile is too large it can be poky.The solution is to introduce a proxy mechanism. Setting opacity to 1 won't help, the svg has to be removed entirely from the svg dom tree. There are still some issues with the 'updateTile Height mechanism, enabling proxy can set the track height to 0 when updating'. Remove the tile while dragging, add it back when dragging is done.
- The solution works. Use proxy to hide tiles when dragging.
- Add expand/collapse functions to dynamically show/hide annotation names. One funny story: I can't find the text bounding box measure property in SVG! Even it calculates the character/letter width internally can i can get the text bounding box width programmatically. The work around is to pre calculate the letter width of tahoma letters at size 10, then initialize them into the array to calculate display text bounding box width, which is critical when show/hide ids. For those on the boundaries, some off-screen portions will be rendered to maintain consistency.
- must expand/collapse accordingly with new tiles moving in [jumpTo, scrolling functions]
- Height Synchrononization accomplished, however, a case can happen is tile is updated after mouse is released.
- this case, height need to be synced. Otherwise, height will be synced after.
As this function is pretty fast, can call it whenever. Ok, that was my rant when kept the original blog. The new browser sync track height precisely, no need to manually fine-tune track heights - toggle buttons added, add icons later. To show/hide masks, expand/collapse, use proxy, refresh track... lots of button controls
Damn i worked on this for around 1 year already. There were lots of side-kick projects and my prelim in between, which slowed things down quite a bit.
Technology has evolved a lot too.
No comments:
Post a Comment