I want to develop an app where the user should be able to draw objects (circles/elipses), connect them via lines/arrows and drag/drop them, add text to them etc.
Of course I also have to write eventHandling.
What is most suitable for that? Would you rather go for gwt-graphics or GWTCanvas?
Based on that what i know, GWT-Graphics is based on SVG. while GWTCanvas(which is actually part of GWT main line) is based on canvas element.
now, quick comparsion.
For all drag and drop thing, SVG was much easier and quicker (when o was testing drag and drop when i had large abount of elements, my program based on canvas was much slower than similar stuff based on SVG
Other advantage of SVG based library is canvas is not supported y all browsers (actualy older versions of ie imight have some issues)
from the other hand,
canvas is much quicker while you need to draw massive number of objects, canvas is definietly your choice.
I would personally go with gwt-graphics. It is the one I know better, it gives as much control over graphics as was needed to me (and I think you too) and most of the events are already implemented, so the logic you will need to write will be minimal.
On the other hand SVG is not well supported by IExplorer and if the vectors become numerous you will have compatibility problems.
The Canvas if HTML 5 and will give you pixel level control - which I assume is not the case in your project - but will also lead to a - no workarounds - approach which is a pro.
In conclusion, I think it depends on the level of control you want the user to have while using the canvas and the level of work you want to do on your part.
Related
I'm looking for some way to set background image with barrel distortion effect(FishEye/FOV) for node using JavaFX. I found algorithm with pixel manipulation, but I want to find some another way(some hack) for reach it. This effect will be use for create node background high definition image changing animation(animation wil be change factor(power/value/degree?)) of this effect.
I'd like to offer an alternative approach which is much more efficient (real-time capable). Any solution which is based on direct pixel manipulations is doomed to be very inefficient especially for a "high definition image".
Instead I'd propose to use a TriangleMesh for this and use the image as its texture. You can then apply any kind of distortion you like by just manipulating the texture coordinates. This approach can be easily integrated into any 2D graphics via the JavaFX scene graph.
I am actively using this concept for on-the-fly reprojection of raster map tiles, so I know it works.
I will answer this question in the spirit that it was asked, i.e. no code.
JavaFX has an effect framework.
There is no in-built fisheye effect.
You could create your own custom fisheye effect implementation and plug it into the effect framework if you are a skilled developer.
Easier would be to apply your algorithm using a WritableImage with a PixelWriter or Canvas. Perhaps that could even plug into the effect framework (if you actually needed to do that, which you probably don't) using an ImageInput.
For an example of applying an algorithm to the pixels in an input image see:
Reduce number of colors and get color of a single pixel
Of course, you would use a fisheye algorithm (coded for JavaFX instead of the linked implementations) for a fisheye transform.
To animate use an AnimationTimer or, again for skilled developers, create a custom transition that plugs into the JavaFX animation framework.
You can add properties to your custom effect and manipulate them using additional properties defined on the custom transition you create.
Providing a complete solution is out of scope for a StackOverflow answer. To get help with individual tasks, split the problem up into different pieces, e.g. creating a custom effect, manipulating pixels to create a fisheye, animating an effect on an image or timeline, etc. Write the code and ask questions about the actual code with a minimal example for the problem portion you are trying to solve when you get stuck.
Using Java and SWT, I am trying to display a map (provided as an image) and mark points on it. First idea is to use a canvas, draw the image (scaled to the largest possible size for this canvas) and then draw the markings (fixed size) to the scaled coordinates. However I would also like to zoom in and move the image, and would prefer not to develop all this functionality from scratch. However I am not having much luck finding an existing solution, though I would guess there should be something out there.
The criteria would be:
based on SWT (or compatible)
allows exchange of the image (possibly with different sizes)
handles user interaction (selection a point on the image, zooming in/out of the image)
Does anybody know a standard/common solution?
Depending on how complex your system will potentially grow, maybe using GEF is an option.
The whole rendering is done on SWT.Canvas and it provides Zooming/Scrolling/Moving out of the Box.
Downside: Its dependant on RCP, so this is likely to be only an option if you need to build an otherwise complex application - in all other cases GEF will be quite heavyweight to set up.
I'm doing a college project which I must finish in 3 months. And I have 8 hours a week to spend in that project.
The project consists in doing a graphical interface that shows many rectangles next to each other which should be movable. It should be very similar to the tabs in the chrome browser, where you can drag them to which ever position you want.
In addition to that there should be arrows connecting one rectangle to the other. And these arrows should still connect the same rectangles even when I change the order of the rectangles. The image below illustrates what I'm saying.
The image shows before and after one of the rectangles being dragged.
Since Java is my first language, I would like to use it.
My question is: What framework, APIs should I use to do this project. What will be the easiest and fastest way to do it? Should I use Swing? or JavaFX? or GWT? or other alternative?
Is there an API for handling arrows connecting objects? Maybe one used for representing graphs may be ok.
Edit: I don't know anything about Swing and neither about JavaFX. So which one would be more worthwhile learning given that I don’t have too much time this semester because I’m very busy?
This shouldn't be too hard to write from scratch.
Use this site : http://www.codeproject.com/Articles/116088/Draggable-Components-in-Java-Swing for the drag-able components
Draw arrows with some kind of parameterization (math formula) for half of an oval. Pass the draw path into a java.awt.Graphics2D pen object.
You might want to check Java Universal Network/Graph Framework.
It has some extensive support for making editable graphs while maintaining relationship among nodes and edges.
What you can do is change the icon of node to a squared rectagnle, while add logic to plot them in a straight axis so that it would look the way you want, plus it would be editable while linked arrows will remain where they should be.
But incase you don't have experience with Swing, better start learning the basis of SWING first, as JUNG framework pretty much requires some good basic knowledge of swing itself.
Here’s my task which I want to solve with as little effort as possible (preferrably with QT & C++ or Java): I want to use webcam video input to detect if there’s a (or more) crate(s) in front of the camera lens or not. The scene can change from "clear" to "there is a crate in front of the lens" and back while the cam feeds its video signal to my application. For prototype testing/ learning I have 2-3 images of the “empty” scene, and 2-3 images with one or more crates.
Do you know straightforward idea how to tackle this task? I found OpenCV, but isn't this framework too bulky for this simple task? I'm new to the field of computer vision. Is this generally a hard task or is it simple and robust to detect if there's an obstacle in front of the cam in live feeds? Your expert opinion is deeply appreciated!
Here's an approach I've heard of, which may yield some success:
Perform edge detection on your image to translate it into a black and white image, whereby edges are shown as black pixels.
Now create a histogram to record the frequency of black pixels in each vertical column of pixels in the image. The theory here is that a high frequency value in the histogram in or around one bucket is indicative of a vertical edge, which could be the edge of a crate.
You could also consider a second histogram to measure pixels on each row of the image.
Obviously this is a fairly simple approach and is highly dependent on "simple" input; i.e. plain boxes with "hard" edges against a blank background (preferable a background that contrasts heavily with the box).
You dont need a full-blown computer-vision library to detect if there is a crate or no crate in front of the camera. You can just take a snapshot and make a color-histogram (simple). To capture the snapshot take a look here:
http://msdn.microsoft.com/en-us/library/dd742882%28VS.85%29.aspx
Lots of variables here including any possible changes in ambient lighting and any other activity in the field of view. Look at implementing a Canny edge detector (which OpenCV has and also Intel Performance Primitives have as well) to look for the outline of the shape of interest. If you then kinda know where the box will be, you can perhaps sum pixels in the region of interest. If the box can appear anywhere in the field of view, this is more challenging.
This is not something you should start in Java. When I had this kind of problems I would start with Matlab (OpenCV library) or something similar, see if the solution would work there and then port it to Java.
To answer your question I did something similar by XOR-ing the 'reference' image (no crate in your case) with the current image then either work on the histogram (clustered pixels at right means large difference) or just sum the visible pixels and compare them with a threshold. XOR is not really precise but it is fast.
My point is, it took me 2hrs to install Scilab and the toolkits and write a proof of concept. It would have taken me two days in Java and if the first solution didn't work each additional algorithm (already done in Mat-/Scilab) another few hours. IMHO you are approaching the problem from the wrong angle.
If really Java/C++ are just some simple tools that don't matter then drop them and use Scilab or some other Matlab clone - prototyping and fine tuning would be much faster.
There are 2 parts involved in object detection. One is feature extraction, the other is similarity calculation. Some obvious features of the crate are geometry, edge, texture, etc...
So you can find some algorithms to extract these features from your crate image. Then comparing these features with your training sample images.
I need a way for render a tree-like structures, similar to flowcharts.
Surprisingly, I can't find(or I'm doing wrong) a suitable tool.
First, I looked at SVG. But I couldn't find a way to draw a bounding box around the text
without using ECMAScript: I tried to do a simple thing drawing two text surrounded by boxes and linked by a line, centered by sides(some thing like O-O, where O is a box with text).And when you use ECMAScript, you heavily limit the tools that can be used for SVG rendering(for example you can't convert corrently such SVG to png or pdf with ImageMagick).
Second, I tried Asymptote, but it is quite heavy when you start manipulating with text(you need an LaTeX system installed and configured).
I look for a tool in which you can:
Programmatically access to font properties: baseline, ascent, descent, height
Computing height/width of a string(or the bounding box)
basic vector graphics functionality like drawing lines, shapes etc.
I don't think that's a hard stuff. For example, all such functionality exists for example in Java2D. Sure, I can use it as last resort and get raster graphics, but may be there is something handy to use?
Have you looked at GraphViz (http://www.graphviz.org/)? It does not really match your requirements since you give up some control and instead let the tool do the layout and rendering based on a declarative a description of a graph or tree, but I have found it to be the easiest way to generate tree-like output.
Not sure if it should be free?
Here's a commercial solution with an extensive API
http://www-01.ibm.com/software/integration/visualization/java/