Deff,
Ничего вычислять не надо, все координаты и так есть в ареа, мы просто забираем их в текстовый массив, делим сплитом на цифровые переменные (я назвал этот массив coords).
Если канвас совпадает по размеру с картой, то никаких проблем, координаты арии и будут координатами канваса.
function draw(canvas, coords, lineColor, fullColor) {
ctx = canvas.getContext("2d");
ctx.strokeStyle = lineColor;
ctx.fillStyle = fullColor;
ctx.lineWidth = 1;
ctx.beginPath();
ctx.moveTo(coords[0], coords[1]);
for (var i = 2; i < coords.length; i = i + 2) {
ctx.lineTo(coords[i], coords[i + 1]);
}
ctx.stroke();
if (fullColor != null) {
ctx.fill();
}
ctx.closePath();
}
Просто и функционально) (Делал
интерактивную карту России)