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 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 hình dạng cho ứng dụng của mình.

  • Polyline là một loạt các đoạn đường thẳng được kết 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 kèm theo có thể dùng để đánh dấu các khu vực trên bản đồ.
  • Circle là phép chiếu hình tròn chính xác về mặt địa lý 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 về cách thêm đa giác và đa tuyến để 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 mẫu minh hoạ cách sử dụng các hình dạng và các đặc điểm của chúng:

Hình nhiều đường

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

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

Để tạo một Polyline, 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 biểu thị 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 đoạn thẳng được vẽ giữa các điểm theo thứ tự bạn thêm các điểm đó vào đối tượng PolylineOptions.

Để thêm điểm vào đối tượng PolylineOptions, hãy gọi PolylineOptions.add(). Xin lưu ý rằng phương thức này lấy một số tham số biến đổ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à bạn có thể dùng để thay đổi đa tuyến sau này.

Đoạn mã sau đây minh hoạ cách thêm 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 này sẽ xuất hiện trên bản đồ như minh hoạ dưới đây:

Bản đồ có đa tuyến hình chữ nhật

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

Bạn có thể tuỳ chỉnh hình thức của hình nhiều đường trước khi thêm vào bản đồ và sau khi đượ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.

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 nhiều màu.
  • 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 của hai màu.
  • Đường đa giác được đóng dấu tạo kiểu cho đường đa giác bằng cách sử dụng bitmap lặp lại.

Để sử dụng Tùy chỉnh nhiều đường, bạn phải sử dụng 18.1.0 trở lên của SDK Maps dành cho Android và sử dụng SDK Maps mới nhất dành cho trình kết xuất đồ hoạ Android.

Tạo một đa giác nhiều màu

Bản đồ có đa tuyến nhiều màu

Bạn có thể sử dụng span để tô màu từng đoạn của một hình nhiều đường bằng cách tạo Các đối tượng StyleSpan và thêm các đối tượng đó vào PolylineOptions bằng addSpan() hoặc addSpans(). Theo mặc định, mỗi mục trong mảng sẽ đặt màu của đoạn đường tương ứng. Ví dụ sau đây cho thấy cách thiết lập màu phân đoạn để tạo một đa tuyến có các phân đoạn màu đỏ và 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ó hình nhiều đường chuyển màu

Bạn có thể xác định một hiệu ứng chuyển màu bằng cách chỉ định hai số nguyên alpha-red-green-blue (ARGB) 32 bit để chỉ định màu bắt đầu và 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 minh hoạ việc tạo một hình nhiều đường chuyển màu từ đỏ sang vàng từ Vườn 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 đường đa tuyến có dấu

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

Bạn có thể đặt giao diện của một đường đa tuyến thành hoạ tiết bitmap lặp lại. Việc cần làm thực hiện thao tác này, hãy tạo một StampStyle trên TextureStyle, sau đó đặt thuộc tính này trên 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 các đường đa tuyến. Bạn có thể bật và tắt tính năng nhấp bằng cách gọi Polyline.setClickable(boolean).

Sử dụng OnPolylineClickListener để nghe các sự kiện nhấp chuột trên một hình nhiều đường có thể nhấp. Để đặt 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 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ư các đối tượng Polyline ở chỗ chúng bao gồm một loạt toạ độ theo trình tự có thứ tự. Tuy nhiên, thay vì mở, đa giác được thiết kế để xác định các vùng trong một vòng lặp 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 và 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ề một đố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 vào, bạn có thể gọi Polygon.setPoints() và cung cấp một danh sách điểm mới cho đề cương của đa giác.

Bạn có thể tuỳ chỉnh giao diện của đa giác cả trước và sau khi thêm đa giác 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 toạ độ đầu tiên và toạ độ cuối cùng ở cùng một vị trí, toạ độ này xác định vòng lặp. Tuy nhiên, trong thực tế, vì đa giác xác định các khu vực 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 vào cuối trình tự toạ độ.

