Dive into secure and efficient coding practices with our curated list of the top 10 examples showcasing 'viewport-mercator-project' in functional components in JavaScript. Our advanced machine learning engine meticulously scans each line of code, cross-referencing millions of open source libraries to ensure your implementation is not just functional, but also robust and secure. Elevate your React applications to new heights by mastering the art of handling side effects, API calls, and asynchronous operations with confidence and precision.
test('getProjectionParameters', t => {
for (const vc in VIEWPORT_PROPS) {
const props = VIEWPORT_PROPS[vc];
// TODO - for now, just tests that fields are valid number
const {fov, aspect, focalDistance, near, far} = getProjectionParameters(props);
t.ok(Number.isFinite(fov), 'getProjectionParameters: fov is a number');
t.ok(Number.isFinite(aspect), 'getProjectionParameters: aspect is a number');
t.ok(Number.isFinite(focalDistance), 'getProjectionParameters: focalDistance is a number');
t.ok(Number.isFinite(near), 'getProjectionParameters: near is a number');
t.ok(Number.isFinite(far), 'getProjectionParameters: far is a number');
}
t.end();
});
delta * pixelsPerMeter[1],
z * pixelsPerMeter[2]
];
const coordsAdjusted = [
delta * (pixelsPerMeter[0] + pixelsPerMeter2[0] * delta),
delta * (pixelsPerMeter[1] + pixelsPerMeter2[1] * delta),
z * (pixelsPerMeter[2] + pixelsPerMeter2[2] * delta)
];
let pt = [longitude, latitude];
// turf unit is kilometers
pt = destination(pt, delta / 1000 * Math.sqrt(2), 45);
pt = pt.geometry.coordinates;
const realCoords = [
lngLatToWorld(pt, scale)[0] - lngLatToWorld([longitude, latitude], scale)[0],
lngLatToWorld(pt, scale)[1] - lngLatToWorld([longitude, latitude], scale)[1],
z * getDistanceScales({longitude: pt[0], latitude: pt[1], scale}).pixelsPerMeter[2]
];
const diff = getDiff(coords, realCoords);
const diffAdjusted = getDiff(coordsAdjusted, realCoords);
t.comment(`unadjusted: ${diff.message}`);
t.comment(`adjusted: ${diffAdjusted.message}`);
t.ok(diffAdjusted.error.every(e => e < DISTANCE_TOLERANCE),
'Error within ratio tolerance');
t.ok(diffAdjusted.errorPixels.every(p => p < DISTANCE_TOLERANCE_PIXELS),
'Error within pixel tolerance');
}
}
z * pixelsPerMeter[2]
];
const coordsAdjusted = [
delta * (pixelsPerMeter[0] + pixelsPerMeter2[0] * delta),
delta * (pixelsPerMeter[1] + pixelsPerMeter2[1] * delta),
z * (pixelsPerMeter[2] + pixelsPerMeter2[2] * delta)
];
let pt = [longitude, latitude];
// turf unit is kilometers
pt = destination(pt, delta / 1000 * Math.sqrt(2), 45);
pt = pt.geometry.coordinates;
const realCoords = [
lngLatToWorld(pt, scale)[0] - lngLatToWorld([longitude, latitude], scale)[0],
lngLatToWorld(pt, scale)[1] - lngLatToWorld([longitude, latitude], scale)[1],
z * getDistanceScales({longitude: pt[0], latitude: pt[1], scale}).pixelsPerMeter[2]
];
const diff = getDiff(coords, realCoords);
const diffAdjusted = getDiff(coordsAdjusted, realCoords);
t.comment(`unadjusted: ${diff.message}`);
t.comment(`adjusted: ${diffAdjusted.message}`);
t.ok(diffAdjusted.error.every(e => e < DISTANCE_TOLERANCE),
'Error within ratio tolerance');
t.ok(diffAdjusted.errorPixels.every(p => p < DISTANCE_TOLERANCE_PIXELS),
'Error within pixel tolerance');
}
}
t.end();
];
const coordsAdjusted = [
delta * (pixelsPerMeter[0] + pixelsPerMeter2[0] * delta),
delta * (pixelsPerMeter[1] + pixelsPerMeter2[1] * delta),
z * (pixelsPerMeter[2] + pixelsPerMeter2[2] * delta)
];
let pt = [longitude, latitude];
// turf unit is kilometers
pt = destination(pt, delta / 1000 * Math.sqrt(2), 45);
pt = pt.geometry.coordinates;
const realCoords = [
lngLatToWorld(pt, scale)[0] - lngLatToWorld([longitude, latitude], scale)[0],
lngLatToWorld(pt, scale)[1] - lngLatToWorld([longitude, latitude], scale)[1],
z * getDistanceScales({longitude: pt[0], latitude: pt[1], scale}).pixelsPerMeter[2]
];
const diff = getDiff(coords, realCoords);
const diffAdjusted = getDiff(coordsAdjusted, realCoords);
t.comment(`unadjusted: ${diff.message}`);
t.comment(`adjusted: ${diffAdjusted.message}`);
t.ok(diffAdjusted.error.every(e => e < DISTANCE_TOLERANCE),
'Error within ratio tolerance');
t.ok(diffAdjusted.errorPixels.every(p => p < DISTANCE_TOLERANCE_PIXELS),
'Error within pixel tolerance');
}
}
t.end();
});
config.EPSILON = 1e-7;
for (const vc in VIEWPORT_PROPS) {
t.comment(vc);
const {longitude, latitude} = VIEWPORT_PROPS[vc];
// Test degree offsets
for (const delta of [10, 100, 1000, 5000]) {
t.comment(`R = ${delta} meters`);
const origin = [longitude, latitude];
// turf unit is kilometers
let pt = destination(origin, delta / 1000 * Math.sqrt(2), 45);
pt = pt.geometry.coordinates.concat(delta);
const result = addMetersToLngLat(origin, [delta, delta, delta]);
t.comment(`Comparing: ${result}, ${pt}`);
t.ok(equals(result, pt), 'Returns correct result');
}
}
t.end();
});
export function fitViewport(viewport, points, padding = 10) {
try {
const bounds = getBounds(points);
return {
...viewport,
...fitBounds({
height: viewport.height,
width: viewport.width,
padding,
bounds,
}),
};
} catch (e) {
/* eslint no-console: 0 */
console.error('Could not auto zoom', e);
return viewport;
}
}
export function fitViewport(viewport, points, padding = 10) {
try {
const bounds = getBounds(points);
return {
...viewport,
...fitBounds({
height: viewport.height,
width: viewport.width,
padding,
bounds,
}),
};
} catch (e) {
/* eslint no-console: 0 */
console.error('Could not auto zoom', e);
return viewport;
}
}
const data = layer.getHoverData(object, allData);
const fieldsToShow =
interactionConfig.tooltip.config.fieldsToShow[dataId];
layerHoverProp = {
data,
fields,
fieldsToShow,
layer
};
}
}
if (pinned || clicked) {
// project lnglat to screen so that tooltip follows the object on zoom
const viewport = new WebMercatorViewport(mapState);
const lngLat = clicked ? clicked.lngLat : pinned.coordinate;
position = this._getHoverXY(viewport, lngLat);
}
return (
<div>
</div>
initializeProps(startProps: MapStateProps, endProps: MapStateProps) {
const startViewportProps = {};
const endViewportProps = {};
if (this.around) {
// anchor point in origin screen coordinates
startViewportProps.around = this.around;
// anchor point in spherical coordinates
const aroundLngLat = new WebMercatorViewport(startProps).unproject(this.around);
Object.assign(endViewportProps, endProps, {
// anchor point in destination screen coordinates
around: new WebMercatorViewport(endProps).project(aroundLngLat),
aroundLngLat
});
}
for (const key of this.propNames) {
const startValue = startProps[key];
const endValue = endProps[key];
assert(isValid(startValue) && isValid(endValue), `${key} must be supplied for transition`);
startViewportProps[key] = startValue;
endViewportProps[key] = getEndValueByShortestPath(key, startValue, endValue);
}
// If startZoom state is defined, then use the startZoom state;
// otherwise assume discrete zooming
startZoom = this._viewportProps.zoom;
startZoomLngLat = this._unproject(startPos) || this._unproject(pos);
}
// take the start lnglat and put it where the mouse is down.
assert(
startZoomLngLat,
'`startZoomLngLat` prop is required ' +
'for zoom behavior to calculate where to position the map.'
);
const zoom = this._calculateNewZoom({scale, startZoom});
const zoomedViewport = new WebMercatorViewport(Object.assign({}, this._viewportProps, {zoom}));
const [longitude, latitude] = zoomedViewport.getLocationAtPoint({lngLat: startZoomLngLat, pos});
return this._getUpdatedState({
zoom,
longitude,
latitude
});
}