Align image to top of image

Question

I have an interactive map to display the position on the body. Clicking on an area will display an additional image indicating that the area has been clicked. It works for me, but the additional image does not align correctly with my map. To see the problem, I changed my mind to display all the images at once, instead of clicking on it.

<!--?xml version="1.0" encoding="utf-8"?-->
<RelativeLayout     
 xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:ctc="http://schemas.android.com/apk/res/com.example.sbar"
 android:id="@+id/my_frame"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent" >

 <com.example.sbar.ImageMap
    android:id="@+id/map"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:src="@drawable/sbar"
    ctc:map="sbar"/>

<ImageView
    android:id="@+id/l1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_alignBaseline="@id/map"
    android:src="@drawable/l1"
    android:visibility="visible" />

<ImageView
    android:id="@+id/r1" 
    android:layout_width="fill_parent"  
    android:layout_height="fill_parent"
    android:src="@drawable/r1"
    android:visibility="visible" />
</RelativeLayout>

The result is as follows: