Hình dạng

Chọn nền tảng: Android iOS JavaScript

Bản đồ có hình nhiều đường màu đỏ đồng nhất

API Google Maps dành cho Android cung cấp một số cách đơn giản để bạn thêm hình dạng vào bản đồ nhằm tuỳ chỉnh chúng cho ứng dụng của mình.

  • Polyline là một chuỗi các đoạn thẳng nối với nhau có thể tạo thành bất kỳ hình dạng nào bạn muốn và có thể dùng để đánh dấu các đường dẫn và tuyến đường trên bản đồ.
  • Polygon là một hình dạng khép kín có thể dùng để đánh dấu các khu vực trên bản đồ.
  • Circle là một phép chiếu chính xác theo địa lý của một vòng tròn trên bề mặt Trái đất được vẽ trên bản đồ.

Đối với tất cả các hình dạng này, bạn có thể tuỳ chỉnh giao diện của chúng bằng cách thay đổi một số thuộc tính.

Mã mẫu

Hướng dẫn thêm đa giác và hình nhiều đường để biểu thị các khu vực và tuyến đường bao gồm tất cả mã cho một ứng dụng Android đơn giản.

Ngoài ra, kho lưu trữ Apidemos trên GitHub bao gồm các mẫu minh hoạ cách sử dụng hình dạng và tính năng của các hình dạng đó:

  • Vòng tròndemoActivity (Java / Kotlin): Vòng kết nối
  • PolygondemoActivity (Java / Kotlin): Polygon
  • PolylinedemoActivity (Java / Kotlin): Polyline

Hình nhiều đường

Lớp Polyline xác định một tập hợp các đoạn đường được kết nối trên bản đồ. Đối tượng Polyline bao gồm một tập hợp các vị trí LatLng và tạo một loạt các phân đoạn đường kết nối các vị trí đó theo trình tự có thứ tự.

Video này đưa ra ý tưởng về cách giúp người dùng của bạn đến nơi họ muốn, bằng cách sử dụng hình nhiều đường để vẽ một đường dẫn trên bản đồ.

Để tạo Hình nhiều đường, trước tiên, hãy tạo một đối tượng PolylineOptions rồi thêm các điểm vào đối tượng đó. Các điểm đại diện cho một điểm trên bề mặt trái đất và được biểu thị dưới dạng đối tượng LatLng. Các phân đoạn đường kẻ được vẽ giữa các điểm theo thứ tự mà bạn thêm các điểm đó vào đối tượng PolylineOptions.

Để thêm các điểm vào đối tượng PolylineOptions, hãy gọi PolylineOptions.add(). Lưu ý rằng phương thức này lấy số lượng tham số có thể thay đổi để bạn có thể thêm nhiều điểm cùng một lúc (bạn cũng có thể gọi PolylineOptions.addAll(Iterable<LatLng>) nếu các điểm đó đã có trong danh sách).

Sau đó, bạn có thể thêm hình nhiều đường vào bản đồ bằng cách gọi GoogleMap.addPolyline(PolylineOptions). Phương thức này sẽ trả về một đối tượng Polyline mà sau này bạn có thể thay đổi hình nhiều đường.

Đoạn mã sau minh hoạ cách thêm một hình chữ nhật vào bản đồ:

Kotlin



// Instantiates a new Polyline object and adds points to define a rectangle
val polylineOptions = PolylineOptions()
    .add(LatLng(37.35, -122.0))
    .add(LatLng(37.45, -122.0)) // North of the previous point, but at the same longitude
    .add(LatLng(37.45, -122.2)) // Same latitude, and 30km to the west
    .add(LatLng(37.35, -122.2)) // Same longitude, and 16km to the south
    .add(LatLng(37.35, -122.0)) // Closes the polyline.

// Get back the mutable Polyline
val polyline = map.addPolyline(polylineOptions)

Java


// Instantiates a new Polyline object and adds points to define a rectangle
PolylineOptions polylineOptions = new PolylineOptions()
    .add(new LatLng(37.35, -122.0))
    .add(new LatLng(37.45, -122.0))  // North of the previous point, but at the same longitude
    .add(new LatLng(37.45, -122.2))  // Same latitude, and 30km to the west
    .add(new LatLng(37.35, -122.2))  // Same longitude, and 16km to the south
    .add(new LatLng(37.35, -122.0)); // Closes the polyline.

