微件:Map：修订间差异
跳转到导航
跳转到搜索
（创建页面，内容为“<noinclude> {{#widget:sandbox|map=701}} </noinclude><includeonly><canvas id="map-<!--{$map|escape:'quotes'}-->" width='1024' height='576' style='background-image:url...”） |
无编辑摘要 |
||
| （未显示同一用户的10个中间版本） | |||
| 第1行： | 第1行： | ||
<noinclude> | <noinclude> | ||
{{#widget: | {{#widget:map|map=701|size=396}} | ||
</noinclude><includeonly><canvas id="map-<!--{$map|escape:'quotes'}-->" width='1024' height='576' style='background-image:url(/wg_img/ccbResources/map/<!--{$map|escape:' | </noinclude><includeonly><canvas id="map-<!--{$map|escape:'quotes'}-->" width='1024' height='576' style="width:<!--{$size|escape:'quotes'}-->px;background-image:url(/wg_img/ccbResources/map/<!--{$map|escape:'quotes'}-->.jpg); background-position:center; background-size:<!--{$size|escape:'quotes'}-->px auto;"></canvas><script src='https://zjsnrwiki.github.io/data/pveData.js'></script><script>(function() { | ||
var mapId = "<!--{$map|escape:'quotes'}-->"; | var mapId = "<!--{$map|escape:'quotes'}-->"; | ||
var nodes = [ ] | var w = parseInt("<!--{$size|escape:'quotes'}-->"); | ||
var paths = [ ] | var h = w * 576 / 1024; | ||
var mapCanvas = document.getElementById('map-' + mapId); | |||
mapCanvas.style.height = h + 'px'; | |||
mapCanvas.style.width = w + 'px'; | |||
var nodes = [ ]; | |||
var paths = [ ]; | |||
for (var node of data_pveData['pveNode']) | for (var node of data_pveData['pveNode']) | ||
| 第51行： | 第57行： | ||
function drawNode(img) { | function drawNode(img) { | ||
var map = | var map = mapCanvas.getContext('2d'); | ||
for (var node of nodes) | for (var node of nodes) | ||
if (node.type == img._type) { | if (node.type == img._type) { | ||
| 第78行： | 第84行： | ||
ctx.putImageData(imgData, 0, 0); | ctx.putImageData(imgData, 0, 0); | ||
var map = | var map = mapCanvas.getContext('2d'); | ||
map.save(); | map.save(); | ||
var node1 = nodes[img._path.start]; | var node1 = nodes[img._path.start]; | ||
| 第99行： | 第105行： | ||
if (drawnNodeCnt < nodeImgs.length || drawnPathCnt < paths.length) return; | if (drawnNodeCnt < nodeImgs.length || drawnPathCnt < paths.length) return; | ||
var map = | var map = mapCanvas.getContext('2d'); | ||
map.font = 'bold | map.font = 'bold 2em "Noto Sans", sans-serif'; | ||
map.textAlign = 'center'; | map.textAlign = 'center'; | ||
map.fillStyle = 'white'; | map.fillStyle = 'white'; | ||
map.strokeStype = 'black'; | map.strokeStype = 'black'; | ||
map.lineWidth = | map.lineWidth = 5; | ||
var labels = '0ABCDEFGHIJKLMNOPQRSTUVWXYZ'; | var labels = '0ABCDEFGHIJKLMNOPQRSTUVWXYZ'; | ||
for (var i = 1; i < nodes.length; ++i) { | for (var i = 1; i < nodes.length; ++i) { | ||
var x = nodes[i].x * 384; | var x = nodes[i].x * 384; | ||
var y = 576 - nodes[i].y * 384 - (nodes[i].type == 2 ? | var y = 576 - nodes[i].y * 384 - (nodes[i].type == 2 ? 40 : 30); | ||
map.strokeText(labels[i], x, y); | map.strokeText(labels[i], x, y); | ||
map.fillText(labels[i], x, y); | map.fillText(labels[i], x, y); | ||
} | } | ||
} | } | ||
</script></includeonly> | }());</script></includeonly> | ||
2016年10月8日 (六) 00:37的最新版本