Here is an example of the logic working. My test point are already GeoJSON, I have PHP echo these as GeoJSON. Copy/Paste this HTML example to see it run the Modify as needed.
<html>
<head>
<meta charset=utf-8 />
<title>Points Within</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<!-- Load Leaflet from CDN-->
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.0.3/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.0.3/dist/leaflet-src.js"></script>
<script src="https://npmcdn.com/@turf/turf/turf.min.js"></script>
<style>
body { margin:0; padding:0; }
#map { position: absolute; top:0; bottom:0; right:0; left:0; }
</style>
</head>
<body>
<div id="map"></div>
<script>
var searchWithin = {
"type": "FeatureCollection",
"features": [
{ "type": "Feature", "properties": { "Id": 0, "Zone": 1 }, "geometry": { "type": "Polygon", "coordinates": [ [ [ -1.576983165430079, 53.917874213202538 ], [ -1.575668840812682, 53.833757437687211 ], [ -1.662610537969044, 53.833939896652851 ], [ -1.662434014051257, 53.918053543420058 ], [ -1.576983165430079, 53.917874213202538 ] ] ] } },
{ "type": "Feature", "properties": { "Id": 0, "Zone": 2 }, "geometry": { "type": "Polygon", "coordinates": [ [ [ -1.575668840812682, 53.833757437687211 ], [ -1.576983165430079, 53.917874213202538 ], [ -1.48383238441653, 53.917678723630672 ], [ -1.484008908334317, 53.833565076863636 ], [ -1.575668840812682, 53.833757437687211 ] ] ] } }
]}
//////////////////
var dataPts = {
"type": "FeatureCollection",
"features": [
{ "type": "Feature", "properties": { "ID": 1, "Lat": 53.89179593, "Lng": -1.62117004, "Rating": 1 }, "geometry": { "type": "Point", "coordinates": [ -1.62117004, 53.89179593 ] } },
{ "type": "Feature", "properties": { "ID": 2, "Lat": 53.8747, "Lng": -1.6239166, "Rating": 3 }, "geometry": { "type": "Point", "coordinates": [ -1.6239166, 53.8747 ] } },
{ "type": "Feature", "properties": { "ID": 3, "Lat": 53.88086, "Lng": -1.556625, "Rating": 2 }, "geometry": { "type": "Point", "coordinates": [ -1.556625, 53.88086 ] } },
{ "type": "Feature", "properties": { "ID": 4, "Lat": 53.863, "Lng": -1.518173, "Rating": 3 }, "geometry": { "type": "Point", "coordinates": [ -1.518173, 53.863 ] } },
{ "type": "Feature", "properties": { "ID": 5, "Lat": 53.8707, "Lng": -1.607437133, "Rating": 1 }, "geometry": { "type": "Point", "coordinates": [ -1.607437133, 53.8707 ] } }
]}
////////////////
var map = L.map('map').setView([53.88, -1.5], 11);
//basemap
var osm=new L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png',{
attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'});
osm.addTo(map);
var polyList = {};
var myPolyLayer = L.geoJSON();
myPolyLayer.addData(searchWithin);
var geojsonMarkerOptions = {
radius: 8,
fillColor: "#ff7800",
color: "#000",
weight: 1,
opacity: 1,
fillOpacity: 0.8
};
var myPts = L.geoJSON(null, {
pointToLayer: function (feature, latlng) {
return L.circleMarker(latlng, geojsonMarkerOptions);
}
})
myPts.addData(dataPts);
// myPolyLayer.addTo(map);
myPts.addTo(map);
myPolyLayer.eachLayer(function(layer) {
var coords = layer.feature.geometry.coordinates;
var polygon = turf.polygon(coords);
var polygon2 =L.geoJson(polygon, {color: 'red'}).addTo(map);
var ptsWithin4 = turf.within(myPts.toGeoJSON(), polygon2.toGeoJSON());
console.log( ptsWithin4.features.length +" points in this poly");
alert("results "+JSON.stringify(ptsWithin4));
})
</script>
</body>
</html>