// Get back the mutable Polyline
Polyline polyline = map.addPolyline(polylineOptions);

Hình chữ nhật sẽ xuất hiện trên bản đồ như minh hoạ dưới đây:

Bản đồ có hình chữ nhật nhiều đường

Để thay đổi hình dạng của hình nhiều đường sau khi thêm, bạn có thể gọi Polyline.setPoints() và cung cấp danh sách các điểm mới cho hình nhiều đường đó.

Bạn có thể tuỳ chỉnh giao diện của hình nhiều đường cả trước khi thêm vào bản đồ và sau khi thêm vào bản đồ. Hãy xem phần tuỳ chỉnh giao diện bên dưới để biết thêm chi tiết.

Tuỳ chỉnh hình nhiều đường

Có một số cách để tuỳ chỉnh hình thức của hình nhiều đường:

  • Hình nhiều đường nhiều màu đặt các đoạn hình nhiều đường thành các màu khác nhau.
  • Hình nhiều đường chuyển màu tô màu một hình nhiều đường bằng cách sử dụng độ dốc gồm hai màu.
  • Hình nhiều đường ngắt tạo kiểu cho một hình nhiều đường bằng cách sử dụng các bitmap lặp lại.

Để sử dụng Tuỳ chỉnh nhiều đường, bạn phải sử dụng SDK Maps dành cho Android phiên bản 18.1.0 trở lên và sử dụng SDK Maps mới nhất dành cho trình kết xuất Android.

Tạo một hình nhiều đường nhiều màu

Bản đồ có nhiều đường kẻ nhiều màu

Bạn có thể sử dụng span để tô màu riêng từng phân đoạn của một hình nhiều đường bằng cách tạo đối tượng StyleSpan và thêm các đối tượng đó vào PolylineOptions bằng phương thức addSpan() hoặc addSpans(). Theo mặc định, mỗi mục trong mảng sẽ đặt màu của phân đoạn hàng tương ứng. Ví dụ sau đây minh hoạ cách đặt màu cho phân đoạn để tạo một hình nhiều đường với các phân đoạn màu đỏ và màu xanh lục:

Kotlin



val line = map.addPolyline(
    PolylineOptions()
        .add(LatLng(47.6677146, -122.3470447), LatLng(47.6442757, -122.2814693))
        .addSpan(StyleSpan(Color.RED))
        .addSpan(StyleSpan(Color.GREEN))
)

Java


Polyline line = map.addPolyline(new PolylineOptions()
        .add(new LatLng(47.6677146,-122.3470447), new LatLng(47.6442757,-122.2814693))
        .addSpan(new StyleSpan(Color.RED))
        .addSpan(new StyleSpan(Color.GREEN)));

Tạo hình nhiều đường chuyển màu

Bản đồ có nhiều đường chuyển màu

Bạn có thể xác định độ dốc bằng cách chỉ định 2 số nguyên alpha-red-green-blue (ARGB) 32 bit, để chỉ định màu bắt đầu và màu kết thúc của nét vẽ. Đặt thuộc tính này trên đối tượng tuỳ chọn của hình dạng bằng cách gọi PolylineOptions.addSpan(). Ví dụ sau đây cho thấy cách tạo một hình nhiều đường chuyển màu từ màu đỏ sang màu vàng từ Sở thú Woodland Park đến Kirkland, WA.

Kotlin



val line = map.addPolyline(
    PolylineOptions()
        .add(LatLng(47.6677146, -122.3470447), LatLng(47.6442757, -122.2814693))
        .addSpan(
            StyleSpan(
                StrokeStyle.gradientBuilder(
                    Color.RED,
                    Color.YELLOW
                ).build()
            )
        )
)

Java


Polyline line = map.addPolyline(new PolylineOptions()
        .add(new LatLng(47.6677146,-122.3470447), new LatLng(47.6442757,-122.2814693))
        .addSpan(new StyleSpan(StrokeStyle.gradientBuilder(Color.RED, Color.YELLOW).build())));

Tạo một hình nhiều đường có dấu

Bản đồ có hình nhiều đường có dấu

Bạn có thể đặt giao diện của hình nhiều đường thành hoạ tiết bitmap lặp lại. Để thực hiện việc này, hãy tạo StampStyle của TextureStyle, sau đó đặt thuộc tính này trên đối tượng tuỳ chọn của hình dạng bằng cách gọi PolylineOptions.addSpan() như minh hoạ dưới đây:

