JSFiddle - React, Tailwind, and code Playground

by kevdiho

HTML

<script src="http://maps.google.com/maps/api/js?sensor=false&amp;.js"></script>
<script src="http://delapouite.github.io/JsClipper/clipper.js"></script>
<div id="map"></div>

CSS

#map {
    width: 450px;
    height: 400px;
}

JavaScript

var array_polygon= new Array();
      var array_clipper_polygon=[];
      var cpr = new ClipperLib.Clipper();
      var subj_polygons = new ClipperLib.Polygons();
      var solution_polygons = new ClipperLib.Polygons();
      var clipType = ClipperLib.ClipType.ctUnion;

      var array_polygon1 = [
          new google.maps.LatLng(22.615278575733523, 113.69888305664062),
          new google.maps.LatLng(22.421184710331854, 113.44619750976562),
          new google.maps.LatLng(22.217920166311025, 114.05731201171875),
          new google.maps.LatLng(22.598797546832557, 114.04495239257812)
      ];

      var array_polygon2 = [
          new google.maps.LatLng(22.703988606693763, 113.47640991210938),
          new google.maps.LatLng(22.504944902977012, 113.66317749023438),
          new google.maps.LatLng(22.371666279509544, 113.19900512695312),
          new google.maps.LatLng(22.669778674332324, 113.24844360351562)
      ]



      function mergePolygon()
      {
          for(j=0;j<array_polygon.length;j++){
              array_polygon_clipper = createarray_clipper_polygon(array_polygon[j]);
              subj_polygons.push(array_polygon_clipper);
          }
          cpr.AddPolygons(subj_polygons, ClipperLib.PolyType.ptSubject);
          var succeeded = cpr.Execute(clipType, solution_polygons);
          return solution_polygons;
      }
      function getpathsolution(poly){
          for(i = 0; i < poly.length; i++) {
              for(j = 0; j < poly[i].length; j++) {
                  console.log(poly[i][j].X);
                  console.log(poly[i][j].Y);
              }
          }
      }
      function createarray_clipper_polygon(array){
          var subj_polygon = new ClipperLib.Polygon();
          for(i=0;i<array.length;i++){

              var latx =array[i].lat();
              var lngx =array[i].lng();

              subj_polygon.push(new ClipperLib.IntPoint(latx, lngx));

          }
        return subj_polygon;
      }

var map = new...