isometric black hole

for engraving on cnc

by tom burns

HTML

<script src="https://s3-eu-west-1.amazonaws.com/svgjs/svg.draggable.js"></script>
<script src="https://s3-eu-west-1.amazonaws.com/svgjs/svg.clock.js"></script>
<script src="https://s3-eu-west-1.amazonaws.com/svgjs/svg.import.js"></script>
<script src="https://s3-eu-west-1.amazonaws.com/svgjs/svg.filter.js"></script>
<script src="https://s3-eu-west-1.amazonaws.com/svgjs/svg.export.js"></script>
<script src="https://s3-eu-west-1.amazonaws.com/svgjs/svg.easing.js"></script>
<script src="https://s3-eu-west-1.amazonaws.com/svgjs/svg.shapes.js"></script>
<script src="https://s3-eu-west-1.amazonaws.com/svgjs/svg.topath.js"></script>
<script src="https://s3-eu-west-1.amazonaws.com/svgjs/svg.parser.js"></script>
<div id="container">
<div id="drawing"
  style="width:600px; height: 600px; backgroundColor:white"
></div>
</div>

CSS

html, body, #drawing {
    margin: 0;
}

#container {
  backgroundColor: black;
  width: 600px;
  height: 600px;
  border: 1;
}

JavaScript

// ISOMETRIC



/* create an svg drawing */
var draw = SVG('drawing')

var points=[]
var parts = 20
var height = 300
var width = 400
var yscale = 30

for (var x = 0; x < parts; x++) {
  points.push([])
  for (var z = 0; z < parts; z++) {
    var tx = x- (parts/2)
    var tz = z- (parts/2)
    points[x].push(1 / (Math.sqrt(tx*tx + tz*tz)/10))
  }
}
draw.rect(1000,1000)

function finalX(x, z) {
  var fX = (width/2) - (((width/2)/parts)*x);
  fX += (((width/2)/parts) * z);
  if (fX > 1000) {
  return 1000
  } else if (fX < 0) {
  return 0
  }
  return fX
}

function finalY(x, z) {
  var fY = (height) - ((height/2)/parts)*(x+z) + (yscale * points[x][z])
    if (fY > 1000) {
  return 1000
  } else if (fY < 0) {
  return 0
  }
    return fY
}

var lines = [];

for (var x = 0; x < parts; x++) {
  var line = [];
  for (var z = 0; z < parts; z++) {
    line.push([finalX(x, z), finalY(x, z)])
  }
  lines.push(line);
}



for (var i = 0; i < lines.length; i++) {
  draw.polyline(lines[i]).fill('none').stroke({ width: 1, color: 'white' })
}