Kotlin



val stampStyle =
    TextureStyle.newBuilder(BitmapDescriptorFactory.fromResource(R.drawable.walking_dot)).build()
val span = StyleSpan(StrokeStyle.colorBuilder(Color.RED).stamp(stampStyle).build())
map.addPolyline(
    PolylineOptions()
        .add(LatLng(47.6677146, -122.3470447), LatLng(47.6442757, -122.2814693))
        .addSpan(span)
)

Java


StampStyle stampStyle =
        TextureStyle.newBuilder(BitmapDescriptorFactory.fromResource(R.drawable.walking_dot)).build();
StyleSpan span = new StyleSpan(StrokeStyle.colorBuilder(Color.RED).stamp(stampStyle).build());
map.addPolyline(new PolylineOptions()
        .add(new LatLng(47.6677146,-122.3470447), new LatLng(47.6442757,-122.2814693))
        .addSpan(span));

Sự kiện hình nhiều đường

Theo mặc định, bạn không thể nhấp vào hình nhiều đường. Bạn có thể bật và tắt khả năng nhấp bằng cách gọi Polyline.setClickable(boolean).

Sử dụng OnPolylineClickListener để theo dõi các sự kiện nhấp chuột trên một hình nhiều đường có thể nhấp. Để thiết lập trình nghe này trên bản đồ, hãy gọi GoogleMap.setOnPolylineClickListener(OnPolylineClickListener). Khi người dùng nhấp vào một hình nhiều đường, bạn sẽ nhận được lệnh gọi lại onPolylineClick(Polyline).

Đa giác

Các đối tượng Polygon tương tự như đối tượng Polyline ở chỗ chúng bao gồm một chuỗi toạ độ theo trình tự. Tuy nhiên, thay vì có kết thúc mở, đa giác được thiết kế để xác định các vùng trong một vòng kín với phần bên trong được lấp đầy.

Bạn có thể thêm Polygon vào bản đồ theo cách tương tự như khi thêm Polyline. Trước tiên, hãy tạo một đối tượng PolygonOptions rồi thêm một số điểm vào đối tượng đó. Các điểm này sẽ tạo thành đường viền của đa giác. Sau đó, bạn thêm đa giác vào bản đồ bằng cách gọi GoogleMap.addPolygon(PolygonOptions). Thao tác này sẽ trả về đối tượng Polygon.

Đoạn mã sau đây thêm một hình chữ nhật vào bản đồ.

Kotlin



// Instantiates a new Polygon object and adds points to define a rectangle
val rectOptions = PolygonOptions()
    .add(
        LatLng(37.35, -122.0),
        LatLng(37.45, -122.0),
        LatLng(37.45, -122.2),
        LatLng(37.35, -122.2),
        LatLng(37.35, -122.0)
    )

// Get back the mutable Polygon
val polygon = map.addPolygon(rectOptions)

Java


// Instantiates a new Polygon object and adds points to define a rectangle
PolygonOptions polygonOptions = new PolygonOptions()
    .add(new LatLng(37.35, -122.0),
        new LatLng(37.45, -122.0),
        new LatLng(37.45, -122.2),
        new LatLng(37.35, -122.2),
        new LatLng(37.35, -122.0));

// Get back the mutable Polygon
Polygon polygon = map.addPolygon(polygonOptions);

Để thay đổi hình dạng của đa giác sau khi thêm, bạn có thể gọi Polygon.setPoints() và cung cấp danh sách các điểm mới cho đường viền của đa giác.

Bạn có thể tuỳ chỉnh giao diện của đa giác cả trước khi thêm vào bản đồ và sau khi đã thêm vào bản đồ. Hãy xem phần tuỳ chỉnh giao diện bên dưới để biết thêm chi tiết.

Tự động hoàn thành đa giác

Đa giác trong ví dụ trên bao gồm 5 toạ độ, nhưng lưu ý rằng các toạ độ đầu tiên và cuối cùng là cùng một vị trí, là vị trí xác định vòng lặp. Tuy nhiên, trong thực tế, vì đa giác xác định khu vực khép kín, nên bạn không cần xác định toạ độ cuối cùng này. Nếu toạ độ cuối cùng khác với toạ độ đầu tiên, API sẽ tự động "đóng" đa giác bằng cách thêm toạ độ đầu tiên ở cuối chuỗi toạ độ.

