Hey sorry for the title
I wanted to create my own 3D effect and it worked well but now i want so visualize my gotten distance but there was too much math for me...
I will put the funktion here that should get the distance and draw the lines.
Thanks for help 🙂
Ask if you need some code please!
// fov is how much is in the vision
// count is how many test lines are drawn in fov
// speed is how far the tester should move on one frame
public void test(float fov, float count, int speed) {
int size = Gdx.graphics.getWidth();
int height = Gdx.graphics.getHeight();
for (float i = 1; i <= count; i++) {
// Distance.test2D() will send a sensor from the roration of "rotation" and if it touches something is returns how many pixels were between that objects. The maxValue will return if it doesnt touch anything for 500 pixels
float distance = Distance.test2D(position, rotation - (fov) + i * (fov / (count / 2)), 500, speed);
// int drawAt = where to draw the line
int drawAt = // where the line should be drawn on the x axes
// will draw a strate line from the buttom to a specefic height
shapeRenderer.line(drawAt, 0, drawAt, (200 - distance * 2));
}
}
In Godot I have a RigidBody that I would like to turn in 3D space so that it points towards a certain direction. Pretty much a LookAt. I found this tutorial, and I've written the below based on it.
Something I find a little confusing is that I'm not sure why it's only worrying about the x axis in the rotationAngle - should I be somehow implementing the others too?
public override void _IntegrateForces(PhysicsDirectBodyState state)
{
// Push RigidBody in direction that it's facing
Vector3 forwardForce = GetForwardForce();
this.ApplyCentralImpulse(forwardForce);
// Turn RigidBody to point in direction of world origin
var targetPosition = Vector3.Zero;
var currentDirection = -this.Transform.basis.z;
var currentDistanceFromTarget = this.Translation.DistanceSquaredTo(targetPosition);
GD.Print(currentDistanceFromTarget + " " + currentDirection);
if(currentDistanceFromTarget > 50)
{
var targetDir = (targetPosition - this.Transform.origin).Normalized();
var rotationAngle = Mathf.Acos(currentDirection.x) - Mathf.Acos(targetDir.x); // Why only x?
var angularVelocity = Vector3.Up * (rotationAngle / state.GetStep());
state.SetAngularVelocity(angularVelocity);
}
}
This will work up to a point - if the new currentDirection happens to match the positive Z axis, then it just continues in that way.
I am currently working with gmap.net to create a certain radius with a polygon. I currently have made a polygon for the radius but now I come to the problem that I want to create multipule markers but only show the markers who are inside the polygon. Is this possible?
_polygonOverlay = new GMapOverlay("destination");
_gMap.Overlays.Add(_polygonOverlay);
private void CreateCircle(PointLatLng destination, double radius)
{
List<PointLatLng> radiusPoint = new List<PointLatLng>();
double seg = Math.PI * 2 / 40;
for (int i = 0; i < 40; i++)
{
double theta = seg * i;
double latitude = destination.Lat + Math.Cos(theta) * radius;
double longitude = destination.Lng + Math.Sin(theta) * radius;
PointLatLng cirlePoint = new PointLatLng(latitude, longitude);
radiusPoint.Add(cirlePoint);
}
GMapPolygon radiusCircle = new GMapPolygon(radiusPoint, "radius");
_polygonOverlay.Polygons.Add(radiusCircle);
}
private void CreateMarkers()
{
_polygonOverlay.Markers.Add(new GMarkerGoogle(new PointLatLng(xxx, xxx), GMarkerGoogleType.blue));
_polygonOverlay.Markers.Add(new GMarkerGoogle(new PointLatLng(xxx, xxx), GMarkerGoogleType.blue));
_polygonOverlay.Markers.Add(new GMarkerGoogle(new PointLatLng(xxx, xxx), GMarkerGoogleType.blue));
}
Here is a little sample of the code I have that create a circle (still needs some work on it) and some markers.
Already thanks is advance
Since you are dealing with a circle, you should be able to simply check the distance of your marker from the center of the circle. If the distance is greater than the radius, don't add it to the overlay.
GMap gives you access to the necessary methods to determine this information. Do something like this:
//Assuming p1 is your marker and p2 is your circle center coordinate
double markerDist = GMap.NET.MapProviders.EmptyProvider.Instance.Projection.GetDistance(p1.Position, p2);
if(markerDist <= circleRadius)
{
//Add the marker to the overlay
}
Assume you have a GMapPolygon with some Points, you could just use
bool inside = gMapPolygon.IsInside(point)
to check if the point of a GMarker is inside that GMapPolygon
I have a simple Processing Sketch, drawing a continuous line of ellipses with a 20px diameter. Is there a way to modify the sketch so that it draws vector shapes instead of pixels?
void setup() {
size(900, 900);
background(110, 255, 94);
}
void draw() {
ellipse(mouseX, mouseY, 20, 20);
fill(255);
}
Thanks to everyone who can provide some helpful advice.
Expanding my comment above, there a couple of things to tackle:
drawing a continuous line of ellipses with a 20px diameter
draws vector shapes
Currently you're drawing ellipses based on mouse movement.
A side effect is that if you move the mouse fast enough you will have gaps in between ellipses.
To fill the gaps you can work out the distance between every two ellipses.
If the distance is greater than the sizes of these two ellipses you can draw some in between.
The PVector class provides a lerp() function that allows you easily interpolate between two points.
You can read more on this and run some examples here
Using the ratio between these distance of two points and the ellipse size the number of points needed in between.
Here is an example that stores mouse locations to a list of PVectors as you drag the mouse:
//create an array list to store points to draw
ArrayList<PVector> path = new ArrayList<PVector>();
//size of each ellipse
float size = 20;
//how tight will the extra ellipses be drawn together
float tightness = 1.25;
void setup() {
size(900, 900);
}
void draw() {
background(110, 255, 94);
fill(255);
//for each point in the path, starting at 1 (not 0)
for(int i = 1; i < path.size(); i++){
//get a reference to the current and previous point
PVector current = path.get(i);
PVector previous = path.get(i-1);
//calculate the distance between them
float distance = previous.dist(current);
//work out how many points will need to be added in between the current and previous points to keep the path continuous (taking the ellipse size into account)
int extraPoints = (int)(round(distance/size * tightness));
//draw the previous point
ellipse(previous.x,previous.y,size,size);
//if there are any exta points to be added, compute and draw them:
for(int j = 0; j < extraPoints; j++){
//work out a normalized (between 0.0 and 1.0) value of where each extra point should be
//think of this as a percentage along a line: 0.0 = start of line, 0.5 = 50% along the line, 1.0 = end of the line
float interpolation = map(j,0,extraPoints,0.0,1.0);
//compute the point in between using PVector's linear interpolation (lerp()) functionality
PVector inbetween = PVector.lerp(previous,current,interpolation);
//draw the point in between
ellipse(inbetween.x,inbetween.y,size,size);
}
}
//draw instructions
fill(0);
text("SPACE = clear\nLEFT = decrease tightness\nRIGHT = increase tightness\ntightness:"+tightness,10,15);
}
void mouseDragged(){
path.add(new PVector(mouseX,mouseY));
}
void keyPressed(){
if(keyCode == LEFT) tightness = constrain(tightness-0.1,0.0,3.0);
if(keyCode == RIGHT) tightness = constrain(tightness+0.1,0.0,3.0);
if(key == ' ') path.clear();
}
Note that the interpolation between points is linear.
It's the simplest, but as the name implies, it's all about lines:
it always connects two points in a straight line, not curves.
I've added the option to control how tight interpolated ellipses will be packed together. Here are a couple of screenshots with different tightness levels. You'll notice as tightness increases, the lines will become more evident:
You run the code bellow:
//create an array list to store points to draw
var path = [];
//size of each ellipse
var ellipseSize = 20;
//how tight will the extra ellipses be drawn together
var tightness = 1.25;
function setup() {
createCanvas(900, 900);
}
function draw() {
background(110, 255, 94);
fill(255);
//for each point in the path, starting at 1 (not 0)
for(var i = 1; i < path.length; i++){
//get a reference to the current and previous point
var current = path[i];
var previous = path[i-1];
//calculate the distance between them
var distance = previous.dist(current);
//work out how many points will need to be added in between the current and previous points to keep the path continuous (taking the ellipse size into account)
var extraPoints = round(distance/ellipseSize * tightness);
//draw the previous point
ellipse(previous.x,previous.y,ellipseSize,ellipseSize);
//if there are any exta points to be added, compute and draw them:
for(var j = 0; j < extraPoints; j++){
//work out a normalized (between 0.0 and 1.0) value of where each extra point should be
//think of this as a percentage along a line: 0.0 = start of line, 0.5 = 50% along the line, 1.0 = end of the line
var interpolation = map(j,0,extraPoints,0.0,1.0);
//compute the point in between using PVector's linear interpolation (lerp()) functionality
var inbetween = p5.Vector.lerp(previous,current,interpolation);
//draw the point in between
ellipse(inbetween.x,inbetween.y,ellipseSize,ellipseSize);
}
}
//draw instructions
fill(0);
text("BACKSPACE = clear\n- = decrease tightness\n+ = increase tightness\ntightness:"+tightness,10,15);
}
function mouseDragged(){
path.push(createVector(mouseX,mouseY));
}
function keyPressed(){
if(keyCode == 189) tightness = constrain(tightness-0.1,0.0,3.0);
if(keyCode == 187) tightness = constrain(tightness+0.1,0.0,3.0);
if(keyCode == BACKSPACE) path = [];
}
//https://stackoverflow.com/questions/40673192/processing-draw-vector-instead-of-pixels
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.4/p5.min.js"></script>
If you want smoother lines you will need to use a different interpolation such as quadratic or cubic interpolation. You can start with existing Processing functions for drawing curves such as curve() or bezier(),and you'll find some helpful resources unrelated to Processing here,here and here.
On vector shapes
You're not directly working with pixels[], you're drawing shapes.
These shapes can easily be saved to PDF using Processing's PDF library
Check out the Single Frame from an Animation (With Screen Display) example.
Here is a version that saves to PDF when pressing the 's' key:
import processing.pdf.*;
//create an array list to store points to draw
ArrayList<PVector> path = new ArrayList<PVector>();
//size of each ellipse
float size = 20;
//how tight will the extra ellipses be drawn together
float tightness = 1.25;
//PDF saving
boolean record;
void setup() {
size(900, 900);
}
void draw() {
background(110, 255, 94);
fill(255);
//if we need to save the current frame to pdf, begin recording drawing instructions
if (record) {
// Note that #### will be replaced with the frame number. Fancy!
beginRecord(PDF, "frame-####.pdf");
}
//for each point in the path, starting at 1 (not 0)
for(int i = 1; i < path.size(); i++){
//get a reference to the current and previous point
PVector current = path.get(i);
PVector previous = path.get(i-1);
//calculate the distance between them
float distance = previous.dist(current);
//work out how many points will need to be added in between the current and previous points to keep the path continuous (taking the ellipse size into account)
int extraPoints = (int)(round(distance/size * tightness));
//draw the previous point
ellipse(previous.x,previous.y,size,size);
//if there are any exta points to be added, compute and draw them:
for(int j = 0; j < extraPoints; j++){
//work out a normalized (between 0.0 and 1.0) value of where each extra point should be
//think of this as a percentage along a line: 0.0 = start of line, 0.5 = 50% along the line, 1.0 = end of the line
float interpolation = map(j,0,extraPoints,0.0,1.0);
//compute the point in between using PVector's linear interpolation (lerp()) functionality
PVector inbetween = PVector.lerp(previous,current,interpolation);
//draw the point in between
ellipse(inbetween.x,inbetween.y,size,size);
}
}
//once what we want to save has been recorded to PDF, stop recording (this will skip saving the instructions text);
if (record) {
endRecord();
record = false;
println("pdf saved");
}
//draw instructions
fill(0);
text("SPACE = clear\nLEFT = decrease tightness\nRIGHT = increase tightness\ntightness:"+tightness+"\n's' = save PDF",10,15);
}
void mouseDragged(){
path.add(new PVector(mouseX,mouseY));
}
void keyPressed(){
if(keyCode == LEFT) tightness = constrain(tightness-0.1,0.0,3.0);
if(keyCode == RIGHT) tightness = constrain(tightness+0.1,0.0,3.0);
if(key == ' ') path.clear();
if(key == 's') record = true;
}
In addition to George's great answer (which I've +1'd), I wanted to offer a more basic option:
The problem, like George said, is that when you move the mouse, you actually skip over a bunch of pixels. So if you only draw ellipses or points at mouseX, mouseY then you'll end up with gaps.
The dumb fix: the pmouseX and pmouseY variables hold the previous position of the cursor.
That might not sound very useful, but they allow you to solve exactly your problem. Instead of drawing ellipses or points at the current mouse position, draw a line from the previous position to the current position. This will eliminate any gaps in your lines.
void draw(){
line(pmouseX, pmouseY, mouseX, mouseY);
}
Shameless self-promotion: I've written a tutorial on getting user input in Processing available here.
Note: This dumb solution will only work if you aren't redrawing the background every frame. If you need to redraw everything every frame, then George's answer is the way to go.
Similar questions to this have been asked a number of times here, but none of them seem to give me exactly what I want. I am working with the Bing Map control on Windows Phone and I'd like to add an ellipse that scales properly with zoom changes. This can be done with poly lines and polygons, but there is no ellipse type derived from MapShapeBase. I've tried various ways of doing it, but they require playing around with pixel sizes and fudging the math to make it line up with geo coordinates. I want to create an Ellipse with a center and x/y sizes in meters and have the framework do the rest. It seems so simple. Have I missed it somewhere? My other approach is to draw 365 line segments in a poly line, but that seems horribly ugly, and since the center can move, I'd need to bind the Location of every segment. That seems very heavy-weight. Any other thoughts?
[To be specific, I want to add a "GPS Accuracy" indicator as a circle around the current location.]
Update
In Mango, the phone automatically shows such a circle.
Orginal Post
It's fairly easy. You just use a Pushpin control to do the drawing with.
1) Add a MapLayer to your control:
<maps:MapLayer>
<maps:MapPolygon Fill="Gray"
IsHitTestVisible="False"
Locations="{Binding AccuracyLocationCollection}"
Opacity="0.6"
Stroke="Black"
StrokeThickness="2" />
</maps:MapLayer>
2) Add the AccuracyLocationCollection property in your ViewModel
public LocationCollection AccuracyLocationCollection
{
get;
set;
}
3) In the GeoCoordinateWatcher_PositionChanged event handler, calculate the size of the circle, and set the value to the AccuracyLocationCollection
ViewModel.AccuracyLocationCollection = DrawMapsCircle(e.Position.Location);
4) The code for the DrawMapsCircle goes like this:
private static double ToRadian(double degrees)
{
return degrees * (Math.PI / 180);
}
private static double ToDegrees(double radians)
{
return radians * (180 / Math.PI);
}
public static LocationCollection DrawMapsCircle(GeoCoordinate location)
{
double earthRadiusInMeters = 6367.0 * 1000.0;
var lat = ToRadian(location.Latitude);
var lng = ToRadian(location.Longitude);
var d = location.HorizontalAccuracy / earthRadiusInMeters;
var locations = new LocationCollection();
for (var x = 0; x <= 360; x++)
{
var brng = ToRadian(x);
var latRadians = Math.Asin(Math.Sin(lat) * Math.Cos(d) + Math.Cos(lat) * Math.Sin(d) * Math.Cos(brng));
var lngRadians = lng + Math.Atan2(Math.Sin(brng) * Math.Sin(d) * Math.Cos(lat), Math.Cos(d) - Math.Sin(lat) * Math.Sin(latRadians));
locations.Add(new Location()
{
Latitude = ToDegrees(latRadians),
Longitude = ToDegrees(lngRadians)
});
}
return locations;
}
Result: (This is next to my home, I can confirm there's about 3 meters between the roads the grey circle is displaying between)