Draw an aircraft with polygon coordinates in JavaFX - javafx

Could you please tell me, how can I draw a really simple aircraft with polygon-Coordinates in JavaFX? Here is some code to show you what the idea is:
Polygon polygon = new Polygon();
polygon.getPoints().addAll(new Double[]{
100.0, -100.0,
220.0, 11.0,
290.0, 20.0,
350.0, 200.0});
pane.getChildren().add(polygon);
I don't know, which and how many coordinates are the best.

If you don't feel like an artist yourself you could also download one of the many SVG files from the net (for example this one: https://commons.wikimedia.org/wiki/File:Airplane_silhouette.svg Just search for "airplane SVG") extract the path from the file and then use the JavaFX SVGPath class to display it. How to use the SVGPath is shown here
for example.
https://www.tutorialspoint.com/javafx/2dshapes_svgpath.htm

Related

Get 3D mesh views from 2D selection box in JavaFX

I am trying to implement a 2D selection window that can select the 3D vertices inside the 2D window (indicated by dashed cyan rectangle). Each of my 3D models is currently a composite group of MeshView's, one MeshView per face. My plan was to iterate over each face (MeshView) and check if the 2D bounds intersect with the selection box bounds (I am planning to update this later using an Atlas texture to reduce the amount of meshes, but for now I just want the selection mechanism working).
Currently I have the following, but this isn't correct.
val selectionBounds = selectionRectangle.boundsInParent
val localBounds = meshView.localToScene(meshView.boundsInLocal, true)
if (selectionBounds.intersects(localBounds))
// do something with the mesh in meshView
My subscene contains a perspective camera, now I saw two useful posts:
Convert coordinates from 3D scene to 2D overlay
How to get 2D coordinates on window for 3D object in javafx
I think I have to first project the meshView's bounds properly using my perspective camera. But I am unsure how to proceed, do I have to project every 3D point in the local bounds to 2D as is done in referenced question 2 (above). Not very familiar with the math, or related concepts, any help would be appreciated.
(wink, wink MVP José)
EDIT 1:
After José's suggestion I added red bounding boxes for each meshview which gives the following result:
Apparently it adds some offset which appears to be the same regardless of the camera rotation. Here the red boxes are drawn around each meshview. Will investigate further..
EDIT 2:
I use a Pane which contains the SubScene and another Node. This is done to control the sizing of the SubScene and to reposition/resize the other Node accordingly by overriding the layoutChildren method, as such (this is in Kotlin):
override fun layoutChildren() {
val subScene = subSceneProperty.get()
if (subScene != null){
subScene.width = width
subScene.height = height
}
overlayRectangleGroup.resize(width, height)
val nodeWidth = snapSize(overlayMiscGroup.prefWidth(-1.0))
val nodeHeight = snapSize(overlayMiscGroup.prefHeight(-1.0))
overlayMiscGroup.resizeRelocate(width - nodeWidth, 0.0, nodeWidth, nodeHeight)
}

JavaFX: Illuminate object from inside

I'm making a little model solar system, and trying to learn the finer points of lighting. The sun is modeled as a sphere with a diffuse map texture I found, and I added a PointLight to its center. It illuminates the other planets very nicely, but the sun itself is dark. What's the right way to make an object appear radiant and not just reflective?
Of course I found an answer RIGHT after posting. The key is the setSelfIlluminationMap method in PhongMaterial:
private static Sphere buildGlowingPlanet(double radius, Image diffuseMap, Image selfIlluminationMap) {
Sphere planet = new Sphere(radius);
PhongMaterial planetMaterial = new PhongMaterial();
planetMaterial.setDiffuseMap(diffuseMap);
planetMaterial.setSelfIlluminationMap(selfIlluminationMap);
planet.setMaterial(planetMaterial);
return planet;
}
It would be nice if there was a way to just make the illumination be a solid color, but you could just use a blank white image for that.

How to extend Shape class in paperjs to create new shapes like polygon

I want to extend Shape class in paper.js to draw polygon like pentagon or hexagon
I don't want to use Path.RegularPolygon as it is creating a problem while rotating object along with the path.
Can anyone please provide me sample code on how to extend Shape class to create Polygon in paperjs
Just use
var hexagon = new Path.RegularPolygon(new Point(xPos, yPos), 6, radius);
hexagon.rotate( 15 );
paper.view.draw();

What's the best way to draw something like THIS using Flex 3?

I am trying to create a "radar-like" control within our Flex application.
See the following link for an example (sorry, small image...)
http://www.radware.com/uploadedImages/Products/Management/Insite/Security-Dashboard.jpg
This is my first foray into drawing with Flex.
I would like to draw the main circles of the radar, the radar scanning shape, and circles/balls representing objects within the radar. These objects need to have the ability to be clicked on or hovered over so the user can get more information.
I'm looking at Sprite's and Shapes, etc. but confused as which to use to create such a control.
Any tips, links or suggestions would greatly be appreciated.
Thanks!
Couple of good options in Flex 3
http://www.axiis.org/
http://www.degrafa.org/blog/category/data-visualization/
http://visunetdemos.demos.ibm.com/webdemos/radar/radar.html
Before I jump into degrafa, I simply did the following to get the basic radar display drawn. Any thoughts or feedback on how I did this would be great.
var mySprite:Sprite = new Sprite();
var mySprite2:Sprite = new Sprite();
var mySprite3:Sprite = new Sprite();
mySprite3.graphics.beginFill(0x000000);
mySprite3.graphics.drawCircle(210, 210, 200);
mySprite2.graphics.lineStyle(2, 0xA10303, .75);
mySprite2.graphics.drawCircle(210, 210, 150);
mySprite.graphics.lineStyle(2, 0xA10303, .75);
mySprite.graphics.drawCircle(210, 210, 75);
this.rawChildren.addChild(mySprite3);
this.rawChildren.addChild(mySprite2);
this.rawChildren.addChild(mySprite);

How to erase an area in a BitmapData object?

Flex 3, ActionScript 3, Flash player 9.
I have a picture in a BitmapData object. And an array of points. I nead to erase the part of the picture inside a polygon specified by the points. In other words, draw a polygon specified by the points and fill it with transparency.
Any ideas on how it can be done?
Got it working with the following code:
var shape:Shape = new Shape();
shape.graphics.beginFill(0x000000, 1); // solid black
shape.graphics.moveTo(points[0].x, points[0].y);
points.forEach(function (p:Point, i:int, a:Array):void {
shape.graphics.lineTo(p.x, p.y);
});
shape.graphics.endFill();
data.draw(shape, null, null, "erase");
For a rectangle, you can use fillRect. For a polygon you are gonna have to draw the polygon in a totally different color (than other colors in the bitmap) and use floodFill - but I don't know how to draw a polygon. There is no method in bitmap data class to draw lines. Another option would be to write your own logic to find pixels inside the polygon and use setPixel32 method to set their alphas to zero.
This wikipedia page describes algorithms to find if a point is inside a given polygon. You might find it useful.

Resources