Hai đa giác bên dưới là tương đương và việc gọi polygon.getPoints() cho mỗi đa giác sẽ trả về cả 4 điểm.

Kotlin



val polygon1 = map.addPolygon(
    PolygonOptions()
        .add(
            LatLng(0.0, 0.0),
            LatLng(0.0, 5.0),
            LatLng(3.0, 5.0),
            LatLng(0.0, 0.0)
        )
        .strokeColor(Color.RED)
        .fillColor(Color.BLUE)
)
val polygon2 = map.addPolygon(
    PolygonOptions()
        .add(
            LatLng(0.0, 0.0),
            LatLng(0.0, 5.0),
            LatLng(3.0, 5.0)
        )
        .strokeColor(Color.RED)
        .fillColor(Color.BLUE)
)

Java


Polygon polygon1 = map.addPolygon(new PolygonOptions()
    .add(new LatLng(0, 0),
        new LatLng(0, 5),
        new LatLng(3, 5),
        new LatLng(0, 0))
    .strokeColor(Color.RED)
    .fillColor(Color.BLUE));

Polygon polygon2 = map.addPolygon(new PolygonOptions()
    .add(new LatLng(0, 0),
        new LatLng(0, 5),
        new LatLng(3, 5))
    .strokeColor(Color.RED)
    .fillColor(Color.BLUE));

Tạo đa giác rỗng

Bạn có thể kết hợp nhiều đường dẫn trong một đối tượng Polygon duy nhất để tạo các hình dạng phức tạp, chẳng hạn như vành đai tô màu nền, hoặc "bánh vòng" (nơi các khu vực đa giác xuất hiện bên trong đa giác dưới dạng "các hòn đảo"). Các hình dạng phức tạp luôn là sự kết hợp của nhiều đường dẫn đơn giản hơn.

Hai đường dẫn phải được xác định trong cùng một khu vực. Phần lớn hơn trong 2 vùng xác định vùng tô màu nền và là một đa giác đơn giản không có các tuỳ chọn bổ sung. Sau đó, truyền đường dẫn thứ hai đến phương thức addHole(). Khi đường dẫn thứ hai, nhỏ hơn nằm đầy đường dẫn lớn hơn, đường dẫn này sẽ trông như thể một phần của đa giác đã bị xoá. Nếu lỗ giao với đường viền của đa giác, thì đa giác sẽ được kết xuất mà không có bất kỳ màu nào.

Đoạn mã dưới đây sẽ tạo một hình chữ nhật duy nhất có lỗ hình chữ nhật nhỏ hơn.

Kotlin



val hole = listOf(
    LatLng(1.0, 1.0),
    LatLng(1.0, 2.0),
    LatLng(2.0, 2.0),
    LatLng(2.0, 1.0),
    LatLng(1.0, 1.0)
)
val hollowPolygon = map.addPolygon(
    PolygonOptions()
        .add(
            LatLng(0.0, 0.0),
            LatLng(0.0, 5.0),
            LatLng(3.0, 5.0),
            LatLng(3.0, 0.0),
            LatLng(0.0, 0.0)
        )
        .addHole(hole)
        .fillColor(Color.BLUE)
)

Java


List<LatLng> hole = Arrays.asList(new LatLng(1, 1),
    new LatLng(1, 2),
    new LatLng(2, 2),
    new LatLng(2, 1),
    new LatLng(1, 1));
Polygon hollowPolygon = map.addPolygon(new PolygonOptions()
    .add(new LatLng(0, 0),
        new LatLng(0, 5),
        new LatLng(3, 5),
        new LatLng(3, 0),
        new LatLng(0, 0))
    .addHole(hole)
    .fillColor(Color.BLUE));

Đa giác rỗng xuất hiện trên bản đồ như được hiển thị dưới đây:

Bản đồ có một hình nhiều đường hình chữ nhật rỗng

Sự kiện đa giác

Theo mặc định, đa giác không thể nhấp vào được. Bạn có thể bật và tắt khả năng nhấp bằng cách gọi Polygon.setClickable(boolean).

Sử dụng OnPolygonClickListener để theo dõi các sự kiện nhấp chuột trên một đa giác có thể nhấp. Để thiết lập trình nghe này trên bản đồ, hãy gọi GoogleMap.setOnPolygonClickListener(OnPolygonClickListener). Khi người dùng nhấp vào một đa giác, bạn sẽ nhận được một lệnh gọi lại onPolygonClick(Polygon).

