Best way to draw rectangles via mouse drag in React.js? - reactjs

I'm trying to highlight areas of an image like how you would on your mac or windows by dragging an area with the mouse in a React.js application.
I understand this would be best done on Canvas, by overlaying the canvas over the image, and then catch the mouse events and drawing the rectangle accordingly, is there a good library or something to do this? because writing raw code to implement this seem to be reinventing the wheel.
Thanks in advance.

Not sure if this is enough to warrant a full answer but I ran into a similar situation and this library is the best I could find:
react-sketch
Admittedly though it seems the maintainer is very unresponsive/not maintaining the package which is a bit concerning.
Hope this helps :)

There are some libraries .
you can choose https://daybrush.com/scena/
and some paid libraries

Related

Image Viewer swipe vertically

Is there any way to make Image Viewer swipe vertically? It would be great to have that functionality. If it's not implemented, is there any chance to achieve this overriding some method from the class?
Thanks
No.
The source assumes horizontal swipe quite heavily and this isn't trivial to change in a generic way as there is quite a lot of other code there to implement things such as pan and zoom.
You might be able to hack something manually that suits your needs based on our source. If you are able to come up with something generic and change the ImageViewer class feel free to submit a pull request.

C Drawing overlay WINAPI

I'm looking for a way to draw an overlay. I want to create a small popup box in the bottom right corner to notify the user. I'm not sure what they are called, but I guess it's kinda like an overlay? I guess the easiest way to do this for me is in the winapi, but I'm not sure how. Anyone has a link I can read with more info, or maybe even code samples? Even the name of these notifications boxes would help so I can google better.
Thanks
don't know if it might help but you can try with sprite layers
http://msdn.microsoft.com/en-us/library/bb194908.aspx
I think these notifications are simply small windows with the WS_EX_TOPMOST style and an effect such as those provided by AnimateWindow().
Or if you don't want to do that much customization, maybe you can settle for a balloon tip from classic notification icons.

Rotating progressbar download

Can any of you tell me of a place that I can download a fancy rotating progressbar? Or else to use WPF to develop one? Problem with that though is I don't have any WPF templates. I am looking for a quick solution also, with little development required.
Basic introduction to templating, has a few examples for ProgressBars as well: MSDN
If you want an indeterminate rotating thing that is fairly easy (e.g. here), but for it to fill up that might be quite difficult.

Need software that can help me in working with pixels

I am working with graphics in C. I find thinking about the pixel locations terrible and I am in need of a tool where I can draw images and it gives me the pixel location of that point. Please guide me.
Paint that comes with Windows provides pixel locations in its status bar.
Check out free and open source gimp http://www.gimp.org/ . It is the most highly rated open source multi os paint program by far.
I'm not quite sure what you're getting at here, however, Inkscape allows you to position and draw things on a per-pixel basis. You could draw your graphics, etc on Inkscape and use that as a reference.
Also, as Basarat Ali says, GIMP is good for this too.

Display 360 Image in Silverlight 3.0 (Not Panorama)

I have a lot of images taken from a 360 camera which I would like to be able to display in Silverlight 3. They are NOT regular panorama images. The camera which took the image actually creates a distorted jpeg that becomes undistorted once wrapped around a sphere as a texture. I have desktop software that will allow viewing of the image (not just side-to-side, but straight up, down, etc.) and I need to try to get the same functionality in Silverlight. It is very similar to Google StreetView.
What I think I need is to create a sphere, wrap the jpeg on the sphere as a texture, then put the "camera" inside the sphere. I doubt this is possible in Silverlight, but perhaps there is a way to simulate this?
So far, Google searches aren't bringing anything up. Can anyone point me in the right direction to figure out how to do this? Are there any existing projects that do this?
An example of a typical image is here.
These might help you out (probably not). They are 3d engines for silverlight, but they will probably wrap the image outside of the sphere instead of inside, which is probably what you need.
Kit3D http://www.codeplex.com/Kit3D
Balder http://www.codeplex.com/Balder
Another, possibly more promising option, would be to use javascript. So far you've probably researched how to do this in Silverlight, but you might do some similar searching for using javascript for this. There may be an option out there already, and since Silverlight can interopt with Javascript, you might be in luck.
Your gonna have to map the texture to a sphere then, like you said. But afaik silverlight 3 doesn't support hardware accelerated 3d.
So your options are:
Try and find a silverlight software 3d library (Like this)
Write your own software rasterizer (multi page guide)
Hope this helps
You might want to try cropping a window from the image and display it. if the user want to go right, move the window right and crop. if the user wants to go left, move the window left and crop. to zoom out, expand the window, to zoom in make the window smaller. if you move the frame far right then stitch the image data from the left side.
You might need to modify the image to eliminate the distortion, this shouldn't be too hard and depends on the camera lens focal length.
Don't try mapping the image to a sphere, it is much harder.
At https://hdviewsl.codeplex.com it says that HD View SL (Silverlight version) supports
"orthographic (2D), with wrapping for 360-degree panoramas"
Also you could try to port PtViewer source code to Silverlight from Java if no one else has
UPDATE:
VRLight might be the solution in your case:
http://vrlight.thecloudsite.net/
http://vrlight.thecloudsite.net/tutorial.html
http://ivrpa.org/blog/3651/vrlight_vredit_20
Its author (Jurgen Eidt) is also making cPicture (http://cpicture.thecloudsite.net/index.en.html), if you can't find him from the VRLight site, try from the cPicture one, or try from his blog at IVRPA website (http://ivrpa.org/blog/3651), which seems to have recent posts

Resources