Loading Profile...
Can you pan, zoom and preload tiles with one function?
I kinda need a zoom and pan function that zooms in on a location, I made one using existing pan and zoom functions but it totally misses it's target, this is the code and it's basically a mashup of the panTo and zoomTo functions by "Cupcake 18971"
public function panAndZoomTo(targetLoc:Location, zoomTarget:Number) {
var centerPoint:Point = locationPoint(__mapProvider.coordinateLocation(grid.centerCoordinate()), grid);
var targetPoint:Point = locationPoint(targetLoc, grid);
var distance:Point = new Point(Math.round((targetPoint.x - centerPoint.x) / panAndZoomFrames), Math.round((targetPoint.y - centerPoint.y) / panAndZoomFrames));
var levelDelta:Number = zoomTarget - grid.zoomLevel;
for(var i = 1; i <= panAndZoomFrames; i += 1) {
__animSteps.push({type: 'pan', amount: distance});
__animSteps.push({type: 'zoom', amount: ((1/zoomFrames) * levelDelta), redraw: true});
}
if(!__animTask) {
__startingZoom = grid.zoomLevel;
__currentZoom = grid.zoomLevel;
__startingPosition = new Point(grid._x, grid._y);
__currentPosition = new Point(grid._x, grid._y);
onStartPan();
onStartZoom();
animationProcess();
}
}
Is this even possible? Also as a bonus, I'd like it to preload the tiles around the target location to avoid gigantic pixels.
Thanks in advance!
public function panAndZoomTo(targetLoc:Location, zoomTarget:Number) {
var centerPoint:Point = locationPoint(__mapProvider.coordinateLocation(grid.centerCoordinate()), grid);
var targetPoint:Point = locationPoint(targetLoc, grid);
var distance:Point = new Point(Math.round((targetPoint.x - centerPoint.x) / panAndZoomFrames), Math.round((targetPoint.y - centerPoint.y) / panAndZoomFrames));
var levelDelta:Number = zoomTarget - grid.zoomLevel;
for(var i = 1; i <= panAndZoomFrames; i += 1) {
__animSteps.push({type: 'pan', amount: distance});
__animSteps.push({type: 'zoom', amount: ((1/zoomFrames) * levelDelta), redraw: true});
}
if(!__animTask) {
__startingZoom = grid.zoomLevel;
__currentZoom = grid.zoomLevel;
__startingPosition = new Point(grid._x, grid._y);
__currentPosition = new Point(grid._x, grid._y);
onStartPan();
onStartZoom();
animationProcess();
}
}
Is this even possible? Also as a bonus, I'd like it to preload the tiles around the target location to avoid gigantic pixels.
Thanks in advance!
I’m confused
1
person has this problem
I have this problem, too!
Tell me when someone solves it.
The more people who report this problem, the more it gets noticed.
The more people who report this problem, the more it gets noticed.
Create a customer community for your own organization
Plans starting at $19/month
-
Inappropriate?Pre-loading? Sounds awesome. However, in the current version this will be very tricky, for a whole host of reasons.
Luckily for you, I've been working on branch of the AS3 code that might make all this a bit easier. It's still not stable, but you might want to experiment with it. It's in subversion under branches/tom-tweenlite/ – please remember that this is my sandbox right now, I can't be responsible for breaking your code if I change my mind about how something works.
TileGrid.as is completely rewritten in the tween branch, and there's a panAndZoomIn function on map that it might be possible to repurpose for what you want. Then I imagine the step to make a pre-loader would be to add a function to TileGrid that looks a lot like the onRender function but doesn't add tiles to the stage, only to the load queue. Then you'll want to make sure that those tiles are special and don't get removed from the recentlySeen and alreadyLoaded collections before they're actually shown (I am considering how to do this myself, perhaps a boolean on the Tile class).
A note on the transform stuff in the new TileGrid: tx, ty and sc set the center position of the whole world at zoom level 0. Because we're dealing with 256x256 tiles then tx=-128 and ty=-128 centers the grid. Each power of 2 in scale corresponds to a new zoom level, sc=1 is zoom level 0, sc=2 is zoom 1, sc=8 is zoom 3, etc. So your preloading function will want to figure out where the world *will* be when you're done scaling.
The way it currently works, it should be safe to call map.setCenterZoom then map.grid.preloadCurrentView then map.setCenterZoom back to your old zoom. So long as your preload function doesn't modify the Tile container (grid.well), nobody will notice. (Well, events will be thrown, but they will be undone).
One last thing - in the new TileGrid, the load queue is sorted by distance from the center tile... if you're precaching tiles you'll want to make sure they're all loaded before moving, otherwise new additions to the queue will get loaded first.
Note that panning over a large distance will trigger a lot of loading and unloading of tiles, even with the rewrite. iPhone Google Maps style zoom-out-and-back-in panning would be really nice if you can figure it out... Good luck!
I’m unsure
1 person says
this solves the problem
-
Inappropriate?Wow, thanks for the response!
The biggest problem for me now is that I'll have to use the AS2 version, and the zoom can't seem to zoom in on the center (if I first pan to where I want and then zoom it ends up in the wrong place)
The preloading is probably to much for me to do now as I'm running low on time for this project, but to get the zoom to zoom in on a lat/long coordinate is a pretty high priority. With this solved a zoom out-pan-zoom in like iPhone GMaps wouldn't be very hard (except you'll still end up with very pixelated tiles without a preload function)
Another thing I'm going to try is to expand the cache to keep more tiles in memory to reduce requests to the maps server, and also fading of tiles, so when you zoom in it keeps the old bigger tiles visible and then fades in new tiles on top of them for a more seamless experience.
Also, smooth zooming and panning like flashearth.com would be awesome, and maybe even the ability to throw the map around like the scrolling on the iPhone.
Another thing(perhaps in need of another topic) is grouping of markers when you zoom out, I figured out how to do this more or less manually, where you set a max and min zoom level for where a marker is visible and then set a parent marker that gets drawn when the child markers are hidden, eg. marker1 and 2 are visible on levels 6 to 17, and their parent is visible between 1 and 5. But modest maps could probably benefit from a more automatic version of this (when a bunch of markers are more or less on top of each other they get replaced by a single marker)
If anything of this is doable any hints on how to do it is very appreciated, I will post any solutions I find on the way.
I’m thankful
EMPLOYEE
