Rotate marker along a line inside polygon - maps












0















I am working with polygons(could be irregular) in maps. I need to show a label at the center of the polygon. I am using a marker for label and I have figured out a center.



The problem is I need to rotate the label as well so that the label is inside the polygon, as much as possible. I need to align it on a line, so I thought to find the slope of the line and rotate the label along the tan inverse of slope. Below is a part of code that I have tried.




//(startLat, startLon) and (endLat, endLon)
var dy= (endLon - startLon);
var dx= (endLat - startLat);
var angle = Math.Atan(dy/ dx);



It is slope of a line formula.



But this is not fetching the correct result. The angle seems incorrect. When I rotate the label along this angle, it seems too much rotation. I don't understand where I am going wrong. Is it wrong because I am trying to find slope of a line but actually its an arc? But I think since its a small arc on a large sphere, it could be treated as a line.



Can anybody point out where I am going wrong and how I can achieve this?



Current Label position



enter image description here



Required Label position



enter image description here










share|improve this question





























    0















    I am working with polygons(could be irregular) in maps. I need to show a label at the center of the polygon. I am using a marker for label and I have figured out a center.



    The problem is I need to rotate the label as well so that the label is inside the polygon, as much as possible. I need to align it on a line, so I thought to find the slope of the line and rotate the label along the tan inverse of slope. Below is a part of code that I have tried.




    //(startLat, startLon) and (endLat, endLon)
    var dy= (endLon - startLon);
    var dx= (endLat - startLat);
    var angle = Math.Atan(dy/ dx);



    It is slope of a line formula.



    But this is not fetching the correct result. The angle seems incorrect. When I rotate the label along this angle, it seems too much rotation. I don't understand where I am going wrong. Is it wrong because I am trying to find slope of a line but actually its an arc? But I think since its a small arc on a large sphere, it could be treated as a line.



    Can anybody point out where I am going wrong and how I can achieve this?



    Current Label position



    enter image description here



    Required Label position



    enter image description here










    share|improve this question



























      0












      0








      0








      I am working with polygons(could be irregular) in maps. I need to show a label at the center of the polygon. I am using a marker for label and I have figured out a center.



      The problem is I need to rotate the label as well so that the label is inside the polygon, as much as possible. I need to align it on a line, so I thought to find the slope of the line and rotate the label along the tan inverse of slope. Below is a part of code that I have tried.




      //(startLat, startLon) and (endLat, endLon)
      var dy= (endLon - startLon);
      var dx= (endLat - startLat);
      var angle = Math.Atan(dy/ dx);



      It is slope of a line formula.



      But this is not fetching the correct result. The angle seems incorrect. When I rotate the label along this angle, it seems too much rotation. I don't understand where I am going wrong. Is it wrong because I am trying to find slope of a line but actually its an arc? But I think since its a small arc on a large sphere, it could be treated as a line.



      Can anybody point out where I am going wrong and how I can achieve this?



      Current Label position



      enter image description here



      Required Label position



      enter image description here










      share|improve this question
















      I am working with polygons(could be irregular) in maps. I need to show a label at the center of the polygon. I am using a marker for label and I have figured out a center.



      The problem is I need to rotate the label as well so that the label is inside the polygon, as much as possible. I need to align it on a line, so I thought to find the slope of the line and rotate the label along the tan inverse of slope. Below is a part of code that I have tried.




      //(startLat, startLon) and (endLat, endLon)
      var dy= (endLon - startLon);
      var dx= (endLat - startLat);
      var angle = Math.Atan(dy/ dx);



      It is slope of a line formula.



      But this is not fetching the correct result. The angle seems incorrect. When I rotate the label along this angle, it seems too much rotation. I don't understand where I am going wrong. Is it wrong because I am trying to find slope of a line but actually its an arc? But I think since its a small arc on a large sphere, it could be treated as a line.



      Can anybody point out where I am going wrong and how I can achieve this?



      Current Label position



      enter image description here



      Required Label position



      enter image description here







      maps markers






      share|improve this question















      share|improve this question













      share|improve this question




      share|improve this question








      edited Jan 1 at 9:02







      itzcutiesush

















      asked Dec 19 '18 at 14:53









      itzcutiesushitzcutiesush

      3918




      3918
























          0






          active

          oldest

          votes











          Your Answer






          StackExchange.ifUsing("editor", function () {
          StackExchange.using("externalEditor", function () {
          StackExchange.using("snippets", function () {
          StackExchange.snippets.init();
          });
          });
          }, "code-snippets");

          StackExchange.ready(function() {
          var channelOptions = {
          tags: "".split(" "),
          id: "1"
          };
          initTagRenderer("".split(" "), "".split(" "), channelOptions);

          StackExchange.using("externalEditor", function() {
          // Have to fire editor after snippets, if snippets enabled
          if (StackExchange.settings.snippets.snippetsEnabled) {
          StackExchange.using("snippets", function() {
          createEditor();
          });
          }
          else {
          createEditor();
          }
          });

          function createEditor() {
          StackExchange.prepareEditor({
          heartbeatType: 'answer',
          autoActivateHeartbeat: false,
          convertImagesToLinks: true,
          noModals: true,
          showLowRepImageUploadWarning: true,
          reputationToPostImages: 10,
          bindNavPrevention: true,
          postfix: "",
          imageUploader: {
          brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
          contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
          allowUrls: true
          },
          onDemand: true,
          discardSelector: ".discard-answer"
          ,immediatelyShowMarkdownHelp:true
          });


          }
          });














          draft saved

          draft discarded


















          StackExchange.ready(
          function () {
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53853763%2frotate-marker-along-a-line-inside-polygon-maps%23new-answer', 'question_page');
          }
          );

          Post as a guest















          Required, but never shown

























          0






          active

          oldest

          votes








          0






          active

          oldest

          votes









          active

          oldest

          votes






          active

          oldest

          votes
















          draft saved

          draft discarded




















































          Thanks for contributing an answer to Stack Overflow!


          • Please be sure to answer the question. Provide details and share your research!

          But avoid



          • Asking for help, clarification, or responding to other answers.

          • Making statements based on opinion; back them up with references or personal experience.


          To learn more, see our tips on writing great answers.




          draft saved


          draft discarded














          StackExchange.ready(
          function () {
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53853763%2frotate-marker-along-a-line-inside-polygon-maps%23new-answer', 'question_page');
          }
          );

          Post as a guest















          Required, but never shown





















































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown

































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown







          Popular posts from this blog

          Angular Downloading a file using contenturl with Basic Authentication

          Olmecas

          Can't read property showImagePicker of undefined in react native iOS