Add texts in markers using unfolding maps?

Processing Libraries
1

Hi, I was wondering, how to do this. The following is what I have tried so far.

import de.fhpotsdam.unfolding.*;
import de.fhpotsdam.unfolding.geo.*;
import de.fhpotsdam.unfolding.utils.*;
import de.fhpotsdam.unfolding.marker.SimplePointMarker;

float x = 53.25; 
float y = -6.26;

Location location = new Location(x,y);
SimplePointMarker marker = new SimplePointMarker(location);

UnfoldingMap map;

void setup() {
  size(1000,1000,P2D);
  map = new UnfoldingMap(this);
  MapUtils.createDefaultEventDispatcher(this,map);
  
}

void draw(){
    
    Location location = new Location(x,y);
    SimplePointMarker marker = new SimplePointMarker(location);
    marker.setColor(color(255,0,0,100)); 
    marker.setRadius(6);
    //marker.strokeColor(0,255,0);
    
    ScreenPosition m = marker.getScreenPosition(map);
    
    
    text("DR", m.x, m.y);
    map.addMarkers(marker);
    map.draw();
    
    for (int i=0; i<100; i++){
      x = x + 0.0001;
      y = y + 0.0001; 
    } 
   map.getMarkerManager(0).removeMarker(marker);
  
}
1 Like
2

There doesn‘t seem to be a built in method to do this, but you can do the following :

marker.setProperties(new HashMap<String, Object> ());
marker.setProperty(new String(„Text“), new String(„TextForMyLocation“));

This would set a property „Text“ that you could use to display the text… as for really displaying it, that‘s a bit harder…

This should work :

public class SimpleTextPointMarker extends AbstractMarker {

	protected float diameter = 20f;

	/**
	 * Creates an empty point marker. Used internally by the MarkerFactory.
	 */
	public SimplePointMarker() {
		this(null, null);
	}

	/**
	 * Creates a point marker for the given location.
	 * 
	 * @param location
	 *            The location of this Marker.
	 */
	public SimplePointMarker(Location location) {
		this(location, null);
	}

	/**
	 * Creates a point marker for the given location and properties.
	 * 
	 * @param location
	 *            The location of this Marker.
	 * @param properties
	 *            Some data properties for this marker.
	 */
	public SimplePointMarker(Location location, HashMap<String, Object> properties) {
		super(location, properties);
	}

	/**
	 * Draws this point marker as circle in the defined style. If no style has been set, Unfolding's default one is
	 * used.
	 */
	@Override
	public void draw(PGraphics pg, float x, float y) {
		if (isHidden())
			return;

		pg.pushStyle();
		pg.strokeWeight(strokeWeight);
		if (isSelected()) {
			pg.fill(highlightColor);
			pg.stroke(highlightStrokeColor);
		} else {
			pg.fill(color);
			pg.stroke(strokeColor);
		}
		pg.ellipse((int) x, (int) y, diameter, diameter);
                




if (this.getStringProperty(„TextWeight“) != null)
pg.strokeWeight(this.getStringProperty(„TextWeight“);
if (this.getStringProperty(„TextStroke“) != null) 
pg.stroke(this.getStringProperty(„TextStroke“);
if (this.getStringProperty(„Text“) != null)
pg.text(this.getStringProperty(„Text“), (int) x, (int) y-diameter/2);




		pg.popStyle();
	}

	@Override
	public boolean isInside(float checkX, float checkY, float x, float y) {
		PVector pos = new PVector(x, y);
		return pos.dist(new PVector(checkX, checkY)) < diameter / 2;
	}

	/**
	 * Sets the radius of this marker. Used for the displayed ellipse and hit test.
	 * 
	 * @param radius The radius of the circle in pixel.
	 * @deprecated Fixed behavior! (value was wrongly used as diameter). Use {@link #setDiameter(float)} instead. 
	 */
	public void setRadius(float radius) {
		this.diameter = radius * 2;
	}
	
	/**
	 * Sets the diameter of this marker. Used for the displayed ellipse and hit test.
	 * 
	 * @param diameter The diameter of the circle in pixel.
	 */
	public void setDiameter(float diameter) {
		this.diameter = diameter;
	}

}

I spaced out the important part, so you should see it. If you can think of additional properties, you can add them like that. (If you want things to be drawn, like Text, or changing the shape of the marker or stuff…)

Also, Note that this is a new class, so you have to replace your current SimplePointMarker class variables with this one. All the other Code should still work though. Hope this help :wink:

1 Like
3

Check out the LabeledMarkerApp in the examples (of the Processing library), or the examples under marker/labelmarker in the Eclipse distribution (see https://github.com/tillnagel/unfolding/tree/master/examples/de/fhpotsdam/unfolding/examples/marker/labelmarker)

If you only want to display text at geo-positions without using markers you could also use getScreenPosition are draw it yourself.

import de.fhpotsdam.unfolding.*;
import de.fhpotsdam.unfolding.geo.*;
import de.fhpotsdam.unfolding.utils.*;

UnfoldingMap map;

Location location = new Location(53.25, -6.26);
String label = "You are here";

void setup() {
  size(800, 600, P2D);

  map = new UnfoldingMap(this);
  map.zoomAndPanTo(3, new Location(53.25, -6.26));
  MapUtils.createDefaultEventDispatcher(this, map);
}

void draw() {
  map.draw();
  
  ScreenPosition pos = map.getScreenPosition(location);
  fill(0);
  text(label, pos.x, pos.y);
}

(Thanks @Lexyth for all your great responses to questions re Unfolding!)

2 Likes
4

Didn‘t know there was a Labeled marker :sweat_smile: Maybe i should‘ve taken a look at the examples… But it‘s pretty much exactly the same as what i did.

Though i like my version more, having that all as properties makes more sense in my opinion. :wink:

2 Likes