Vòng tròn

Bản đồ có vòng tròn

Ngoài một lớp Polygon chung, API Maps cũng bao gồm các lớp cụ thể cho đối tượng Circle để đơn giản hoá việc xây dựng các lớp đó.

Để xây dựng một vòng tròn, bạn phải chỉ định hai thuộc tính sau:

  • center dưới dạng LatLng.
  • radius mét.

Sau đó, vòng tròn được định nghĩa là tập hợp tất cả các điểm trên bề mặt Trái đất, cách center đã cho radius mét. Do cách phép chiếu Mercator mà API Maps sử dụng để kết xuất một hình cầu trên một mặt phẳng, nên khi ở gần đường xích đạo, hình tròn này sẽ xuất hiện dưới dạng một hình tròn gần như hoàn hảo trên bản đồ và sẽ ngày càng trở nên không tròn (trên màn hình) khi hình tròn di chuyển ra khỏi đường xích đạo.

Để thay đổi hình dạng của vòng tròn sau khi thêm vào, bạn có thể gọi Circle.setRadius() hoặc Circle.setCenter() và cung cấp các giá trị mới.

Bạn có thể tùy chỉnh giao diện của vòng tròn cả trước khi thêm vào bản đồ và sau khi nó đã được thêm vào bản đồ. Hãy xem phần tuỳ chỉnh giao diện bên dưới để biết thêm chi tiết.

Đoạn mã sau đây thêm một vòng tròn vào bản đồ bằng cách tạo đối tượng CircleOptions và gọi GoogleMap.addCircle(CircleOptions):

Kotlin



// Instantiates a new CircleOptions object and defines the center and radius
val circleOptions = CircleOptions()
    .center(LatLng(37.4, -122.1))
    .radius(1000.0) // In meters

// Get back the mutable Circle
val circle = map.addCircle(circleOptions)

Java


// Instantiates a new CircleOptions object and defines the center and radius
CircleOptions circleOptions = new CircleOptions()
    .center(new LatLng(37.4, -122.1))
    .radius(1000); // In meters

// Get back the mutable Circle
Circle circle = map.addCircle(circleOptions);

Sự kiện vòng kết nối

Theo mặc định, các vòng kết nối không thể nhấp vào được. Bạn có thể bật và tắt khả năng nhấp bằng cách gọi GoogleMap.addCircle() bằng CircleOptions.clickable(boolean) hoặc gọi Circle.setClickable(boolean).

Sử dụng OnCircleClickListener để theo dõi các sự kiện nhấp chuột trên một vòng tròn có thể nhấp. Để thiết lập trình nghe này trên bản đồ, hãy gọi GoogleMap.setOnCircleClickListener(OnCircleClickListener).

Khi người dùng nhấp vào một vòng tròn, bạn sẽ nhận được lệnh gọi lại onCircleClick(Circle), như trong mã mẫu sau:

Kotlin



val circle = map.addCircle(
    CircleOptions()
        .center(LatLng(37.4, -122.1))
        .radius(1000.0)
        .strokeWidth(10f)
        .strokeColor(Color.GREEN)
        .fillColor(Color.argb(128, 255, 0, 0))
        .clickable(true)
)
map.setOnCircleClickListener {
    // Flip the r, g and b components of the circle's stroke color.
    val strokeColor = it.strokeColor xor 0x00ffffff
    it.strokeColor = strokeColor
}

Java


Circle circle = map.addCircle(new CircleOptions()
    .center(new LatLng(37.4, -122.1))
    .radius(1000)
    .strokeWidth(10)
    .strokeColor(Color.GREEN)
    .fillColor(Color.argb(128, 255, 0, 0))
    .clickable(true));

map.setOnCircleClickListener(new GoogleMap.OnCircleClickListener() {
    @Override
    public void onCircleClick(Circle circle) {
        // Flip the r, g and b components of the circle's stroke color.
        int strokeColor = circle.getStrokeColor() ^ 0x00ffffff;
        circle.setStrokeColor(strokeColor);
    }
});

Tuỳ chỉnh giao diện

Bạn có thể thay đổi giao diện của một hình dạng cả trước khi hình đó được thêm vào bản đồ (bằng cách chỉ định thuộc tính mong muốn trên đối tượng tuỳ chọn) hoặc sau khi hình dạng đó được thêm vào bản đồ. Phương thức getter cũng hiển thị cho mọi thuộc tính để bạn có thể dễ dàng truy cập vào trạng thái hiện tại của hình dạng.