Hai đa giác dưới đây tương đương nhau 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 để tạo các hình dạng phức tạp, chẳng hạn như "vòng tròn lấp lánh" hoặc "bánh vòng" (trong đó hình đa giác các khu vực xuất hiện bên trong đa giác dưới dạng "ốc đảo"). Các hình dạng phức tạp luôn là thành phần 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. Khu vực lớn hơn xác định khu vực tô màu nền và là một đa giác đơn giản không có tuỳ chọn bổ sung. Sau đó, truyền đường dẫn thứ hai đến phương thức addHole(). Khi thứ hai, nhỏ hơn đường dẫn này được bao quanh toàn bộ bởi đường dẫn lớn hơn, nó sẽ xuất hiện như thể một đoạn của đa giác đã bị xoá. Nếu lỗ giao nhau 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ỳ phần lấp đầy nào.

Đoạn mã dưới đây sẽ tạo một hình chữ nhật duy nhất có một 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));

Hình đa giác rỗng xuất hiện trên bản đồ như sau:

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, bạn không thể nhấp vào đa giác. Bạn có thể bật và tắt tính năng nhấp bằng cách gọi Polygon.setClickable(boolean).

Sử dụng OnPolygonClickListener để nghe 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 đồ, 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 Lệnh gọi lại onPolygonClick(Polygon).

Vòng tròn

Bản đồ với một vòng tròn

Ngoài 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 tạo đối tượng.

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

  • center trong vai trò LatLng.
  • radius theo mét.

Khi đó, một đườ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 sẵn radius mét. Do cách chiếu Mercator mà API Maps sử dụng để kết xuất hình cầu trên một bề mặt phẳng, hình cầu này sẽ xuất hiện dưới dạng một vòng tròn gần như hoàn hảo trên bản đồ khi nằm gần đường xích đạo và sẽ xuất hiện ngày càng không tròn (trên màn hình) khi vòng 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, 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ể tuỳ chỉnh giao diện của vòng tròn cả trước và sau khi thêm vòng tròn vào bản đồ. Xem phần này trê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 một vòng tròn Đố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 trong vòng kết nối

Theo mặc định, bạn không thể nhấp vào vòng kết nối. 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 bằng cách gọi Circle.setClickable(boolean).

Sử dụng OnCircleClickListener để nghe 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 đồ, gọi GoogleMap.setOnCircleClickListener(OnCircleClickListener).

Khi người dùng nhấp vào một vòng kết nối, 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 hình dạng cả trước khi nó đượ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 đối tượng đó được thêm vào bản đồ. Phương thức getter cũng được hiển thị cho tất cả các 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 hình nhiều đường màu xanh dương đậm có các đoạn trắc địa từ Melbourne đến Perth. Các phần dưới đây sẽ giải thích những thuộc tính này một cách chi tiết hơn chi tiết hơn.

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ư minh hoạ dưới đây:

Bản đồ có một đường đa tuyến từ Melbourne đến Perth

Lưu ý: Mặc dù hầu hết các thuộc tính này có thể áp dụng cho bất kỳ hình dạng nào đượ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ụ: Polyline không thể có màu tô vì 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ẽ của 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 đường đa tuyến). Nếu bạn không chỉ định, màu nét vẽ mặc định là đen (Color.BLACK).

Sau khi hình đã đượ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() đối với hình nhiều đường) và có thể thay đổi được bằng cách gọi setStrokeColor() (setColor() for a polyline).

Màu nền

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

Màu tô là một số nguyên alpha-red-green-blue (ARGB) 32 bit chỉ định độ mờ và màu của phần bên trong hình. Đặ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 bạn không chỉ định, màu nét vẽ mặc định là trong suốt (Color.TRANSPARENT).

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

Độ rộng nét

Chiều rộng của nét vẽ đường, dưới dạng số thực trong pixel (px). Chiều rộng không theo tỷ lệ khi bản đồ được thu phóng (tức là một hình dạng sẽ có cùng chiều rộng nét ở tất cả các cấp 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 đa tuyến). Nếu không chỉ định, nét vẽ mặc định là 10 pixel.

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

