แสดงหมุดและวัตถุอื่นๆ บนแผนที่

การปักหมุดบนแผนที่

การปักหมุดบนแผนที่ ทำได้โดย สร้าง object ของ class Pin แล้วส่งให้ method Map.pushPin()

Pin pin = new Pin(new MapLocation(100,13),"http://map-test.longdo.com/api-mobile/android/document/v2/images/pin.png");
ldmap.pushPin(pin);

การเลือกรูปภาพของ Pin สามารถทำได้ 3 วิธีคือ

  1. ใช้ url ของรูปภาพ (ตัวอย่างด้านบน)
  2. ใช้ resource image
    Pin pin = new Pin(new MapLocation(100,13),mContext,R.drawable.pin_my_location);
  3. ใช้ Bitmap
    Bitmap bitmap = BitmapFactory.decodeResource(mContext.getResources(),R.drawable.pin_my_location);
    Pin pin = new Pin(new MapLocation(100,13),bitmap);

การตั้ง offset ของหมุด

ค่าเริ่มต้นของการแสดงหมุดบนแผนที่ ตำแหน่งอ้างอิงจะของหมุดอยู่ที่จุดตรงกลางของตัวหมุดเอง เช่น

Pin pin = new Pin(new MapLocation(100,13),"http://map-test.longdo.com/api-mobile/android/document/v2/images/pin.png");
ldmap.pushPin(pin);
ldmap.setLocation(pin.getLocation());

จากตัวอย่างด้านบนนี้ ความจริงแล้วจุดอ้างอิงของหมุดจะต้องอยู่บริเวณด้านล่างหมุดตรงปลายแหลมพอดี การเปลี่ยนตำแหน่งอ้างอิงทำได้โดยการกำหนด offset โดยกำหนดให้อยู่ระหว่าง 0 - 1 ซึ่งจะมีค่าเท่ากับ 0% - 100% ของความสูงหรือความกว้างของภาพ ตัวอย่างเช่น

เลื่อนจุดอ้างอิงลงมา 40%

Pin pin = new Pin(new MapLocation(100,13),"http://map-test.longdo.com/api-mobile/android/document/v2/images/pin.png");
pin.setOffset(new PointF(0f,-0.4f)); // set offset
ldmap.pushPin(pin);
ldmap.setLocation(pin.getLocation());

เลื่อนจุดอ้างอิงขึ้นไป 40%

Pin pin = new Pin(new MapLocation(100,13),"http://map-test.longdo.com/api-mobile/android/document/v2/images/pin.png");
pin.setOffset(new PointF(0f,0.4f)); // set offset
ldmap.pushPin(pin);
ldmap.setLocation(pin.getLocation());

การเลื่อนจุดอ้างอิงไปทางซ้ายและทางขวาใช้วิธีการคล้ายกันนี้ แต่เปลี่ยนเป็นตั้งค่า offset ที่ตัวแปรตัวแรก (ค่า x) ของ PointF เช่น

เลื่อนจุดอ้างอิงไปทางขวา 50%

pin.setOffset(new PointF(0.5f,0f)); // set offset

จุดสังเกต

จุดอ้างอิงของหมุดจะต้องไม่เปลี่ยนตำแหน่งเมื่อซูมเข้า/ออกแผนที่ บริเวณอื่นๆ ที่ไม่ใช้จุดอ้างอิง ตำแหน่งจะเปลี่ยนไปได้ คล้ายกับว่าไม่ได้ lock อยู่กับแผนที่

การขยับหมุด

แอพพลิเคชั่นสามารถขยับหมุดที่ปักไปแล้วโดยเรียกใช้ method Pin.setLocation()

pin.setLocation(new MapLocation(100.01,13.01));

การขยับหมุดแบบด้านบนจะไม่มี animation ของการเลื่อนหมุด หากต้องการ animation ให้ส่ง parameter อีกตัวให้ method Pin.setLocation()