Đoạn mã sau đây thêm một đường nhiều màu xanh dương đậm với các đoạn trắc địa từ Melbourne đến Perth. Các phần dưới đây sẽ giải thích chi tiết hơn về các thuộc tính này.

Kotlin



val polyline = map.addPolyline(
    PolylineOptions()
        .add(LatLng(-37.81319, 144.96298), LatLng(-31.95285, 115.85734))
        .width(25f)
        .color(Color.BLUE)
        .geodesic(true)
)

Java


Polyline polyline = map.addPolyline(new PolylineOptions()
    .add(new LatLng(-37.81319, 144.96298), new LatLng(-31.95285, 115.85734))
    .width(25)
    .color(Color.BLUE)
    .geodesic(true));

Bản đồ xuất hiện như dưới đây:

Bản đồ có hình nhiều đường từ Melbourne đến Perth

Lưu ý: Mặc dù có thể áp dụng hầu hết các giá trị này cho mọi hình dạng được mô tả, nhưng một số thuộc tính có thể không phù hợp với một số hình dạng nhất định (ví dụ: Hình nhiều đường không thể có màu nền vì hình nhiều đường không có phần bên trong).

Màu nét

Màu nét vẽ là một số nguyên alpha-red-green-blue (ARGB) 32 bit chỉ định độ mờ và màu của nét vẽ trên hình dạng. Đặt thuộc tính này trên đối tượng tuỳ chọn của hình dạng bằng cách gọi *Options.strokeColor() (hoặc PolylineOptions.color() trong trường hợp hình nhiều đường). Nếu không chỉ định, màu nét vẽ mặc định sẽ là đen (Color.BLACK).

Sau khi hình dạng được thêm vào bản đồ, bạn có thể truy cập màu nét vẽ bằng cách gọi getStrokeColor() (hoặc getColor() cho hình nhiều đường) và có thể thay đổi bằng cách gọi setStrokeColor() (setColor() for a polyline).

Màu nền

Màu nền chỉ áp dụng cho đa giác và hình tròn. Chế độ này không áp dụng cho hình nhiều đường vì các đường này không có bên trong được xác định. Đối với một đa giác, các vùng bên trong lỗ của nó không phải là một phần của bên trong đa giác và sẽ không được tô màu nếu màu tô được đặt.

Màu nền là một số nguyên alpha-red-green-blue (ARGB) 32 bit chỉ định độ mờ và màu sắc bên trong hình dạng. Đặt thuộc tính này trên đối tượng tuỳ chọn của hình dạng bằng cách gọi *Options.fillColor(). Nếu không chỉ định, màu nét vẽ mặc định sẽ là trong suốt (Color.TRANSPARENT).

Sau khi hình dạng được thêm vào bản đồ, bạn có thể truy cập màu nền bằng cách gọi getFillColor() và có thể thay đổi bằng cách gọi setFillColor().

Độ rộng nét

Chiều rộng của nét vẽ, dưới dạng số thực tính bằng pixel (px). Chiều rộng không chuyển tỷ lệ khi bản đồ được thu phóng (nghĩa là hình dạng sẽ có cùng độ rộng nét vẽ ở mọi mức thu phóng). Đặt thuộc tính này trên đối tượng tuỳ chọn của hình dạng bằng cách gọi *Options.strokeWidth() (hoặc PolylineOptions.width() cho hình nhiều đường). Nếu không chỉ định thì nét vẽ mặc định có là 10 pixel.

Sau khi hình dạng được thêm vào bản đồ, bạn có thể truy cập chiều rộng nét vẽ bằng cách gọi getStrokeWidth() (hoặc getWidth() đối với hình nhiều đường) và có thể thay đổi bằng cách gọi setStrokeWidth() (setWidth() for a polyline).

Mẫu nét

Mẫu nét mặc định là một đường liền nét cho hình nhiều đường và đường viền của đa giác và đường tròn. Bạn có thể chỉ định một mẫu nét vẽ tuỳ chỉnh của các đối tượng PatternItem, trong đó mỗi mục là một dấu gạch ngang, một dấu chấm hoặc một khoảng trống.

