convex-hull icon indicating copy to clipboard operation
convex-hull copied to clipboard

Unexpected results when a single point [100,15] is added to the example.

Open ms440 opened this issue 5 years ago • 0 comments

Hi Mikola, Here is the code that is failing the test:

<div>
  <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
    id='test'
    style="background-color: #bff;"
    width="800" height="500"
    viewBox="-15 -15 130 130">
    <g fill="none" stroke="black">
      <circle cx="0"   cy="0" r="2" fill="red"/>
      <circle cx="15"  cy="15" r="2" fill="red"/>

      <!-- Without the following two lines, it's an example
      from https://github.com/mikolalysenko/convex-hull
      -->
      <!-- <circle cx="100"  cy="15" r="2" fill="red"/>
      <text x="100" y="15" text-anchor="start">100,15</text> -->
      <!-- Uncomment two lines above to see something strange. -->

      <circle cx="100" cy="0" r="2" fill="red"/>
      <circle cx="50"  cy="50" r="2" fill="red"/>
      <circle cx="0"   cy="100" r="2" fill="red"/>

      <text x="5"   y="0"   transform="translate(1,-4)" text-anchor="start">0,0</text>
      <text x="20"  y="15"                              text-anchor="start">15,15</text>
      <text x="105" y="0"   transform="translate(1,-4)" text-anchor="start">100,0</text>
      <text x="55"  y="50"                              text-anchor="start">50,50</text>
      <text x="5"   y="100"                             text-anchor="start">0,100</text>
    </g>
  </svg>
</div>
<script src='/node_modules/convex-hull/bundle.js'></script>
<script>
  const testPoints = [];
  const testSvgElement = document.getElementById('test');
  const svgPoints = testSvgElement.querySelectorAll('circle');
  svgPoints.forEach(c => {
    testPoints.push([+c.getAttribute('cx'), +c.getAttribute('cy')])
  });

  const chIdxes = chModule(testPoints);
  const chResults = chIdxes.map(b => [testPoints[b[0]][0],testPoints[b[1]][1]]);

  const pathEle = document.createElementNS('http://www.w3.org/2000/svg','polygon');
  pathEle.setAttribute('style', 'fill: none; stroke: magenta;stroke-width: 2');
  const polySegs = chResults.map(r => `${r[0]},${r[1]}`);
  pathEle.setAttribute('points', polySegs.join(' '))

  svgPoints[0].parentNode.appendChild(pathEle);

</script>

When I'm running it with commented out line 14, it shows expected results. When I'm adding a single point to [100,15], the results shown are wrong. Please take a look.

ms440 avatar Mar 23 '19 04:03 ms440