百度地图添加自定义图层

百度地图对自定义图层提到的很少，只说到图片的叠加。但是关于如何切片处理都没有提到。论坛中只放出来个图片的切片工具。但是GIS上对分层显示的需求导致这种方式并不适合。那就换个思路去处理，自己切出符合百度瓦片规则的切片。

一、先学习下以下网址，了解下切片原理及定义。

http://www.cnblogs.com/jz1108/archive/2011/07/02/2095376.html

http://blog.csdn.net/mygisforum/article/details/8162751

二、百度的官方sample

    var tileLayer = new BMap.TileLayer();
    tileLayer.getTilesUrl = function (tileCoord, zoom) {
        var x = tileCoord.x;
        var y = tileCoord.y;

       return "http://developer.baidu.com/map/jsdemo/img/border.png";
    }
    map.addTileLayer(tileLayer);

三、自定义图片请求地址

    var PointConvert = new BaiduPointConvert(map);//百度坐标转换类
    var lonlat_0 = PointConvert.tileToLngLat(tileCoord);//百度区块左下角经纬度
    var tileCoord2 = new Object();
    tileCoord2.x = x + 1;
    tileCoord2.y = y + 1;
    var lonlat2_0 = PointConvert.tileToLngLat(tileCoord2);//百度区块右下角经纬度
    var lonlat_1=BD2GCJ(lonlat_0.lng, lonlat_0.lat);//百度转gcj
    var lonlat2_1 = BD2GCJ(lonlat2_0.lng, lonlat2_0.lat);//百度转gcj
    var lonlat = GCJ2WGS(lonlat_1.lng, lonlat_1.lat);//gcj转wgs
    var lonlat2 = GCJ2WGS(lonlat2_1.lng, lonlat2_1.lat);//gcj转wgs
    var worldCoordinate14 = lonLat2Mercator(lonlat);//转平面坐标
    var worldCoordinate24 = lonLat2Mercator(lonlat2);//转平面坐标
    var url= "*/MapServer/export?bbox=" + worldCoordinate14.x+ "%2C" + worldCoordinate14.y + "%2C" 
    + worldCoordinate24.x + "%2C" + worldCoordinate24.y
    +"&bboxSR=102100&layers=&layerDefs=&size=256%2C256&imageSR=102100&format=png&transparent=true
   &dpi=&time=&layerTimeOptions=&dynamicLayers=&gdbVersion=&mapScale=&f=image";
    return url;//图片 通过arcgis server返回，后期可以把图片下载下来后就抛弃server，然后以瓦片x，y，z命名



 BaiduPointConvert类


var BaiduPointConvert=function(map){
    this.map=map;


    //图块坐标转为球面坐标
    this.tileToLngLat=function(pixel){
        return this.worldToLngLat(this.pixelToWorld(this.tileToPixel(pixel)));
    }
    //球面坐标转为图块坐标
    this.lngLatToTile=function(lngLat){
        return this.pixelToTile(this.worldToPixel(this.lngLatToWorld(lngLat)));
    }

    //像素坐标转为球面坐标
    this.pixelToLngLat=function(pixel){
        return this.worldToLngLat(this.pixelToWorld(pixel));
    }
    //球面坐标转为像素坐标
    this.lngLatToPixel=function(lngLat){
        return this.worldToPixel(this.lngLatToWorld(lngLat));
    }
    //图块坐标转为像素坐标
    this.tileToPixel=function(pixel){
        return new BMap.Pixel(pixel.x * 256,
            pixel.y * 256);
    }
    //像素坐标转为平面坐标
    this.pixelToWorld=function(pixel){
        var zoom=this.map.getZoom();
        return new BMap.Pixel(pixel.x / Math.pow(2, zoom- 18),
            pixel.y / Math.pow(2, zoom - 18));
    }
    //平面坐标转为球面坐标
    this.worldToLngLat=function(pixel){
        var projection = this.map.getMapType().getProjection();
        return projection.pointToLngLat(pixel)
    }

    //像素坐标转为图块坐标
    this.pixelToTile=function(pixel){
        return new BMap.Pixel(pixel.x / 256,
            pixel.y / 256);
    }
    //平面坐标转为像素坐标
    this.worldToPixel=function(pixel){
        var zoom=this.map.getZoom();
        return new BMap.Pixel(pixel.x * Math.pow(2, zoom - 18),
            pixel.y * Math.pow(2, zoom - 18));
    }
    //球面坐标转为平面坐标
    this.lngLatToWorld=function(lngLat){
        var projection = this.map.getMapType().getProjection();
        return projection.lngLatToPoint(lngLat)
    }


}






四、坐标转换参考

http://api.zdoz.net/
https://github.com/JackZhouCn/JZLocationConverter

http://252190122.blog.163.com/blog/static/43448176201282110363982/

https://on4wp7.codeplex.com/SourceControl/changeset/view/21483#353936



五、问题
这种方式可以将自定义矢量图层配色后切片方式叠加，但是有图片错层的问题，还需要改进图片请求过程。
不能将google这种已经切好的图片叠加在百度地图上。