Mẫu sau đây đặt mẫu cho hình nhiều đường thành một chuỗi lặp lại của một dấu chấm, theo sau là một khoảng trống có độ dài 20 pixel, một dấu gạch ngang có độ dài 30 pixel và một khoảng trống khác 20 pixel.

Kotlin



val pattern = listOf(
    Dot(), Gap(20F), Dash(30F), Gap(20F)
)
polyline.pattern = pattern

Java


List<PatternItem> pattern = Arrays.asList(
    new Dot(), new Gap(20), new Dash(30), new Gap(20));
polyline.setPattern(pattern);

Mẫu lặp lại dọc theo đường, bắt đầu với mục mẫu đầu tiên ở đỉnh đầu tiên được chỉ định cho hình dạng.

Các loại khớp

Đối với hình nhiều đường và đường viền của đa giác, bạn có thể chỉ định một JointType dạng góc xiên hoặc tròn để thay thế loại khớp nối cố định mặc định.

Mẫu sau đây áp dụng loại khớp tròn cho hình nhiều đường:

Kotlin



polyline.jointType = JointType.ROUND

Java


polyline.setJointType(JointType.ROUND);

Loại khớp ảnh hưởng đến các đường cong bên trong của đường. Nếu đường kẻ có nét gạch bao gồm dấu gạch ngang, thì loại khớp cũng áp dụng khi dấu gạch ngang nằm trên một khớp. Các kiểu khớp không ảnh hưởng đến các dấu chấm, vì chúng luôn là hình tròn.

Giới hạn dòng

Bạn có thể chỉ định kiểu Cap cho mỗi đầu của một hình nhiều đường. Các tuỳ chọn là mông (mặc định), hình vuông, hình tròn hoặc bitmap tuỳ chỉnh. Đặt kiểu trong PolylineOptions.startCap và PolylineOptions.endCap hoặc sử dụng các phương thức getter và setter thích hợp.

Đoạn mã sau đây chỉ định một hình mũ tròn ở đầu hình nhiều đường.

Kotlin



polyline.startCap = RoundCap()

Java


polyline.setStartCap(new RoundCap());

Đoạn mã sau đây chỉ định một bitmap tuỳ chỉnh cho hình tĩnh:

Kotlin



polyline.endCap = CustomCap(BitmapDescriptorFactory.fromResource(R.drawable.arrow), 16F)

Java


polyline.setEndCap(
    new CustomCap(BitmapDescriptorFactory.fromResource(R.drawable.arrow), 16));

Khi sử dụng bitmap tuỳ chỉnh, bạn nên chỉ định độ rộng nét vẽ tham chiếu tính bằng pixel. API này điều chỉnh bitmap theo tỷ lệ cho phù hợp. Chiều rộng nét vẽ tham chiếu là chiều rộng nét mà bạn sử dụng khi thiết kế hình ảnh bitmap cho giới hạn, ở kích thước ban đầu của hình ảnh. Độ rộng nét vẽ tham chiếu mặc định là 10 pixel. Gợi ý: Để xác định chiều rộng của nét vẽ tham chiếu, hãy mở hình ảnh bitmap ở mức phóng to 100% trong trình chỉnh sửa hình ảnh và vẽ biểu đồ chiều rộng mong muốn của nét vẽ đường thẳng liên quan đến hình ảnh.

Nếu bạn dùng BitmapDescriptorFactory.fromResource() để tạo bitmap, hãy đảm bảo rằng bạn sử dụng tài nguyên không phụ thuộc vào mật độ (nodpi).

Đoạn trắc địa

Chế độ cài đặt trắc địa chỉ áp dụng cho hình nhiều đường và đa giác. Định nghĩa này không áp dụng cho các vòng kết nối vì chúng không được xác định là một tập hợp các phân đoạn.

Chế độ cài đặt trắc địa xác định cách vẽ các đoạn đường giữa các đỉnh liên tiếp của hình nhiều đường/đa giác. Đoạn trắc địa là các đoạn đi theo đường đi ngắn nhất dọc theo bề mặt Trái đất (một hình cầu) và thường xuất hiện dưới dạng các đường cong trên bản đồ có phép chiếu hàm Mercator. Các đoạn không có đường trắc địa sẽ được vẽ dưới dạng các đường thẳng trên bản đồ.

