I want to join two markers on my Google Map with a polyline. Here is my code :
mMap.addMarker(new MarkerOptions()
.position(new LatLng(0, 0))
.title("Pos")
.icon(BitmapDescriptorFactory.fromResource(R.drawable.point)));
mMap.addPolyline(new PolylineOptions()
.add(new LatLng(0,0), new LatLng(20,20))
.width(5)
.color(Color.rgb(255, 161, 74)));
The polyline works but with my custom marker, i have a margin between the line and the marker.
I would like to remove this margin. How can I do that ?
Thank you :)
The problem is that by default the anchor point for the marker is centered at the bottom of the image. If you looked closely at the locations of your custom markers, you would notice that they are not centered on the lat/long you set them to, but are just above the location you set.
if you set the anchor to 0.5, 0.5 you should get the desired affect.
Here is info from the document, which can also be found here
public void setAnchor (float anchorU, float anchorV)
Sets the anchor point for the marker.
The anchor specifies the point in the icon image that is anchored to the marker's position on the Earth's surface.
The anchor point is specified in the continuous space [0.0, 1.0] x [0.0, 1.0], where (0, 0) is the top-left corner of the image, and (1, 1) is the bottom-right corner. The anchoring point in a W x H image is the nearest discrete grid point in a (W + 1) x (H + 1) grid, obtained by scaling the then rounding. For example, in a 4 x 2 image, the anchor point (0.7, 0.6) resolves to the grid point at (3, 1).
*-----+-----+-----+-----*
| | | | |
| | | | |
+-----+-----+-----+-----+
| | | X | | (U, V) = (0.7, 0.6)
| | | | |
*-----+-----+-----+-----*
*-----+-----+-----+-----*
| | | | |
| | | | |
+-----+-----+-----X-----+ (X, Y) = (3, 1)
| | | | |
| | | | |
*-----+-----+-----+-----*
Parameters anchorU u-coordinate of the anchor, as a ratio of the image width (in the range [0, 1]) anchorV v-coordinate of the anchor, as a ratio of the image height (in the range [0, 1])