Does anyone know how to zoom/pan (scroll) on the imagebox of EmguCV using C# code? It works just fine using mouse scroll, But I'd like to do it using code.
I tried this, but with no luck!
ImageBox1.SetZoomScale(1, new Point(400, 400));
With SetZoomScale you are on the right way.
Set a zoom scale grater than 1 to zoom in and a zoom scale smaller than 1 to zoom out. 1 means no zoom.
The second parameter is the center of the zoomed area relative to the image control.
So, if you start with a ZoomScale = 1 do the following:
Zoom in with fix point (400,00)
ImageBox1.SetZoomScale(2, new Point(400, 400));
Reset original zoom
ImageBox1.SetZoomScale(1, new Point(400, 400));
Zoom out with fix point (400,00)
ImageBox1.SetZoomScale(0.5, new Point(400, 400));
Related
I am getting my feet wet with JavaFX, and have a simple drawing program which writes to a Canvas using a PixelWriter. The program draws a pixel at a time, reflecting each pixel over a number of axes to create a growing and evolving pattern centered on the canvas:
The Canvas is in the Center region of a BorderPane, and I have written the code to resize the canvas when the application window is resized. That works OK.
However, I would like to re-center the image on the new resized canvas so that the drawing can continue to grow on the larger canvas. What might be the best approach?
My ideas/attempts so far:
Capture a snapshot of the canvas and write it back to the resized canvas, but that comes out blurry (a couple of code examples below).
I dug into GraphicsContext translations, but that does not seem to move the existing image, just adjusts future drawing.
Maybe instead of resizing the canvas, I make a huge canvas bigger than I would expect my app window to be, and center it over the center region of the border pane (perhaps using a viewport of some kind?) I'm not thrilled about the whole idea of making some arbitrarily huge canvas that I think will be big enough though. I don't want to get into scaling - I am using PixelWriter so that I get the crispest image without antialiasing and other processing.
My snapshot attempt looked like this, but was blurry:
SnapshotParameters params = new SnapshotParameters();
params.setFill(Color.WHITE);
WritableImage image = canvas.snapshot(params, null);
canvas.getGraphicsContext2D().drawImage(image, 50, 50);
The 50, 50 offset above is just for my testing/learning - I'll replace it with a proper computed offset once I get the basic copy working. From the post How to copy contents of one canvas to another? I played with the setFill() parameter, to no effect.
From the post How to save a high DPI snapshot of a JavaFX Canvas I tried the following code. It was more clear, but I have not been able to figure out how to find or compute the pixelScale to get the most accurate snapshot (the value 10 is just some number I typed in bigger than 1 to see how it reacted):
int pixelScale = 10;
WritableImage image = new WritableImage((int)Math.rint(pixelScale * canvas.getWidth()),(int)Math.rint(pixelScale * canvas.getHeight()));
SnapshotParameters params = new SnapshotParameters();
params.setTransform(Transform.scale(pixelScale, pixelScale));
params.setFill(Color.WHITE);
canvas.snapshot(params, image);
canvas.getGraphicsContext2D().drawImage(image, 50, 50);
Thanks for any direction y'all can point me in!
I'm using pyqtgraph PlotWidget to draw something, that works well. But when I want to rotate the "view".
Here is the first pic, degree 0:
[1]: https://i.stack.imgur.com/gQnGd.png
Then after rotate with transform(codes later), degree 40 as example:
[2]: https://i.stack.imgur.com/qX12z.png
As marked in pic2, actually, after rotation, the "out of view" area is supposed to be filled with the grid and the item in invisible area of pic1 would show too.
Code:
#plotwidget initialized in ui file with a QFrame parent,
#which also the parent of buttons and sliders.
range = QRectF(0, 0, self.plotwidget.size().width(), self.plotwidget.size().height()).center()
transform=self.plotwidget.transform()
transform.translate(range.x(),range.y())
transform.rotate(angle)
transform.translate(-range.x(),-range.y())
self.plotwidget.setTransform(transform)
I checked the api of QGraphicsScene and QGraphicsView, only QGraphicsView has the rotate method, which actually the same as "rotate" with transform.
So I think the rotate of QGraphicsView or PlotWidget actually rotate the view widget itself and the QGraphicsScene in it meanwhile. But how to rotate the scene only?
Thanks for your help ahead.
I am trying to implement zoom in zoom out functionality in VC++ MFC framework.As I am new for this facing problem in CDC, Graphics And CscrollView concepts.
Default ZoomLevel is 100% and it's scaling by 20% up/Down (60,80,100,120,140,160).
As I have to Zoom the CRect (i.e some rectangular blocks) along with that some lines which is connected to that Rectangle.
Currently Able to zoom with scrollbar support using Cscrollview but while we zoom at some level for ex. 120% I am expanding canvas size
canvas default page size vertically and horizontally are i.e 5000.
Now while we zoom #120% (canvas size * 120) i.e 6000.
Anyhow after zooming blocks and inside image all are expands properly at all zoom level. But the main problem is Connecter With that rectangle block are
not exactly connected to center its showing some gap.
For that I am attaching one image which showing gap between Block and Connector line.
Before Zoom # default level i.e 100% which looks properly connected:
After Doing zoomin i.e #120% Lines are not connected properly to the Blocks:
As you can see Before and after Zoom rectangle and lines objects showing some gap.That is required to be fixed after doing zoomin/out.
Please let me know, What should be best practise or how to expand/zoom the canvas and its all the objects on it ?
Is there any way if we expand or zoom the view/canvas bitmap object all the object(CREct + Lines + images etc on that canvas also adjusted accordingly?
My requirement for zoomin/zoomout is similar like windows print preview dialog box is providing DefaultView Zoomin and Zoomout option at diffrent level (100,125,150,200 etc).
Or if you have any project reference code related to this please share it will be very big help for me.
I've been working with Jason Davies' Rotate the World and World Countries examples and incorporating a few other bits and pieces to learn about d3.
An example of what I have come up with so far is here.
The small selector in the top left corner will trigger a new 'trip' to be displayed on the globe and the centroid of the trip will be centered in view. This all works well, as does panning and zooming on the globe with the mouse.
However, there's an issue with the present implementation when one zooms in/out, alters the visible trip, then attempts to pan/zoom again: the zoom defaults back to the level it was before the trip change - resulting in a zoom 'jump' I'd like to remove [To see this behaviour, load my MNWE, zoom in with the mouse wheel perhaps 3 times, click the OK button to load 'J07', click on the globe holding the mouse button down and pan a bit - you'll see the jump I'm referring to.].
I'm pretty sure it's just me not updating the scale of my projection correctly, but I don't know enough to troubleshoot further. Jason has implemented a d3.geo.zoom function, which probably should be capable of fixing the issue. My attempt was to call it in my $("#sub").on("click" ... call via:
d3.select("#map").call(d3.geo.zoom().projection(proj).scale(a/2-10).on("zoom.redraw", function() {
d3.select(this).selectAll("path").attr("d", d3.geo.path().projection(proj));
}));
but that gave spurious results after the fact as well.
Lines 344 and 346:
var sc = d3.interpolate(proj.scale(), a / 2 - 10); //344
return function(i) {
proj.rotate(interp(i)).scale(sc(i)); //346
d3.select("#map").selectAll("path").attr("d", d3.geo.path().projection(proj));
//r.world();
};
are probably where I introduce the bug, as the rotation portion works without issue, it's only the scale additions that cause problems.
This can be solved by defining the zoom behavior in global scope.
m = d3.behavior.zoom();
Then update the zoom behavior with the scale in the transition as shown below this will stop the jump effect you have.
d3.transition().delay(250).duration(2250)
.tween("rotate", function() {
interp.source(proj.rotate()).target(coords).distance();
var sc = d3.interpolate(proj.scale(), a / 2 - 10);
return function(i) {
proj.rotate(interp(i)).scale(sc(i));
m.scale(sc(i));//update the zoom in the zoom behavior this will sop the jumping effect
d3.select("#map").selectAll("path").attr("d", d3.geo.path().projection(proj));
//r.world();
};
});
Working code here
Hope this helps.
I'm creating an image editing program in GTK\C, and I can't figure out how to make zoom work; I need to zoom my Cairo-based canvas to the mouse cursor's position, but Cairo only zooms to center of the image it displays. The normal way to get around this is to transform, zoom, and then transform back; but that messes up the scrollbars surrounding my canvas.
My idea was to slide the scrollbars back to compensate for the movement caused by zooming. Moving the scrollbars by mouse_position * (new_zoom - old_zoom) ought to work, but it doesn't; it under-corrects at low zoom levels, then over-corrects at high levels.
How can I zoom correctly?
My code is visible here, if it helps: ScreenSnap on Github
It looks like you need to scale your shift to your current zoom level in the code. So this line:
shift_x = self->zoom_point_x * (self->zoom_level / .9 - self->zoom_level);
Should be:
shift_x = self->zoom_point_x * (self->zoom_level / .9 - self->zoom_level)/(self->zoom_level);
Note that your approximation worked at a zoom level of one but as you move away you either under or overcorrect.