Đặt thuộc tính này trên đối tượng tuỳ chọn của hình dạng bằng cách gọi *Options.geodesic(), trong đó true biểu thị các đoạn cần được vẽ dưới dạng đường trắc địa và false biểu thị các đoạn được vẽ dưới dạng đường thẳng. Nếu không chỉ định, giá trị mặc định sẽ là đoạn không trắc địa (false).

Sau khi hình dạng được thêm vào bản đồ, bạn có thể truy cập chế độ cài đặt trắc địa bằng cách gọi isGeodesic() và có thể thay đổi bằng cách gọi setGeodesic().

Chỉ mục Z

Chỉ mục z chỉ định thứ tự ngăn xếp của hình dạng này, so với các lớp phủ khác (các hình dạng khác, lớp phủ trên mặt đất và lớp phủ xếp kề) trên bản đồ. Lớp phủ có chỉ mục z cao được vẽ bên trên lớp phủ có chỉ mục z thấp hơn. Hai lớp phủ có cùng chỉ mục z được vẽ theo thứ tự tuỳ ý.

Lưu ý rằng điểm đánh dấu luôn được vẽ phía trên các lớp phủ khác, bất kể chỉ mục z của các lớp phủ khác.

Đặt thuộc tính này trên đối tượng tuỳ chọn của hình dạng bằng cách gọi *Options.zIndex(). Nếu không chỉ định, chỉ mục z mặc định sẽ là 0. Sau khi hình dạng được thêm vào bản đồ, chỉ mục z có thể được truy cập bằng cách gọi getZIndex() và có thể được thay đổi bằng cách gọi setZIndex().

Chế độ hiển thị

Chế độ hiển thị sẽ chỉ định liệu hình dạng có được vẽ trên bản đồ hay không, trong đó true cho biết nên vẽ và false cho biết không nên vẽ. Tính năng này cho phép bạn tạm thời không hiển thị một hình dạng trên bản đồ. Để xoá vĩnh viễn hình dạng khỏi bản đồ, hãy gọi remove() trên hình dạng đó.

Đặt thuộc tính này trên đối tượng tuỳ chọn của hình dạng bằng cách gọi *Options.visible(). Nếu không chỉ định thì chế độ hiển thị mặc định sẽ là true. Sau khi hình dạng được thêm vào bản đồ, bạn có thể truy cập chế độ hiển thị bằng cách gọi isVisible() và có thể thay đổi bằng cách gọi setVisible().

Liên kết dữ liệu với một hình dạng

Bạn có thể lưu trữ một đối tượng dữ liệu tuỳ ý bằng hình nhiều đường, đa giác hoặc hình tròn bằng cách sử dụng phương thức setTag() của hình dạng và truy xuất đối tượng bằng getTag(). Ví dụ: gọi Polyline.setTag() để lưu trữ đối tượng dữ liệu có hình nhiều đường và gọi Polyline.getTag() để truy xuất đối tượng dữ liệu.

Đoạn mã dưới đây xác định một thẻ tùy ý (A) cho hình nhiều đường được chỉ định:

Kotlin



val polyline = map.addPolyline(
    PolylineOptions()
        .clickable(true)
        .add(
            LatLng(-35.016, 143.321),
            LatLng(-34.747, 145.592),
            LatLng(-34.364, 147.891),
            LatLng(-33.501, 150.217),
            LatLng(-32.306, 149.248),
            LatLng(-32.491, 147.309)
        )
)
polyline.tag = "A"

Java


Polyline polyline = map.addPolyline((new PolylineOptions())
    .clickable(true)
    .add(new LatLng(-35.016, 143.321),
        new LatLng(-34.747, 145.592),
        new LatLng(-34.364, 147.891),
        new LatLng(-33.501, 150.217),
        new LatLng(-32.306, 149.248),
        new LatLng(-32.491, 147.309)));

polyline.setTag("A");

Dưới đây là một số ví dụ về các trường hợp bạn nên lưu trữ và truy xuất dữ liệu có hình dạng:

  • Ứng dụng của bạn có thể phù hợp với các loại hình dạng khác nhau và bạn muốn xử lý các hình dạng đó theo cách khác khi người dùng nhấp vào.
  • Bạn có thể giao tiếp với một hệ thống có giá trị nhận dạng bản ghi duy nhất, trong đó các hình dạng đại diện cho các bản ghi cụ thể trong hệ thống đó.
  • Dữ liệu hình dạng có thể cho biết mức độ ưu tiên để xác định chỉ mục z cho hình dạng.