We Keep Coding

D3 zoom behavior change in v3 breaking map tile example

I am building a tiled map based on d3. So I found the corresponding d3 example and copy pasted its code to start my implementation. I need to add overlays to the map so went on and discovered they were misplaced and did not follow the map tiles when zooming. I spent a lot of time bisecting the difference between my adapted copy-paste and the original example and found out this was due to the fact that the example uses v2 of d3 and I am using v3.
My findings is that the main change between v2 and v3 is the behavior of the zoom and translation together. So I tested by zooming and printing the translation vector, and my findings are:
In v2, the projection.translate vector is kept unchanged if the mouse cursor is on the (lat,long) = 0,0) on the initial tile.
In v3, the projection.translate vector is kept unchanged if the mouse cursor is on the top left (most NW point) of the initial tile.
I've made a fiddle in which I copy-pasted the example code, added my debug dots that should cover the earth plus a dot on Paris to see if alignment with the tiles is correct.
You will note that Paris is not correctly placed, (but would be if you run this on d3 v2).
So I guess now there is just some Math to do on my side to update the initial example logic, probably where the tile_origin or tile translation computation.is made. I just started to try to fix them but this seem not trivial. So I am asking here if anybody has an idea of what to change in the example to have it working in v3 (i.e. having a red dot following Paris whatever the zoom level is).
I also could not find any related change in the v3 changelog, if any knows what exactly changed this could help me.

Ok so the best solution is to start from scratch from a v3 example, like http://bl.ocks.org/mbostock/4132797 (which I tried and succeeded with) or http://bl.ocks.org/mbostock/4150951 as Lars Kotthoff commented.

Mapbox not drawing all tiles, when inside a Telerik splitter

We have a legacy website from which the powers-that-be have decided we need to remove all of our Google maps, replacing them with maps provided by MapBox. So I'm in the middle of a crash project to swap out the old for the new.
And here's my problem: the old site is written in ASP.NET, making heavy use of Telerik's controls. In this page we have a RadSplitter, and a Google map being drawn in a RadPane.
Swapping out the Google map with the MapBox map was simple enough, except that the MapBox map isn't rendering correctly. Only the tiles along the left edge of the pane are drawing. But - when I resize the browser window, the rest of the tiles draw.
The div is defined with position: absolute, and top, bottom, right, and left set to 0. Which Google maps worked with.
My guess is that Telerik is doing something that is confusing the MapBox rendering code about the actual size of the div. And that when the window resizes, MapBox re-evaluates things, and gets it right.
I've been playing around with this for a couple of hours now, and getting nowhere:
I've tried triggering a resize event in code, and the tiles didn't draw.
I've tried placing the map in a fixed-size div, inside the pane, and the map drew to the edges, and then the div sat inside the pane with scrollbars, which confirms, to me, that I'm dealing with a sizing issue, but I can't have the scrollbars, so
I've tried setting the width and height of the div to the size of the pane, in code, and that didn't trigger the map to draw the missing panes.
I'm running out of ideas.
Is there some event or function on the MapBox renderer that will cause it to redraw the way it does when the browser resizes?

Turns out the answer was pretty simple:
map.invalidateSize();
Edited - a few days layer
Turns out that only works in IE. In Chrome, invalidateSize() doesn't cause the map to properly resize itself.

so the map is being drawn in a pseudo-frame, which is probably throwing off the calculations for what's "visible"...
do you have a way of sharing the actual output HTML? like jsfiddle?
are there any console errors? maybe it's something as simple as you've met your quota for the map tile server...
try a different tile server?

Google Maps: Custom Tiles being pushed up

I'm working on creating custom map tiles (.PNG) which I can show with ImageMapType from the Google Maps API range. In general, the tiles are shown fine and I get the tiles I want with no real problems.
However, an issue which I can not seem to solve at all, is a weird upwards push of the tiles at a single specific zoom level (9). My original tiles do have many gaps for the ocean in them, so I generate blank tiles to fill in the gaps by surrounding my original map tiles with transparent points in a grid.
For testing purposes, and to show you the exact issue, i've made the grid points visible, and quickly taken a snapshot of the upwards push during the transition phase. The top left of the dark region is where the corner was for the previous layer, and after zooming in, the top marked section is where the corner moved it.
After I go past this layer, into layer 10, the corner goes back down a level, to where it would have been if layer 9 wasnt so buggy.
Hope I've provided enough information and I'll be grateful of any advice.

For zoom problem keep one transparent div with z-index and then set map zoom on 9 also hide its zoom control from map By this no one can zoom your map and for tile problem I need its demo page for more information but with this answer i attached a url for your help with full tutorial just check it : https://developers.google.com/maps/documentation/javascript/v2/overlays#Custom_Map_Types
Gud luck

OpenLayers, Bing, continuous map layer

I'm trying to get the Bing layer continuous in OpenLayers, but I cannot find any solution.
As we can see on example (http://openlayers.org/dev/examples/bing.html), when we scroll the map horizontally or vertically, layer is not continuous as the Google map is (http://openlayers.org/dev/examples/google.html). It's quite weird when we zoom out and the map doesn't fit into viewport leaving blank white background on the left and right side.
Any ideas?
Thank you.

This example shows how to achieve horizontal repeat:
http://openlayers.org/dev/examples/wrapDateLine.html
Not sure how to solve the white background when zoomed out, I do not think Openlayers supports this.

Loading google map polygon on IE slowly

everyone. Recently, we have faced one problem about the speed of loading google map components on different broswer. Regarding to the function , we have added 120 polygons, 360 sector ( also polygon ) and several attributes which attach to components on the map. The verson of JS tool is Google Map Javascript V3.
Now, this module is running fast and smoothly on Chrome and Foxfire broswer. HOWEVER, terreble problem would occur on IE8 or IE9. The process about loading informations into map becomes very slow, also during the period of dragging or zooming the map, which can not be accepted by users.
So, is there any solution about acceleration in this situation ?
Thank you very much for any reply !

In my experience it's just IE being IE.
I would suggest scaling down the number of polygons you need to show at one time by using the map bounds as the criteria to filter by. You'll still end up running into issues if you let the users zoom out to show the whole map so you may want to limit zoom levels as well.
If you take all the points that make up your polygon and push(extend) them to a LatLngBounds you can grab the bounding box and check to see if the center of that bounding box is in the map's current bounds.