如何使用Open Layers方法来绘制canvas元素?

时间:2014-12-06 17:45:34

标签: javascript canvas zoom openlayers pan

有没有办法将平移和缩放的OL方法导入到html5的canvas元素?我正在使用此代码将图像加载到canvas元素中。

<html>

<head>
   <style>
     body{
      background: #333333;
      }
     canvas{
      border:1px solid yellow;
      background: #999999;
      width:1000;
      height:500;
      margin-top:20%;
     }
   </style>
    <script src="http://www.openlayers.org/api/OpenLayers.js"></script>
</head>
<body>

<center>
<canvas id="myCanvas"></canvas>
</center>

<img id="Map" src="http://upload.wikimedia.org/wikipedia/commons/a/a8/VST_images_the_Lagoon_Nebula.jpg"  width="10" height="10" style="display:none;" >

<script>
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
var img = document.getElementById("Map");
ctx.drawImage(img, 0, 0,300,150);
</script>

</body>
</html>

有没有办法可以使用开放图层的平移和缩放方法来缩放和平移画布元素中的图像?

0 个答案:

没有答案