Addmarker with anchor

[Peter Bell]

Hi 

i  like to add a marker to the map with an encoded image and set also the anchorU and anchorv

How do i do this.

i used this one to plot the markers on the map

public MapObject addMarker(EncodedImage icon, Coord location, String text, String longText, final ActionListener onClick)

but i cant change the anchors Jow can i do this?

[Shai Almog]

Hi,

just use a null anchor UI and show a custom UI in the click event e.g. using InteractionDialog or by adding a component to the map https://www.codenameone.com/blog/map-component-positioning-revisited.html

[Peter Bell]

Hi Shai

I dont understand your answer, what do you mean with a null anchorV

the problem which i have is that the icon of the marker isnt  with anchorv= 1 but anchorv= 0.5 this is strange because in the native code anchorV = 1f

when i combine a path with markers with icons  the lines are going through the middele of the icon. They should go through the bottom.

Op zaterdag 9 november 2019 03:55:21 UTC+1 schreef Shai Almog:

[Shai Almog]

Hi,

I don't follow that. Did you specify the anchor? Can you provide code/screenshots to illustrate?

[Peter Bell]

Oke see picture from the simulator

the line goes through the heart of the waypoint.  it must be going at the bottom of the icon when anchorV = 1; and anchorU = 0.5

to place a marker i used this code

     cnt.addMarker(EncodedImage.create("/maps-pin3.png"), positie , "Marker At","punt", new ActionListener() {

                  public void actionPerformed(ActionEvent evt) {

                  Dialog.show("Marker At", "Marker At" , "OK", null);

                 }

                 });

for the line i used this code  the track gets saved in tracklookup as Coord

   private void Trackplot(){

        

            int nr = tracklookup.size();

            if (nr > 1) {

             Coord []  pad = new Coord[ nr];

    for (int i = 0; i < nr; i++) {   

              

              

      pad[i] =tracklookup.get(i);

           } 

 

         if (    TrackPath != null   ) {

                   cnt.removeMapObject(TrackPath );

                           }

       TrackPath = cnt.addPath( pad);

            }

        }

Solution 1 would be to add anchorU and anchorV to the addMarkers

Solution 2 use Markeroptions but then i cant change the icon and the coordinates because there is markeroptions.icon of markeroptions.coord

Solution 3 use Addmarker((comp, coord, u, V)  but is less smooth than fiirst 1

Solution 4 i can use Maplayout but i have problem to set the container with the markers to transparancey setBGtransparency(0) doensnt work and i cannot change the anchor

Op maandag 11 november 2019 02:51:48 UTC+1 schreef Shai Almog:

[Shai Almog]

Try adding the anchor with a null image, maybe this is an issue with the image.

You can also use the MarkerOptions version of the addMarker API which lets you set an anchor point.

[Peter Bell]

i used de googlemapscn1lib from github   Maybe it is not shown correctly because i am not using a markers container

i tried different images  - png as jpeg - but they give the same view the track line goes through the middle of the icon

i used also a  button the same result

    

             cnt.addMarker(FButton,position, 0.5F, 1);

i tried  to get the anchor

Float U =  markeroptions.getAnchorU(); this gives a nullpointexception

 markeroptions.anchorV(1); this gives a nullpointexception

Op dinsdag 12 november 2019 03:24:46 UTC+1 schreef Shai Almog:

[Shai Almog]

Where did you get the marker options object from and what's the stack of the NullPointerException you got?

[Peter Bell]

i found the nullexception error  just a stupid but

still  i cant get the anchor good it still puts the anhcor (0.5f,0.5f)

i dont use a markers container, but put the markers on the mapobject cnt

Mapcontainer cnt = new Mapcontainer();

i used twee kind of codes to fix the anchor  without good result

1 with markeroptions

Encodeimage  pic1 = EncodedImage.create("/kano.jpg"));

MapContainer.MarkerOptions mo1 = new MapContainer.MarkerOptions(position, pic1)

                .anchor(0.5f, 1f)

                .text("Marker At")

                .longText("Marker At")   

                .onClick((evt) -> {

                   

                  Dialog.show("Marker At", "Marker At" , "OK", null);

                 });

               MyLocation =         cnt.addMarker(mo1);   

