svg text renders slowly, without text the svg is super quick about books-library-stack HOT 5 OPEN

moving from visibility: hidden/visible to display: none/block helped at the outer zoom levels, but not so much at the inner zoom levels.

Perhaps a radius about the graphic's center could be used to cull outlying text ouside the focus. This would have to be a function of scale.

from books-library-stack.

Instead of a radius, it would be helpful to cull all text that is not displayed (outside the viewport).

This is surprisingly difficult to implement, since the only information given is the total viewport size (which appears to be absolute, irrespective of scale), the scale, and the translate (position which is relative to scale). Finding the bounding box which is displayed seems super hard. It seems like the translate marks one of the corners (upper left?), but scaling the window size into the SVG coordinate system so that it is relative to the position is not panning out.

from books-library-stack.

This might be best done with a D3 join:
http://bost.ocks.org/mike/join/

Perform a selectAll() on all the text in the SVG. Run a filter on the data that takes into account depth and location and returns only those elements.

enter() then corresponds to new text elements that should be added and exit() corresponds to those text elements that are no longer in the frame of reference and can be deleted.

Now instead of hiding and unhiding, we're actually culling objects from the SVG, which should improve rendering.

Caveat is still on figuring out how to determine the visible region vs the regions outside the SVG's visible canvas.

from books-library-stack.

Well what if we don't do the display:none, but only append text to circles
when we have zoomed in on it.

Zoom to a Unit, it adds the Unit name to the circle
Hover over a person, it adds the person name to the circle

On Mon, Nov 4, 2013 at 1:27 AM, Bryan Bonvallet [email protected]:

This might be best done with a D3 join:
http://bost.ocks.org/mike/join/

Perform a selectAll() on all the text in the SVG. Run a filter on the
data that takes into account depth and location and returns only those
elements.

enter() then corresponds to new text elements that should be added and
exit() corresponds to those text elements that are no longer in the frame
of reference and can be deleted.

Now instead of hiding and unhiding, we're actually culling objects from
the SVG, which should improve rendering.

Caveat is still on figuring out how to determine the visible region vs the
regions outside the SVG's visible canvas.

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/7#issuecomment-27666236
.

from books-library-stack.

That is exactly what I was saying. ;)

"Now instead of hiding and unhiding, we're actually culling objects" ... "
and "exit() corresponds to those text elements that are no longer in the
frame of reference and can be deleted." Deleted as in remove() as in not
part of the DOM anymore.

We're on the same page. D3's data-join thing was super weird, but now that
I finally understand it, I understand how to add/update/remove DOM objects
based on dynamic criteria.

On Mon, Nov 4, 2013 at 6:04 AM, Seth Woodworth [email protected]:

Well what if we don't do the display:none, but only append text to circles
when we have zoomed in on it.

Zoom to a Unit, it adds the Unit name to the circle
Hover over a person, it adds the person name to the circle

On Mon, Nov 4, 2013 at 1:27 AM, Bryan Bonvallet [email protected]:

This might be best done with a D3 join:
http://bost.ocks.org/mike/join/

Perform a selectAll() on all the text in the SVG. Run a filter on the
data that takes into account depth and location and returns only those
elements.

enter() then corresponds to new text elements that should be added and
exit() corresponds to those text elements that are no longer in the
frame
of reference and can be deleted.

Now instead of hiding and unhiding, we're actually culling objects from
the SVG, which should improve rendering.

Caveat is still on figuring out how to determine the visible region vs
the
regions outside the SVG's visible canvas.

—
Reply to this email directly or view it on GitHub<
https://github.com/sethwoodworth/books-library-stack/issues/7#issuecomment-27666236>

.

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/7#issuecomment-27686541
.

from books-library-stack.