タイル描画　サンプルコード

オルソ画像　OpenLayers : 実行例
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="http://openlayers.org/api/OpenLayers.js"></script>
<script>
function init() {
  var options = {
      projection: new OpenLayers.Projection("EPSG:900913"),
      maxResolution:156543.0339,
      maxExtent: new OpenLayers.Bounds(-20037508.3427892,-20037508.3427892,20037508.3427892,20037508.3427892),
	  units: "m",
      controls: [
          new OpenLayers.Control.PanZoomBar(),
          new OpenLayers.Control.LayerSwitcher(),
          new OpenLayers.Control.Navigation(),
          new OpenLayers.Control.Attribution({displayClass: 'prmtcd'})
        ],
      numZoomLevels: 22
    }

  var map = new OpenLayers.Map('map',options);
  map.div.style.backgroundColor = 'rgb(221,238,255)';

  var tms = new OpenLayers.Layer.TMS(
      "室蘭-航空写真H25",
      "http://neogis.net/muroran/TILE/",
      {
        serviceVersion: '1.0.0',
        layername: "H25",
        type: "jpg",
        numZoomLevels: 22,
        isBaseLayer: true
      }
    );
  map.addLayer(tms);
  var lonlat = new OpenLayers.LonLat(15693230.659, 5208226.967);
  map.setCenter(lonlat, 15);
}

window.onload = init;

</script>
<style type="text/css">
#map {
  width: 500px;
  height: 400px;
  border: solid 1px #999;
}

.prmtcd {
  position: absolute;
  bottom: 2px;
  right: 2px;
  font-size: 9pt;
  padding: 2px;
}
</style>
</head>
<body onload="init()">

<div id="map" style="width: 500px; height: 400px; border: solid 1px #999;"></div>
<p><a href="http://www.neogis.co.jp/">NEO GIS</a></p>

</body>
</html>

都市計画図　OpenLayers : 実行例
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="http://openlayers.org/api/OpenLayers.js"></script>
<script>
function init() {
  var options = {
      projection: new OpenLayers.Projection("EPSG:900913"),
      maxResolution:156543.0339,
      maxExtent: new OpenLayers.Bounds(-20037508.3427892,-20037508.3427892,20037508.3427892,20037508.3427892),
	  units: "m",
      controls: [
          new OpenLayers.Control.PanZoomBar(),
          new OpenLayers.Control.LayerSwitcher(),
          new OpenLayers.Control.Navigation(),
          new OpenLayers.Control.Attribution({displayClass: 'prmtcd'})
        ],
      numZoomLevels: 22
    }

  var map = new OpenLayers.Map('map',options);
  map.div.style.backgroundColor = 'rgb(221,238,255)';

  var tms = new OpenLayers.Layer.XYZ(
      "室蘭-都市計画図H25",
      "http://neogis.net/muroran/TILE/1.0.0/H23_TOSHI/${z}/${x}/${y}.png",
      {
        numZoomLevels: 20
      }
    );
  map.addLayer(tms);
  var lonlat = new OpenLayers.LonLat(15693230.659, 5208226.967);
  map.setCenter(lonlat, 15);
}

window.onload = init;

</script>
<style type="text/css">
#map {
  width: 500px;
  height: 400px;
  border: solid 1px #999;
}

.prmtcd {
  position: absolute;
  bottom: 2px;
  right: 2px;
  font-size: 9pt;
  padding: 2px;
}
</style>
</head>
<body onload="init()">

<div id="map" style="width: 500px; height: 400px; border: solid 1px #999;"></div>
<p><a href="http://www.neogis.co.jp/">NEO GIS</a></p>

</body>
</html>