- I am using open layers 6 lib for map rendering and events.
- my application needed same like this example http://viglino.github.io/ol-ext/examples/layer/map.geoimage.html i.e. Example have ol.source.GeoImage..
I have tried
- i am using affine transformation above lib and returns scaling, rotation and center of image transformation..
- its giving the values
scaling : 327.805670381418,327.805670381418
rotation : -0.1310210334156003
transformation : 7179251.8557908312,6022627.228704552
- now I have calculated extent and image projection & image static source is in ol 6 and rotated image projection in this link (https://codesandbox.io/s/reprojection-image-z0uit)
// center of image from affine
const translationX = transformation.getTranslation()[0];
const translationY = transformation.getTranslation()[1];
extent = transformExtent([translationX - (xScale * this.imageData.width / 2),
translationY - (yScale * this.imageData.height / 2),
translationX + (xScale * this.imageData.width / 2),
translationY + (yScale * this.imageData.height / 2)],
get('EPSG:3857'), get('EPSG:4326'));
const imageProjection = this.returnRotateProjection(
viewProjection,
fromLonLat([transformation.getTranslation()[0], transformation.getTranslation()[1]], 'EPSG:4326'),
transformation.getRotation(),
extent
);
const imgSource = new Static({
url: this.imgURL,
projection: imageProjection,
imageExtent: extent,
imageSize: [this.imageData.width, this.imageData.height],
imageLoadFunction : (image) => {
image.getImage().src = this.imgURL;
if (image.resolution === undefined) {
image.resolution = (image.extent[3] - image.extent[1]) / image.image_.height;
}
image.state = 2; // ImageState.LOADED;
image.unlistenImage_();
image.changed();
}
});
- here issue is image resolution is very bad like image displaying like curve shape
- is there any possibles for finding 4 corners(bounding box using center of image and rotated image center point and width, height, scalling)
- suggest or help on this.. thanks in advance.. and save my days.. gis