ctyo/sample.html

## sample.html
<html>
<meta charset="utf-8">
<title>赤色立体地図 on Yahoo! JavaScriptマップAPI</title>
<body>
<div id="map" style="width:500px; height:500px"></div>

<script type="text/javascript" charset="utf-8" src="https://map.yahooapis.jp/js/V1/jsapi?appid=【アプリケーションID】"></script>

<script type="text/javascript">
var map = new Y.Map("map");
map.addControl(new Y.SliderZoomControlHorizontal());
map.drawMap(new Y.LatLng(35.85117778593573,139.31879821464227), 14, Y.LayerSetId.NORMAL);

// クレジット表示用のコントロールを定義
var LabelControl = function(labelHtml) {
    this.labelHtml = labelHtml;
};
LabelControl.prototype = new Y.Control();
LabelControl.prototype.getDefaultPosition = function() {
    return new Y.ControlPosition(Y.ControlPosition.BOTTOM_LEFT, new Y.Size(0, 0));
};
LabelControl.prototype.initialize = function(map) {
    var e = document.createElement('div');
    e.innerHTML = this.labelHtml;
    e.style.fontWeight = 'bold';
    e.style.fontSize = '11px';
    e.style.fontFamily = 'Arial';
    e.style.textAlign = 'left';
    e.style.padding = '0px';
    e.style.margin = '0 0 0 160px';
    e.style.color = 'black';
    return e;
};

// クレジットを追加
var creditSekishokuMap = new LabelControl('赤色立体地図 ©アジア航測株式会社');
map.addControl(creditSekishokuMap);


// 赤色立体地図レイヤーを定義
var layer = new Y.ImageTileLayer();

// YOLP地図向けに座標を変換
layer.getImageSrc = function(x, y, z) {
    function calc(x, y, z) {
        t = {};
        t.x = x;
        t.z = z - 1;
        t.y = Math.floor((y + 0.5) * -1 + Math.pow(2, t.z) / 2);
        return t;
    }
    var t = calc(x, y, z);
    return './5339_xyz/' + t.z + '/' + t.x + '/' + t.y + '.png';
}

// 透過を設定
layer.setOpacity(0.8);

// レイヤーを追加
map.addLayer(layer);
</script>
</body>
</html>
	<html>
	<meta charset="utf-8">
	<title>赤色立体地図 on Yahoo! JavaScriptマップAPI</title>
	<body>
	<div id="map" style="width:500px; height:500px"></div>

	<script type="text/javascript" charset="utf-8" src="https://map.yahooapis.jp/js/V1/jsapi?appid=【アプリケーションID】"></script>

	<script type="text/javascript">
	var map = new Y.Map("map");
	map.addControl(new Y.SliderZoomControlHorizontal());
	map.drawMap(new Y.LatLng(35.85117778593573,139.31879821464227), 14, Y.LayerSetId.NORMAL);

	// クレジット表示用のコントロールを定義
	var LabelControl = function(labelHtml) {
	this.labelHtml = labelHtml;
	};
	LabelControl.prototype = new Y.Control();
	LabelControl.prototype.getDefaultPosition = function() {
	return new Y.ControlPosition(Y.ControlPosition.BOTTOM_LEFT, new Y.Size(0, 0));
	};
	LabelControl.prototype.initialize = function(map) {
	var e = document.createElement('div');
	e.innerHTML = this.labelHtml;
	e.style.fontWeight = 'bold';
	e.style.fontSize = '11px';
	e.style.fontFamily = 'Arial';
	e.style.textAlign = 'left';
	e.style.padding = '0px';
	e.style.margin = '0 0 0 160px';
	e.style.color = 'black';
	return e;
	};

	// クレジットを追加
	var creditSekishokuMap = new LabelControl('赤色立体地図 ©アジア航測株式会社');
	map.addControl(creditSekishokuMap);



	// 赤色立体地図レイヤーを定義
	var layer = new Y.ImageTileLayer();

	// YOLP地図向けに座標を変換
	layer.getImageSrc = function(x, y, z) {
	function calc(x, y, z) {
	t = {};
	t.x = x;
	t.z = z - 1;
	t.y = Math.floor((y + 0.5) * -1 + Math.pow(2, t.z) / 2);
	return t;
	}
	var t = calc(x, y, z);
	return './5339_xyz/' + t.z + '/' + t.x + '/' + t.y + '.png';
	}

	// 透過を設定
	layer.setOpacity(0.8);

	// レイヤーを追加
	map.addLayer(layer);
	</script>
	</body>
	</html>