Mẫu nét vẽ

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

Mẫu sau đây thiết lập mẫu cho một hình nhiều đường thành lặp lại chuỗi 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 dài 30 pixel và một khoảng cách 20 pixel khác.

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 kẻ, bắt đầu với mục mẫu đầu tiên ở đỉnh đầu tiên được xác định cho hình dạng.

Loại khớp

Đối với hình nhiều đường và đường viền đa giác, bạn có thể chỉ định cạnh xiên hoặc hình tròn JointType để 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 một đa tuyến:

Kotlin



polyline.jointType = JointType.ROUND

Java


polyline.setJointType(JointType.ROUND);

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

Nắp dòng

Bạn có thể chỉ định kiểu Cap cho mỗi đầu của 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 phương thức getter và setter thích hợp.

Đoạn mã sau đây chỉ định một 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 chiều rộng nét tham chiếu trong điểm ảnh. API điều chỉnh bitmap theo tỷ lệ. Chiều rộng của nét chữ 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 phần mũ, ở phần kích thước ban đầu của hình ảnh. Chiều rộng mặc định của nét chữ tham chiếu là 10 điểm ảnh. Gợi ý: Để xác định chiều rộng nét tham chiếu, hãy mở hình ảnh bitmap của bạn tại Phóng to 100% trong trình chỉnh sửa hình ảnh và vẽ đồ thị độ rộng mong muốn của nét vẽ so với hình ảnh.

Nếu bạn sử dụng BitmapDescriptorFactory.fromResource() để tạo bitmap, hãy đảm bảo 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 đường trắc địa chỉ áp dụng cho đa tuyến và đa giác. Phương thức này không áp dụng cho vòng tròn vì vòng tròn không được xác định là một tập hợp các đoạn.

Chế độ cài đặt đường 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 đa tuyến/đa giác. Đoạn trắc địa là những đoạn đi theo đường ngắn nhất dọc theo bề mặt Trái Đất (hình cầu) và thường hiện ra dưới dạng đường cong trên bản đồ với phép chiếu Mercator. Các đoạn đường không theo kinh tuyến được vẽ dưới dạng đườ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 cho biết các đoạn phải được vẽ dưới dạng đường trắc địa và false cho biết các đoạn phải được vẽ dưới dạng đường thẳng. Nếu bạn không chỉ định, thì giá trị mặc định sẽ là các đoạn đường không thuộc đường trắc địa (false).

Sau khi thêm hình dạng vào bản đồ, bạn có thể truy cập vào chế độ cài đặt đường trắc địa bằng cách gọi isGeodesic() và có thể thay đổi chế độ cài đặt này 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 chỉ số khác lớp phủ (các hình dạng khác, lớp phủ trên mặt đất và lớp phủ ô) trên bản đồ. Lớp phủ có chỉ mục z cao sẽ đượ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 được chỉ định, chỉ mục z mặc định là 0. Sau khi hình dạng được thêm vào chỉ số z có thể được truy cập bởi gọi getZIndex() và có thể được thay đổi bằng cách gọi setZIndex().

Chế độ hiển thị

Chế độ hiển thị chỉ định xem hình dạng có nên được vẽ trên bản đồ hay không, nơi true cho biết cần vẽ và false cho biết không nên vẽ. Nó cho phép bạn tạm thời không hiển thị một hình dạng trên bản đồ. Đến vĩnh viễn xoá hình dạng khỏi bản đồ, 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 bạn không chỉ định, 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 vào chế độ hiển thị bằng cách gọi isVisible() và có thể được 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 một đa tuyến, đa giác hoặc vòng 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 bằng một đường đa tuyến và gọi Polyline.getTag() để truy xuất đối tượng dữ liệu.

Mã bên dưới xác định một thẻ tuỳ ý (A) cho đa tuyến đã 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 hữu ích trong việc 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ục vụ nhiều loại hình dạng và bạn muốn xử lý các hình dạng đó theo cách khác nhau khi người dùng nhấp vào các hình dạng đó.
  • Bạn có thể đang 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 của bạn.