javascript action works on cshtml but does not work in external javascript file

I'm trying to move my script from the cshtml to exteral javascript file. All the script runs perfecrtly except from one function: $.post('@Url.Action("GetPoint", "Main")').done(function (xml)... the error i get on the browser debuger is: "jquery.min.js:2 POST http://localhost:58153/@Url.Action(%22GetPoint%22,%20%22Main%22) 404 (Not Found)" How can i make this function work??

var script = document.createElement('script');
script.src = "https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js";
script.type = 'text/javascript';
document.getElementsByTagName('head')[0].appendChild(script);

var createPoint = function(ctx, lat, lon) {
  ctx.beginPath();
  ctx.arc(lat, lon, 8, 0, Math.PI * 2);
  ctx.fillStyle = "red";
  ctx.strokeStyle = "black";
  ctx.lineWidth = 3;
  ctx.fill();
  ctx.stroke();
  ctx.closePath();
}

var ctx = document.getElementById("myCanvas").getContext('2d');
ctx.canvas.width = window.innerWidth;
ctx.canvas.height = window.innerHeight;

if ("true" === isFirstMission) {
  // ...
} else {
  myTimer = (function(ctx) {

    $.post('@Url.Action("GetPoint", "Main")').done(function(xml) { // This function does not work..
      alert(xml);
      var xmlDoc = $.parseXML(xml);
      $xml = $(xmlDoc);
      var lat = (parseFloat($xml.find("lat").text()) + 90)(screen.height / 180);
      var lon = (parseFloat($xml.find("lon").text()) + 180) * (screen.height / 360);
      alert(lat);
      alert(lon);

      createPoint(ctx, lat, lon);
    });
  });

  setInterval(function() {
    myTimer(ctx);
  }, 1000);
}