cesiumでmapserverを使う。

概要

cesiumでmapserverを使ってみた。
mapserverは、山形県しかない。
タイルの指定が違うので、UrlTemplateImageryProviderでcustomTagsを使った。

写真

サンプルコード

function fromPointToLatLng(x, y, z) {
    var max_zoom = Math.pow(2, z);
    var size = (1 << max_zoom) * 256;
    var lx = (x * 256 + 128) / max_zoom;
    var ly = (y * 256 + 128) / max_zoom;
    var lat = (2 * Math.atan(Math.exp((ly - size / 2) / -(size / (2 * Math.PI)))) - (Math.PI / 2)) * (180 / Math.PI);
    var lng = (lx - size / 2) * (360 / size);
    return {lat, lng};
}
var widget = new Cesium.CesiumWidget('cesiumContainer', {
    imageryProvider: new Cesium.UrlTemplateImageryProvider({
        url: "http://yumeblog.dip.jp/yb2g0.php?zoom={z}&long={lon}&lat={lat}",
        customTags: {
            lat: function(imageryProvider, x, y, level) {
                var ll = fromPointToLatLng(x, y, level);
                return ll.lat;
            },
            lon: function(imageryProvider, x, y, level) {
                var ll = fromPointToLatLng(x, y, level);
                return ll.lng;
            }
        }
    })
});
widget.camera.flyTo({
    destination: Cesium.Cartesian3.fromDegrees(140.0 + 0.4, 38.0 - 0.1, 20000.0),
    orientation: {
        heading: Cesium.Math.toRadians(-10.0),
        pitch: Cesium.Math.toRadians(-15.0),
        roll: 0.0
    }
});

成果物

以上。