mapbox.js icon indicating copy to clipboard operation
mapbox.js copied to clipboard

L.tileLayer.canvas is not a function

Open linghuam opened this issue 8 years ago • 3 comments

I copy the example code ,and run it myself,but the browser throw the error message 'Uncaught TypeError: L.tileLayer.canvas is not a function'.I don't know why?

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Create layers using HTML5 canvas</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<script src='https://api.mapbox.com/mapbox.js/v3.1.1/mapbox.js'></script>
<link href='https://api.mapbox.com/mapbox.js/v3.1.1/mapbox.css' rel='stylesheet' />
<style>
  body { margin:0; padding:0; }
  #map { position:absolute; top:0; bottom:0; width:100%; }
</style>
</head>
<body>


<div id='map'></div>
<script>
L.mapbox.accessToken = 'pk.eyJ1IjoibGluZ2h1YW0iLCJhIjoiY2o1dWYzYzlqMDQ4OTJxbzRiZWl5OHdtcyJ9._Ae66CF7CGUIoJlVdrXjqA';
var map = L.mapbox.map('map', 'mapbox.streets')
    .setView([42.3619, -71.0606], 15);

// Since it's using the HTML5 Canvas API, it is not
// compatible with IE8 and below. See full documentation:
// https://www.mapbox.com/mapbox.js/api/v3.1.1/l-tilelayer-canvas/
var canvasTiles = L.tileLayer.canvas();

canvasTiles.drawTile = function(canvas, tilePoint, zoom) {
	var ctx = canvas.getContext('2d');
      ctx.fillText(tilePoint.toString(), 50, 50);
      ctx.globalAlpha = 0.2;
      ctx.fillStyle = '#000';
      ctx.fillRect(10, 10, 246, 246);
};

canvasTiles.addTo(map);
</script>


</body>
</html>

linghuam avatar Aug 02 '17 07:08 linghuam

why L.tileLayer.canvas(); ?

L.canvas(), !

2017-08-02

发件人:linghuam [email protected] 发送时间:2017-08-02 15:35 主题:[mapbox/mapbox.js] L.tileLayer.canvas is not a function (#1237) 收件人:"mapbox/mapbox.js"[email protected] 抄送:"Subscribed"[email protected]

I copy the example code ,and run it myself,but the browser throw the error message 'Uncaught TypeError: L.tileLayer.canvas is not a function'.I don't know why?

Create layers using HTML5 canvas

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub, or mute the thread.

coffee-gh avatar Aug 02 '17 12:08 coffee-gh

it looks like this was removed in version 3, but they haven't updated the docs. try with version 2.

    <script src='https://api.mapbox.com/mapbox.js/v2.4.0/mapbox.js'></script>
    <link href='https://api.mapbox.com/mapbox.js/v2.4.0/mapbox.css' rel='stylesheet' />

gouldingken avatar Apr 11 '18 00:04 gouldingken

Any more information on this?

itsmebigal avatar Aug 13 '18 11:08 itsmebigal