传单加Turf.js -基于数据点的动态定界

Question

我刚开始接触Turf.js，但以前用过传单。希望将我的谷歌地图移到传单/turf.js

我正试图按传单使用getBounds动态地设置初始地图视图，但是当使用Turf.js时，我会得到一个错误'line.getBounds‘不是一个函数。

我也尝试过使用bbox，以获得我的数据点的边框，虽然我可以在屏幕上绘制这个框，但我似乎不能设置它的初始视图。我可以将初始视图设置为静态点。

        //Some Points
        var somePoints = [
                [-3.535,55.62],
                [-3.54,55.61],
                [-3.547,55.6],
                [-3.55,55.59],
                [-3.57,55.58]
                ];

        var features = turf.points(somePoints);
        var center = turf.center(features);


        var map = L.map('map').setView([55.6, -3.55], 12);  

    
        L.tileLayer(
            'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
            attribution: '&copy; <a href="https://openstreetmap.org" target=blank>OpenStreetMap</a> Contributors',
            maxZoom: 18,
        }).addTo(map);
          

        var line = turf.lineString(somePoints);
        var options = {units: 'miles'};
        L.geoJSON(line).addTo(map);
        
        var along = turf.along(line, 1.25, options);
            L.geoJSON(along).addTo(map).bindTooltip("my tooltip text");
         
            along = turf.along(line, 2.123, options);
            L.geoJSON(along).addTo(map).bindTooltip("12345");

            var bbox = turf.bbox(line);
            var bboxPolygon = turf.bboxPolygon(bbox);
            
            L.geoJSON(bboxPolygon ).addTo(map)
            

            var features = turf.points(somePoints);
            var center = turf.center(features);

Answer 1

更新的代码-我需要找到turf.js对象的边界

        //path coords
        var coords = [
                [-3.535,55.62],
                [-3.54,55.61],
                [-3.547,55.6],
                [-3.55,55.59],
                [-3.57,55.58]
                ];

        var features = turf.points(coords );
        var center = turf.center(features);

        var map = L.map('map');  
    
        L.tileLayer(
            'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
            attribution: '&copy; <a href="https://openstreetmap.org" target=blank>OpenStreetMap</a> Contributors',
            maxZoom: 18,
        }).addTo(map);
          

        var line = turf.lineString(coords);     
        var options = {units: 'miles'}; 


        L.geoJSON(line).addTo(map);
        
        var along = turf.along(line, 1.25, options);
            L.geoJSON(along).addTo(map).bindTooltip("my tooltip text");
         
            along = turf.along(line, 2.123, options);
            L.geoJSON(along).addTo(map).bindTooltip("12345");

            // get center x/y
            var features = turf.points(coords);
            var center = turf.center(features);
            var centroid_xy = center.geometry.coordinates;
            var x = centroid_xy[0];
            var y = centroid_xy[1];

            
            // get bounds 
                var bbox = turf.bbox(line);
                var b0 = bbox[0];
                var b1 = bbox[1];
                var b2 = bbox[2];
                var b3 = bbox[3];                           


            L.marker([55.62, -3.535]).bindPopup("Test marker").addTo(map);
                var mapMarker2 = L.icon({
                iconSize:     [16, 16],
                iconAnchor:   [8, 8],
            });

                                            
            map.setView([y, x], 13);
            map.fitBounds([[b1, b0],[b3, b2]]);