2  with  a scaleimagebutton

  ScaleImageButton       FButton = new ScaleImageButton ();

                FButton.setIcon(EncodedImage.create("/kano.jpg"));

                FButton.setBackgroundType(Style.BACKGROUND_IMAGE_SCALED_FILL);

                FButton.addActionListener((e) ->fillclick(Weergave));

          if (  FButton != null   ) {

                   //cnt.rremoveMapObject(FButton );

                   cnt.removeComponent(FButton );

                           }

      

           cnt.addMarker(FButton,position, 0.5f, 1);

Op woensdag 13 november 2019 03:18:12 UTC+1 schreef Shai Almog:

[Peter Bell]

i also tried the maplayout with a markers containers also here the anchor is wrong  it is in the top left corner (o,0)

the code i use is 

  MapContainer cnt1 = new MapContainer();

  Kaartdispl = new Form("Maps", new LayeredLayout());

       

        if(BrowserComponent.isNativeBrowserSupported()) {

         Kaartdispl.add(cnt1);

            markers.getAllStyles().setBgTransparency(0, true);

            markers.setLayout(new MapLayout(cnt1, markers));

            Kaartdispl.add(markers);

        } else {

            // iOS Screenshot process...

            Kaartdispl.add(new Label("Loading, please wait...."));

        }

      FButton = new ScaleImageButton ();

      FButton.setName("HP");

      String Lats = latlon(String.valueOf(position.getLatitude()));

                   String Lons = latlon(String.valueOf(position.getLongitude()));

                   String Weergave = "Positie ( " + String.valueOf(Lats)  + ", " + String.valueOf(Lons) + "} "; // + ")";_ 

    

                  Component C = findByName(markers, "HP");

                  

                       if (  C != null   ) {

                   //cnt.rremoveMapObject(FButton );

                markers.removeComponent(C );

                           }

                       

FButton.setIcon(EncodedImage.create("/maps-pin3.png"));

FButton.setBackgroundType(Style.BACKGROUND_IMAGE_SCALED_FILL);

FButton.addActionListener((e) ->fillclick(Weergave));

  markers.add(position, FButton);

[Shai Almog]

Is this behaving the same way in the simulator and the device?

[Peter Bell]

yes  same on the device LG4c

- when i use a markers container than on the device then the iocn is anchored in the left top corner 

- when i just use the mapcontainer  the the icon is anchored in the middle 

Op donderdag 14 november 2019 03:02:16 UTC+1 schreef Shai Almog:

[Shai Almog]

OK, assuming you're up to date with the latest cn1lib I suggest you file an issue. There might be a regression with anchor positioning.

You can file an issue here: https://github.com/codenameone/CodenameOne/issues/

[Peter Bell]

i found the mistake in my code. You have to set the vertical and horizontalalignment otherwise is the alignment zero.

 MapLayout.setHorizontalAlignment(Lbl1 , 0.5f);

 MapLayout.setVerticalAlignment(Lbl1 , 1f);

Second i changed  in the clsss Maplayout 

 public void layoutContainer the basic value to the values 0.5f and 1f as in the mapcontainer class

    Float h = (Float)current.getClientProperty(HORIZONTAL_ALIGNMENT);

                if(h == null) {

                    h = 0.5f;

                    

                }

                

                

                Float v = (Float)current.getClientProperty(VERTICAL_ALIGNMENT);

                if(v == null) {

                    v = 1f;

                }

And also in prIvate void nstallmarekrfor

 Float h = (Float)c.getClientProperty(HORIZONTAL_ALIGNMENT);

            if(h == null) {

               h = 0.5f;

            }

            

                 

            Float v = (Float)c.getClientProperty(VERTICAL_ALIGNMENT);

            if(v == null) {

                v = 1f;

            }

Op vrijdag 15 november 2019 04:01:30 UTC+1 schreef Shai Almog: