{"action":"created","comment":{"url":"https://api.github.com/repos/openlayers/ol3/pulls/comments/47828043","id":47828043,"diff_hunk":"@@ -113,35 +115,83 @@ ol.renderer.canvas.VectorTileLayer.prototype.composeFrame =\n   var tilesToDraw = this.renderedTiles_;\n   var tileGrid = source.getTileGrid();\n \n-  var currentZ, i, ii, origin, tile, tileSize;\n-  var tilePixelRatio, tilePixelResolution, tilePixelSize, tileResolution;\n+  var currentZ, height, i, ii, insertPoint, insertTransform, offsetX, offsetY;\n+  var origin, pixelScale, pixelSpace, replayState, scale, size, tile;\n+  var tileCenter, tileContext, tileExtent, tilePixelResolution, tilePixelSize;\n+  var tileResolution, tileSize, tileTransform, width;\n   for (i = 0, ii = tilesToDraw.length; i < ii; ++i) {\n     tile = tilesToDraw[i];\n+    replayState = tile.getReplayState();\n+    tileExtent = tileGrid.getTileCoordExtent(\n+        tile.getTileCoord(), this.tmpExtent_);\n     currentZ = tile.getTileCoord()[0];\n-    tileSize = tileGrid.getTileSize(currentZ);\n-    tilePixelSize = source.getTilePixelSize(currentZ, pixelRatio, projection);\n-    tilePixelRatio = tilePixelSize[0] /\n-        ol.size.toSize(tileSize, this.tmpSize_)[0];\n+    tileSize = ol.size.toSize(tileGrid.getTileSize(currentZ), this.tmpSize_);\n+    pixelSpace = tile.getProjection().getUnits() == ol.proj.Units.TILE_PIXELS;\n+    size = frameState.size;\n     tileResolution = tileGrid.getResolution(currentZ);\n-    tilePixelResolution = tileResolution / tilePixelRatio;\n-    if (tile.getProjection().getUnits() == ol.proj.Units.TILE_PIXELS) {\n-      origin = ol.extent.getTopLeft(tileGrid.getTileCoordExtent(\n-          tile.getTileCoord(), this.tmpExtent_));\n-      transform = ol.vec.Mat4.makeTransform2D(this.tmpTransform_,\n-          pixelRatio * frameState.size[0] / 2,\n-          pixelRatio * frameState.size[1] / 2,\n-          pixelRatio * tilePixelResolution / resolution,\n-          pixelRatio * tilePixelResolution / resolution,\n-          viewState.rotation,\n-          (origin[0] - center[0]) / tilePixelResolution,\n-          (center[1] - origin[1]) / tilePixelResolution);\n+    tilePixelResolution = tileResolution / source.getTilePixelRatio();\n+    pixelScale = pixelRatio / resolution;\n+    scale = tileResolution / resolution;\n+    offsetX = Math.round(pixelRatio * size[0] / 2);\n+    offsetY = Math.round(pixelRatio * size[1] / 2);\n+    if (ol.extent.getWidth(tileExtent) > ol.extent.getWidth(extent)) {\n+      if (pixelSpace) {\n+        origin = ol.extent.getTopLeft(tileExtent);\n+        tileTransform = ol.vec.Mat4.makeTransform2D(this.tmpTransform_,\n+            offsetX, offsetY,\n+            pixelScale * tilePixelResolution,","path":"src/ol/renderer/canvas/canvasvectortilelayerrenderer.js","position":62,"original_position":62,"commit_id":"1153e3f606520339813494df56de9f0830377ec1","original_commit_id":"1153e3f606520339813494df56de9f0830377ec1","user":{"login":"tsauerwein","id":266474,"avatar_url":"https://avatars.githubusercontent.com/u/266474?v=3","gravatar_id":"","url":"https://api.github.com/users/tsauerwein","html_url":"https://github.com/tsauerwein","followers_url":"https://api.github.com/users/tsauerwein/followers","following_url":"https://api.github.com/users/tsauerwein/following{/other_user}","gists_url":"https://api.github.com/users/tsauerwein/gists{/gist_id}","starred_url":"https://api.github.com/users/tsauerwein/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/tsauerwein/subscriptions","organizations_url":"https://api.github.com/users/tsauerwein/orgs","repos_url":"https://api.github.com/users/tsauerwein/repos","events_url":"https://api.github.com/users/tsauerwein/events{/privacy}","received_events_url":"https://api.github.com/users/tsauerwein/received_events","type":"User","site_admin":false},"body":"The pixel-ratio is not used in this transform ([it used to be](https://github.com/openlayers/ol3/blob/master/src/ol/renderer/canvas/canvasvectortilelayerrenderer.js#L131-L135)). Is that correct?","created_at":"2015-12-16T20:17:25Z","updated_at":"2015-12-16T20:17:25Z","html_url":"https://github.com/openlayers/ol3/pull/4557#discussion_r47828043","pull_request_url":"https://api.github.com/repos/openlayers/ol3/pulls/4557","_links":{"self":{"href":"https://api.github.com/repos/openlayers/ol3/pulls/comments/47828043"},"html":{"href":"https://github.com/openlayers/ol3/pull/4557#discussion_r47828043"},"pull_request":{"href":"https://api.github.com/repos/openlayers/ol3/pulls/4557"}}},"pull_request":{"url":"https://api.github.com/repos/openlayers/ol3/pulls/4557","id":53624354,"html_url":"https://github.com/openlayers/ol3/pull/4557","diff_url":"https://github.com/openlayers/ol3/pull/4557.diff","patch_url":"https://github.com/openlayers/ol3/pull/4557.patch","issue_url":"https://api.github.com/repos/openlayers/ol3/issues/4557","number":4557,"state":"open","locked":false,"title":"[WIP] Conditionally render tiles to a separate tile canvas","user":{"login":"ahocevar","id":211514,"avatar_url":"https://avatars.githubusercontent.com/u/211514?v=3","gravatar_id":"","url":"https://api.github.com/users/ahocevar","html_url":"https://github.com/ahocevar","followers_url":"https://api.github.com/users/ahocevar/followers","following_url":"https://api.github.com/users/ahocevar/following{/other_user}","gists_url":"https://api.github.com/users/ahocevar/gists{/gist_id}","starred_url":"https://api.github.com/users/ahocevar/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ahocevar/subscriptions","organizations_url":"https://api.github.com/users/ahocevar/orgs","repos_url":"https://api.github.com/users/ahocevar/repos","events_url":"https://api.github.com/users/ahocevar/events{/privacy}","received_events_url":"https://api.github.com/users/ahocevar/received_events","type":"User","site_admin":false},"body":"Because clip geometries are anti-aliased in most browsers, there will be tiny\r\ngaps between tiles. If tiles are rendered to a tile canvas which is then drawn\r\nto the map canvas upon composition, these gaps can be avoided. For rotated\r\nviews, it is stil necessary to clip the tile, but in this case a 1-pixel\r\nbuffer is used.\r\n\r\nThis change also brings a huge performance improvement for panning, because\r\nthe fully rendered tiles can be reused.\r\n\r\nBecause of the added cost of using drawImage in addition to replaying the tile\r\nreplay group, we fall back to directly drawing to the map canvas when the tile\r\ncanvas would be too large, or during interaction/animation when resolution or\r\nrotation change.\r\n\r\nFixes #4329.","created_at":"2015-12-14T21:28:32Z","updated_at":"2015-12-16T20:17:25Z","closed_at":null,"merged_at":null,"merge_commit_sha":"6bb70433b48fb052781a25671a4d4e571d889003","assignee":null,"milestone":null,"commits_url":"https://api.github.com/repos/openlayers/ol3/pulls/4557/commits","review_comments_url":"https://api.github.com/repos/openlayers/ol3/pulls/4557/comments","review_comment_url":"https://api.github.com/repos/openlayers/ol3/pulls/comments{/number}","comments_url":"https://api.github.com/repos/openlayers/ol3/issues/4557/comments","statuses_url":"https://api.github.com/repos/openlayers/ol3/statuses/1153e3f606520339813494df56de9f0830377ec1","head":{"label":"ahocevar:vectortile-canvas","ref":"vectortile-canvas","sha":"1153e3f606520339813494df56de9f0830377ec1","user":{"login":"ahocevar","id":211514,"avatar_url":"https://avatars.githubusercontent.com/u/211514?v=3","gravatar_id":"","url":"https://api.github.com/users/ahocevar","html_url":"https://github.com/ahocevar","followers_url":"https://api.github.com/users/ahocevar/followers","following_url":"https://api.github.com/users/ahocevar/following{/other_user}","gists_url":"https://api.github.com/users/ahocevar/gists{/gist_id}","starred_url":"https://api.github.com/users/ahocevar/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ahocevar/subscriptions","organizations_url":"https://api.github.com/users/ahocevar/orgs","repos_url":"https://api.github.com/users/ahocevar/repos","events_url":"https://api.github.com/users/ahocevar/events{/privacy}","received_events_url":"https://api.github.com/users/ahocevar/received_events","type":"User","site_admin":false},"repo":{"id":4974939,"name":"ol3","full_name":"ahocevar/ol3","owner":{"login":"ahocevar","id":211514,"avatar_url":"https://avatars.githubusercontent.com/u/211514?v=3","gravatar_id":"","url":"https://api.github.com/users/ahocevar","html_url":"https://github.com/ahocevar","followers_url":"https://api.github.com/users/ahocevar/followers","following_url":"https://api.github.com/users/ahocevar/following{/other_user}","gists_url":"https://api.github.com/users/ahocevar/gists{/gist_id}","starred_url":"https://api.github.com/users/ahocevar/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ahocevar/subscriptions","organizations_url":"https://api.github.com/users/ahocevar/orgs","repos_url":"https://api.github.com/users/ahocevar/repos","events_url":"https://api.github.com/users/ahocevar/events{/privacy}","received_events_url":"https://api.github.com/users/ahocevar/received_events","type":"User","site_admin":false},"private":false,"html_url":"https://github.com/ahocevar/ol3","description":"OpenLayers 3","fork":true,"url":"https://api.github.com/repos/ahocevar/ol3","forks_url":"https://api.github.com/repos/ahocevar/ol3/forks","keys_url":"https://api.github.com/repos/ahocevar/ol3/keys{/key_id}","collaborators_url":"https://api.github.com/repos/ahocevar/ol3/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/ahocevar/ol3/teams","hooks_url":"https://api.github.com/repos/ahocevar/ol3/hooks","issue_events_url":"https://api.github.com/repos/ahocevar/ol3/issues/events{/number}","events_url":"https://api.github.com/repos/ahocevar/ol3/events","assignees_url":"https://api.github.com/repos/ahocevar/ol3/assignees{/user}","branches_url":"https://api.github.com/repos/ahocevar/ol3/branches{/branch}","tags_url":"https://api.github.com/repos/ahocevar/ol3/tags","blobs_url":"https://api.github.com/repos/ahocevar/ol3/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/ahocevar/ol3/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/ahocevar/ol3/git/refs{/sha}","trees_url":"https://api.github.com/repos/ahocevar/ol3/git/trees{/sha}","statuses_url":"https://api.github.com/repos/ahocevar/ol3/statuses/{sha}","languages_url":"https://api.github.com/repos/ahocevar/ol3/languages","stargazers_url":"https://api.github.com/repos/ahocevar/ol3/stargazers","contributors_url":"https://api.github.com/repos/ahocevar/ol3/contributors","subscribers_url":"https://api.github.com/repos/ahocevar/ol3/subscribers","subscription_url":"https://api.github.com/repos/ahocevar/ol3/subscription","commits_url":"https://api.github.com/repos/ahocevar/ol3/commits{/sha}","git_commits_url":"https://api.github.com/repos/ahocevar/ol3/git/commits{/sha}","comments_url":"https://api.github.com/repos/ahocevar/ol3/comments{/number}","issue_comment_url":"https://api.github.com/repos/ahocevar/ol3/issues/comments{/number}","contents_url":"https://api.github.com/repos/ahocevar/ol3/contents/{+path}","compare_url":"https://api.github.com/repos/ahocevar/ol3/compare/{base}...{head}","merges_url":"https://api.github.com/repos/ahocevar/ol3/merges","archive_url":"https://api.github.com/repos/ahocevar/ol3/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/ahocevar/ol3/downloads","issues_url":"https://api.github.com/repos/ahocevar/ol3/issues{/number}","pulls_url":"https://api.github.com/repos/ahocevar/ol3/pulls{/number}","milestones_url":"https://api.github.com/repos/ahocevar/ol3/milestones{/number}","notifications_url":"https://api.github.com/repos/ahocevar/ol3/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/ahocevar/ol3/labels{/name}","releases_url":"https://api.github.com/repos/ahocevar/ol3/releases{/id}","created_at":"2012-07-10T14:11:39Z","updated_at":"2015-04-21T14:20:28Z","pushed_at":"2015-12-16T19:03:37Z","git_url":"git://github.com/ahocevar/ol3.git","ssh_url":"git@github.com:ahocevar/ol3.git","clone_url":"https://github.com/ahocevar/ol3.git","svn_url":"https://github.com/ahocevar/ol3","homepage":null,"size":58482,"stargazers_count":1,"watchers_count":1,"language":"JavaScript","has_issues":false,"has_downloads":true,"has_wiki":true,"has_pages":true,"forks_count":0,"mirror_url":null,"open_issues_count":0,"forks":0,"open_issues":0,"watchers":1,"default_branch":"dist-css"}},"base":{"label":"openlayers:master","ref":"master","sha":"6bc6fd9cbc4f2ff8b64ede3027552c3fd19c1270","user":{"login":"openlayers","id":240579,"avatar_url":"https://avatars.githubusercontent.com/u/240579?v=3","gravatar_id":"","url":"https://api.github.com/users/openlayers","html_url":"https://github.com/openlayers","followers_url":"https://api.github.com/users/openlayers/followers","following_url":"https://api.github.com/users/openlayers/following{/other_user}","gists_url":"https://api.github.com/users/openlayers/gists{/gist_id}","starred_url":"https://api.github.com/users/openlayers/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/openlayers/subscriptions","organizations_url":"https://api.github.com/users/openlayers/orgs","repos_url":"https://api.github.com/users/openlayers/repos","events_url":"https://api.github.com/users/openlayers/events{/privacy}","received_events_url":"https://api.github.com/users/openlayers/received_events","type":"Organization","site_admin":false},"repo":{"id":4723248,"name":"ol3","full_name":"openlayers/ol3","owner":{"login":"openlayers","id":240579,"avatar_url":"https://avatars.githubusercontent.com/u/240579?v=3","gravatar_id":"","url":"https://api.github.com/users/openlayers","html_url":"https://github.com/openlayers","followers_url":"https://api.github.com/users/openlayers/followers","following_url":"https://api.github.com/users/openlayers/following{/other_user}","gists_url":"https://api.github.com/users/openlayers/gists{/gist_id}","starred_url":"https://api.github.com/users/openlayers/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/openlayers/subscriptions","organizations_url":"https://api.github.com/users/openlayers/orgs","repos_url":"https://api.github.com/users/openlayers/repos","events_url":"https://api.github.com/users/openlayers/events{/privacy}","received_events_url":"https://api.github.com/users/openlayers/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/openlayers/ol3","description":"OpenLayers 3","fork":false,"url":"https://api.github.com/repos/openlayers/ol3","forks_url":"https://api.github.com/repos/openlayers/ol3/forks","keys_url":"https://api.github.com/repos/openlayers/ol3/keys{/key_id}","collaborators_url":"https://api.github.com/repos/openlayers/ol3/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/openlayers/ol3/teams","hooks_url":"https://api.github.com/repos/openlayers/ol3/hooks","issue_events_url":"https://api.github.com/repos/openlayers/ol3/issues/events{/number}","events_url":"https://api.github.com/repos/openlayers/ol3/events","assignees_url":"https://api.github.com/repos/openlayers/ol3/assignees{/user}","branches_url":"https://api.github.com/repos/openlayers/ol3/branches{/branch}","tags_url":"https://api.github.com/repos/openlayers/ol3/tags","blobs_url":"https://api.github.com/repos/openlayers/ol3/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/openlayers/ol3/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/openlayers/ol3/git/refs{/sha}","trees_url":"https://api.github.com/repos/openlayers/ol3/git/trees{/sha}","statuses_url":"https://api.github.com/repos/openlayers/ol3/statuses/{sha}","languages_url":"https://api.github.com/repos/openlayers/ol3/languages","stargazers_url":"https://api.github.com/repos/openlayers/ol3/stargazers","contributors_url":"https://api.github.com/repos/openlayers/ol3/contributors","subscribers_url":"https://api.github.com/repos/openlayers/ol3/subscribers","subscription_url":"https://api.github.com/repos/openlayers/ol3/subscription","commits_url":"https://api.github.com/repos/openlayers/ol3/commits{/sha}","git_commits_url":"https://api.github.com/repos/openlayers/ol3/git/commits{/sha}","comments_url":"https://api.github.com/repos/openlayers/ol3/comments{/number}","issue_comment_url":"https://api.github.com/repos/openlayers/ol3/issues/comments{/number}","contents_url":"https://api.github.com/repos/openlayers/ol3/contents/{+path}","compare_url":"https://api.github.com/repos/openlayers/ol3/compare/{base}...{head}","merges_url":"https://api.github.com/repos/openlayers/ol3/merges","archive_url":"https://api.github.com/repos/openlayers/ol3/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/openlayers/ol3/downloads","issues_url":"https://api.github.com/repos/openlayers/ol3/issues{/number}","pulls_url":"https://api.github.com/repos/openlayers/ol3/pulls{/number}","milestones_url":"https://api.github.com/repos/openlayers/ol3/milestones{/number}","notifications_url":"https://api.github.com/repos/openlayers/ol3/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/openlayers/ol3/labels{/name}","releases_url":"https://api.github.com/repos/openlayers/ol3/releases{/id}","created_at":"2012-06-20T06:53:59Z","updated_at":"2015-12-15T17:08:48Z","pushed_at":"2015-12-16T19:03:38Z","git_url":"git://github.com/openlayers/ol3.git","ssh_url":"git@github.com:openlayers/ol3.git","clone_url":"https://github.com/openlayers/ol3.git","svn_url":"https://github.com/openlayers/ol3","homepage":"http://openlayers.org","size":95972,"stargazers_count":1543,"watchers_count":1543,"language":"JavaScript","has_issues":true,"has_downloads":true,"has_wiki":true,"has_pages":true,"forks_count":864,"mirror_url":null,"open_issues_count":388,"forks":864,"open_issues":388,"watchers":1543,"default_branch":"master"}},"_links":{"self":{"href":"https://api.github.com/repos/openlayers/ol3/pulls/4557"},"html":{"href":"https://github.com/openlayers/ol3/pull/4557"},"issue":{"href":"https://api.github.com/repos/openlayers/ol3/issues/4557"},"comments":{"href":"https://api.github.com/repos/openlayers/ol3/issues/4557/comments"},"review_comments":{"href":"https://api.github.com/repos/openlayers/ol3/pulls/4557/comments"},"review_comment":{"href":"https://api.github.com/repos/openlayers/ol3/pulls/comments{/number}"},"commits":{"href":"https://api.github.com/repos/openlayers/ol3/pulls/4557/commits"},"statuses":{"href":"https://api.github.com/repos/openlayers/ol3/statuses/1153e3f606520339813494df56de9f0830377ec1"}}}}