var polygonStrokeWidth = 10;

var lineStrokeWidth = 1;

​

var imageSize = 1000;

​

var scale = imageSize / 2 - polygonStrokeWidth - 2;

var center = imageSize / 2;

​

​

var polygonStyle = "";

polygonStyle += "fill:none;";

polygonStyle += "stroke:black;";

polygonStyle += "stroke-width:" + polygonStrokeWidth  + ";";

​

var pts = [0,1,2,3,4].map(function(_, i) {

  var t = (i/5 + 1/20) * Math.PI * 2;

  return [

    Math.floor(center + scale * Math.cos(t)),

    Math.floor(center + scale * Math.sin(-t)),

  ];

});

​

var pts_str = pts.map(function(pt) {

  return pt.join(',');

}).join(' ');

​

var svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");

var SVG = svg.namespaceURI;

svg.setAttribute('width', imageSize);

svg.setAttribute('height', imageSize);

document.body.appendChild(svg);

​

var polygon = document.createElementNS(SVG, 'polygon');

polygon.setAttribute('points', pts_str);

polygon.setAttribute('style', polygonStyle);

svg.appendChild(polygon);

​

var lines = pts.map(function(pt) {

  var line = document.createElementNS(SVG, "line");

  line.setAttribute('x1', center);

  line.setAttribute('y1', center);

  line.setAttribute('x2', pt[0]);

  line.setAttribute('y2', pt[1]);

  line.setAttribute('style', "stroke:black; stroke-width:" + lineStrokeWidth);

  svg.appendChild(line);

});

​