ImagePyramidRenderer gets squished when position is set via x or y value. Why oh why?
Hi! Im hoping Daniel or another community member has insight on this, ive been debugging an embarrasingly long time! I hope im just missing some simple adjustment.
I started a new thread to focus on the problem ( although this is related to http://community.openzoom.org/openzoo...)
Goal: put a bunch of ImagePyramidRenderer objects in one MultiScaleContainer - and give each one .x and .y values so that they will be properly lined up. The problem is that when the x or y values are non-zero, the images start to get squished. (And i believe for the same reason, some tiles do not get rendered when you zoom in.)
I've put 3 simple test cases together to demonstrate the problem and hopefully help solve this.
Note that there is a humble 200x200px teal square sprite in the topleft corner of the MultiScaleContainer.
1.
Here is an ImagePyramidRenderer with x=0. Everything works great:
http://www.dandelion.org/timescience/...
2.
Here is the same thing - but with x=864 (half the width of the ImagePyramidRenderer) (Note, I set my sceneWidth and Height equal to the size of the ImagePyramidRenderer for easier value debugging)
http://www.dandelion.org/timescience/...
You can see that the left side is shifted over, but the right side is flush with the right border. The image has been squashed horizontally. I would have expected the left side of the image to show up in the middle of the screen, but instead it is only 1/3 of the way over. I also would have expected (hoped) the right side would go off screen. Its like the MultiScaleContainer just increased its width to incorporate the content. Also note that the teal square sprite is squished.
And now if you zoom in - the right most tiles do not get rendered properly - i presume because of an inconsistency with the squishing.
3.
A final related example. I made the teal sprite very wide (3000px) - and this has a similar effect - the MultiScaleContainer seems to grow to accomodate all displayobject content. But it is all rendered in the same 300x300 application - so the content gets squished - here quite drastically, and again drastic problems with tile rendereing once you zoom in:
http://www.dandelion.org/timescience/...
*
My question and desire: How can I offset the coordinates of ImagePyramidRenderers without having the squishing and tile rendering issues?
I assume it has to do with the NormalizedViewport where everything is referenced on 0-1 basis. But I just could not make headway in tracing and debugging.
Thanks for any assistance!
Topher
I started a new thread to focus on the problem ( although this is related to http://community.openzoom.org/openzoo...)
Goal: put a bunch of ImagePyramidRenderer objects in one MultiScaleContainer - and give each one .x and .y values so that they will be properly lined up. The problem is that when the x or y values are non-zero, the images start to get squished. (And i believe for the same reason, some tiles do not get rendered when you zoom in.)
I've put 3 simple test cases together to demonstrate the problem and hopefully help solve this.
Note that there is a humble 200x200px teal square sprite in the topleft corner of the MultiScaleContainer.
1.
Here is an ImagePyramidRenderer with x=0. Everything works great:
http://www.dandelion.org/timescience/...
2.
Here is the same thing - but with x=864 (half the width of the ImagePyramidRenderer) (Note, I set my sceneWidth and Height equal to the size of the ImagePyramidRenderer for easier value debugging)
http://www.dandelion.org/timescience/...
You can see that the left side is shifted over, but the right side is flush with the right border. The image has been squashed horizontally. I would have expected the left side of the image to show up in the middle of the screen, but instead it is only 1/3 of the way over. I also would have expected (hoped) the right side would go off screen. Its like the MultiScaleContainer just increased its width to incorporate the content. Also note that the teal square sprite is squished.
And now if you zoom in - the right most tiles do not get rendered properly - i presume because of an inconsistency with the squishing.
3.
A final related example. I made the teal sprite very wide (3000px) - and this has a similar effect - the MultiScaleContainer seems to grow to accomodate all displayobject content. But it is all rendered in the same 300x300 application - so the content gets squished - here quite drastically, and again drastic problems with tile rendereing once you zoom in:
http://www.dandelion.org/timescience/...
*
My question and desire: How can I offset the coordinates of ImagePyramidRenderers without having the squishing and tile rendering issues?
I assume it has to do with the NormalizedViewport where everything is referenced on 0-1 basis. But I just could not make headway in tracing and debugging.
Thanks for any assistance!
Topher
1
person has this question
I have this question, too!
Tell me when someone answers.
The more people who ask this question, the more it gets noticed.
The more people who ask this question, the more it gets noticed.
-
Inappropriate?ps. Ive put KapInspect in all the apps so you can hit Ctrl-Alt-F12 in the app to view the displaylist and object values.
I dont need answers to these but I was confused by a few things.
1. I traced the display list and nothing appears to be squished - in fact the trace from all three cases is the same.
- OffsetTest0.offset_image_uicomponent do: 0 offset_image_uicomponent x: 0 y: 0 w: 300 h: 300 vis: true sX: 1 sY: 1
- > [object MultiScaleContainer] do: 0 instance23 x: 0 y: 0 w: 300 h: 300 vis: true sX: 1 sY: 1
- > > [object Sprite] do: 0 s_mscontainer x: 0 y: 0 w: 204 h: 204 vis: true sX: 1 sY: 1
- > > [object ImagePyramidRenderer] do: 1 instance29 x: 864 y: 0 w: 1728 h: 1152 vis: true sX: 1 sY: 1
- > > > [object Sprite] do: 0 tileLayer x: 0 y: 0 w: 1732 h: 1156 vis: true sX: 1 sY: 1
- > [object Sprite] do: 1 sprite_help x: 0 y: 0 w: 301 h: 301 vis: true sX: 1 sY: 1
2. In my code the ImagePyramidRenderer is added as a child to the MultiScaleScene of the MultiScaleContainer with "container._scene.addChild(image)", but in the displaylist I dont see the MultiScaleScene at all.
ImagePyramidRenderer is just a child of MultiScaleContainer.
I’m confusio
-
Inappropriate?Topher,
Aaaaaaaah!! The reason I haven't responded to you so far but to most other posts is because yours definitely needs some code time which I hadn't had yet. In fact, after returning from the U.S. I still need to set up my local OpenZoom work environment. Until this is done I can only offer little advice :'(
Question: How do you add your ImagePyramidRenderer children to the MultiScaleContainer?
No matter what, I'm fairly confident we can solve this problem as I've already got something similar to work before, assuming I haven't introduced a new bug since then ;)
http://indupart.ch/en/catalogue-viewe...
Cheers,
Daniel
I’m trying to get my shit together
-
Inappropriate?Thanks for your response! I figured the old post just slipped under the radar or something. Thats great to see a working example.
Eventually I need to create a unique rendermanager for each ImagePyramidRenderer which is why I had that line: "container._scene.addChild(image)". (Why? because i want to track loading for each image.)
But I tested with a simpler case, where I just add the image straight to the container "container.addChild(image) " and I have the same problem.
Code file is here if you want to peek:
http://www.dandelion.org/timescience/...
http://www.dandelion.org/timescience/...
So here are the significant code bits in this simpler case:
source="http://www.dandelion.org/timescience/...;
descriptor = new GigaPanDescriptor(source + "/tiles", image_width, image_height)
addImage(descriptor);
//test offsets
image.x = 864;//1728;//100;//15000;
private function addImage(descriptor:IImagePyramidDescriptor):void
{
sceneWidth = descriptor.width;
sceneHeight = descriptor.height;
// resize scene
container.sceneWidth = sceneWidth
container.sceneHeight = sceneHeight
// create renderer
image = createImage(descriptor,
sceneWidth,
sceneHeight)
container.addChild(image)
dispatchEvent(new Event(Event.COMPLETE))
}
private function createImage(descriptor:IImagePyramidDescriptor,
width:Number,
height:Number):ImagePyramidRenderer
{
var image:ImagePyramidRenderer = new ImagePyramidRenderer()
image.source = descriptor
image.width = width
image.height = height
return image
}
I’m hopeful
-
Inappropriate?OK - your example jogged my neurons and I think I found a solution!
I was setting everything to "maximum size" basically the container and the image and the scene were all the same size - which is fine. But then you get these problems demonstrated above when you move the image beyond the pixel dimensions specified for the container. (or scene?)
So I just tested offsetting my image - but also making it twice as small
image = createImage(descriptor,
sceneWidth/2,
sceneHeight/2)
And now it is rendering at the correct aspect ratio and with all tiles! So i just need to make my images smaller - and then zoom the viewport so that the image fills the panel. As long as I have enough margin around the images then they can all be offset within that margin.
Still need to try this in my real app instead of this test.
Topher
I’m relieved
-
Inappropriate?Topher,
Puh, I'm glad you've found the solution. Indeed, it is absolutely crucial that you (and your objects) never leave the scene dimensions, otherwise you'll witness the bugs you've found.
It seems there's a lot I should still blog about but for various reasons I've lately put less energy into OpenZoom.
Let me know if you need further help.
Cheers,
Daniel
I’m glad
-
Inappropriate?I just wanted to confirm that that was indeed the problem and now all is happy openzoomness. Thanks again for your help.
http://ee.uchicago.edu/gigapan/gigavi...
I’m done
-
Inappropriate?Topher,
Awesome, I'm glad it worked and somewhat angry at myself for not being able to pinpoint the cause of the issue earlier!
Thanks for persevering.
I've added your wonderful viewer to the showcase on http://openzoom.org :)
If you have feedback regarding what kind of documentation could've helped you or if you're interested to write a tutorial yourself, please get in touch.
Cheers,
Daniel
P.S. If OpenZoom helped you bring your idea to life, please consider stopping by http://openzoom.org and leave a donation, thanks :)
I’m like yay!
Loading Profile...




EMPLOYEE