pin.setLocation(new MapLocation(100.01,13.01),true);

สามารถกำหนดระยะเวลาของ animation ได้ด้วยการส่งเวลา (วินาที) เป็น double ไปด้วย

pin.setLocation(new MapLocation(100.01,13.01),true,2.5);

ตัวอย่างพิเศษ

หากต้องการ animation แบบพิเศษอื่นๆ สามารถใช้ Animator ของ Android เพื่อเรียกใช้ Pin.setLocation() แบบไม่มี animation ได้ เช่น

ValueAnimator animation = ValueAnimator.ofFloat(0f, 0.01f);
animation.setDuration(2000);
animation.setInterpolator(new DecelerateInterpolator());
animation.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
    @Override
    public void onAnimationUpdate(ValueAnimator animation) {
        pin.setLocation(new MapLocation(100 + (float)animation.getAnimatedValue(),13));
    }
});

animation.start();

วิธีนี้จะทำให้หมุดขยับด้วย interpolator แบบ DecelerateInterpolator (เริ่มเร็วจบช้า) ด้วยระยะเวลา 2 วินาที

Animation ของหมุด

หมุดที่ปักอยู่ สามารถมี Animation แบบต่างๆ ได้ เช่น เด้งขึ้นลงเรื่อยๆ หรือ หมุนเป็นวงกลมไปเรื่อยๆ วิธีการใส่ animation สามารถทำได้โดยเรียกใช้ method Pin.setAnimation() เช่น

pin.setAnimation(Pin.ANIMATION_BOUNCE);

Animation แบบอื่นๆ ที่สามารถเลือกใช้ได้ คือ

  1. ANIMATION_BOUNCE (ตัวอย่างด้านบน)
  2. ANIMATION_DROP
  3. ANIMATION_HAPPY
  4. ANIMATION_CLOCKWISE
  5. ANIMATION_COUNTERCLOCKWISE
  6. ANIMATION_ROTATE_BOUNCE
  7. ANIMATION_FADE_SCALE
  8. ANIMATION_SCALE_UP
  9. ANIMATION_NONE คือ ไม่มี animation (ค่าเริ่มต้น)
TODO: Popup

การวาดเส้นบนแผนที่

การวาดเส้นจะมีลักษณะการเรียกใช้งานคล้ายๆ การปักหมุด คือ สร้าง object ของ Line ขึ้นมา และส่งให้ method Map.addLine()

Line line = new Line(new MapLocation[]{
    new MapLocation(100.00,13.00),
    new MapLocation(100.01,13.01),
    new MapLocation(100.02,13.00)
});

ldmap.addLine(line);

แอพพลิเคชั่นสามารถกำหนดคุณสมบัตรต่างๆ ของเส้นได้ เช่น

line.setWidth(10); // default is 1
line.setColor(255,0,0,255); // Red

หรือเปลี่ยนพิกัดของเส้นได้ด้วย

line.setLocation(new MapLocation[]{
    new MapLocation(100.00,13.00),
    new MapLocation(100.01,13.01),
    new MapLocation(100.02,13.00),
    new MapLocation(100.00,13.00),
});

Polygon

    Polygon polygon = new Polygon(new MapLocation[]{
            new MapLocation(100,13),
            new MapLocation(101,14),
            new MapLocation(102,13)
    });
    polygon.setColor(255,255,0,255);
    ldmap.pushPolygon(polygon);

การสร้าง poluygon วงกลม อย่างง่าย

SDK มีตัวช่วยในการสร้าง Polygon โดยใช้คำสั่ง Map.createCirclePolygon() โดยส่งจุดศูนย์กลางและรัศมีไปด้วย เช่น

Polygon p = ldmap.createCirclePolygon(new MapLocation(100,13),5000);
p.setColor(80,80,200,128);
ldmap.pushPolygon(p);

กลับหน้าหลัก