패키지, 저장소 및 앱 카테고리 검색

mapbox_search 표지
패키지 상세v4.4.0

mapbox_search

MapBox API를 사용한 장소 검색 및 정적 지도 이미지용 플러터 패키지

AndroidiOSWebmacOSWindowsLinux
30일 다운로드
2.2만
좋아요
96
Pub 점수
140

패키지 설치

flutter pub add mapbox_search

패키지 개요

공개 정보를 바탕으로 생성한 선택 가이드입니다.

MapBox API를 사용하여 장소 검색 기능을 활성화하고 정적 지도 이미지를 생성하는 플러터 패키지입니다. 위치 검색, 좌표 조회, 정적 지도 표시를 위한 간단한 인터페이스를 제공하여 플러터 앱에 지리 정보 기능을 쉽게 통합할 수 있도록 합니다. 주소 검색, 위치 선택 또는 지도 미리보기 기능이 필요한 애플리케이션에 적합합니다. 안드로이드, iOS, 웹, macOS, 윈도우, 리눅스 등 다양한 플랫폼을 지원하여 광범위한 호환성을 보장합니다. 개발자는 최소한의 설정으로 위치 기반 서비스를 쉽게 구현할 수 있습니다.

사용 사례

  • 모바일 앱에서의 위치 검색
  • 양식용 주소 선택기
  • 정적 지도 미리보기
  • 지오코딩 통합
  • 지도 기반 UI 구성 요소
  • 여행 및 배달 앱

주요 기능

  • MapBox API 통합
  • 정적 지도 이미지 생성
  • 크로스 플랫폼 지원
  • 간단한 검색 인터페이스
  • 좌표 검색
  • 반응형 디자인

적합한 대상

  • 위치 인식 앱을 개발하는 개발자
  • 주소 검색이 필요한 앱
  • 정적 지도가 필요한 프로젝트
  • 크로스플랫폼 모바일 및 웹 앱
  • 여행, 물류 및 지도 도구

고려 사항

  • MapBox API 키가 필요합니다
  • 네트워크 연결 필요
  • 무료 레이어의 잠재적인 속도 제한
  • 검색 UI의 사용자 정의가 제한적
  • 외부 API 안정성에 따라 다름
  • 각 플랫폼용 추가 구성

원본 README

연결된 소스 저장소의 README 원문 스냅샷입니다. 최신 내용은 저장소에서 확인하세요.

Pub

About

Note: Breaking Changes in 4.x.x

  • PlaceSearch and ReverseGeoCoding classes are now merged into one class called GeoCoding with two methods getPlaces and getAddress since both of them are using the same API.
  • MapBox's new SearchBox API is added to the package.
  • Instead of throwing exceptions, the package now returns ApiResponse Record which can be either Success or Failure and can be handled using fold method.
  • Location class is now converted to a record.
  • List of coordinates are now converted to a record (lat: double, long: doube) whereever possible.

This package provides easy api calls to MapBox Search API.

Also, it contains an static map image generator.

Maki Icons can be used now in marker icon

As this package doesn't depend on Flutter SDK you cannot use the Colors class anymore on you Flutter project. Instead use map_box_search's Color.rgb constructor, passing the values as parameters:

var myColor = Colors.redAccent; //Flutter's Color class
var mapBoxColor = Color.rgb( myColor.red, myColor.green, myColor.blue);

Installing

First of all you must acquire an API key on the MapBox website https://www.mapbox.com/

Then, add the following to your pubspec.yaml file:

dependencies:
  mapbox_search: any

Setup

Now you can setup the API key for whole app by calling MapBoxSearch.init('API KEY') in your main() function, this way you don't have to pass the API key to every class that uses the package.

Usage of ApiResponse
final ApiResponse<List<MapBoxPlace>> addresses = await getAddress();
addresses.fold(
    (success) => // Do something with success data,
    (failure) => // Do something with failure data,
  );

Examples

SearchBox API
SearchBoxAPI search = SearchBoxAPI(
      apiKey: 'API Key', // dont pass if you have set it in MapBoxSearch.init('API KEY')
      limit: 6,
);
Get Suggestions
ApiResponse<SuggestionResponse> searchPlace = await search.getSuggestions(
    "central",
  );
Get mapbox_id
  • From SuggestionResponse
String mapboxId = searchPlace.suggestions[0].mapboxId;
Get Place Details
ApiResponse<RetrieveResonse> searchPlace = await search.getPlace(mapboxId);
Reverse GeoCoding
var reverseGeoCoding = GeoCoding(
    apiKey: 'API Key', // dont pass if you have set it in MapBoxSearch.init('API KEY')
    limit: 5,
);

Future<ApiResponse<List<MapBoxPlace>>> getAddress() =>
  reverseGeoCoding.getAddress(
    Location(lat: 72.0, lng: 76.00),
);
Forward GeoCoding Seach
var geocoding = GeoCoding(
    apiKey: 'API Key', // dont pass if you have set it in MapBoxSearch.init('API KEY')
    country: "BR",
    limit: 5,
    types: [PlaceType.address, PlaceType.place],
);

Future<ApiResponse<List<MapBoxPlace>>> getPlaces() =>
  geocoding.getPlaces(
      "central park",
      proximity: Location(
        lat: -19.984634,
        lng: -43.9502958,
      ),
    );
Batch Geocoding (v6)

Perform multiple geocoding queries (forward, reverse, or structured) in a single request.

var geocoding = GeoCodingApiV6(
    apiKey: 'API Key', // or use MapBoxSearch.init('API KEY')
    limit: 5,
);

Future<ApiResponse<BatchGeocodingResponse>> getBatch() =>
  geocoding.batch([
    ForwardQuery(query: "Eiffel Tower", limit: 1),
    ReverseQuery(location: (lat: 40.6892, long: -74.0445), limit: 1),
  ]);
Static Image
StaticImage staticImage = StaticImage(
    apiKey: 'API Key', // or use MapBoxSearch.init('API KEY')
  );
Image With Polyline
    String getStaticImageWithPolyline() => staticImage.getStaticUrlWithPolyline(
      point1: (lat: 37.77343, long: -122.46589),
      point2: (lat: 37.75965, long: -122.42816),
      marker1: MapBoxMarker( markerColor: const RgbColor(0, 0, 0),
          markerLetter: 'p',
          markerSize: MarkerSize.LARGE),
      marker2: MapBoxMarker(
          markerColor: const RgbColor(244, 67, 54),
          markerLetter: 'q',
          markerSize: MarkerSize.SMALL),
      height: 300,
      width: 600,
      zoomLevel: 15.5,
      style: MapBoxStyle.Dark,
      path: MapBoxPath(pathColor: const RgbColor(255, 0, 0), pathOpacity: 0.5, pathWidth: 5, pathPolyline: "%7DrpeFxbnjVsFwdAvr%40cHgFor%40jEmAlFmEMwM_FuItCkOi%40wc%40bg%40wBSgM"),
      render2x: true,
      center: (lat: 37.766541503617475, long: -122.44702324243272), // Required when auto is false
      // auto: true, // Alternatively, use auto: true to automatically fit markers and path
    );
Image with Marker
String getStaticImageWithMarker() => staticImage.getStaticUrlWithMarker(
  center: (lat: 37.77343, long: -122.46589),
  marker: MapBoxMarker(
      markerColor: const RgbColor(0, 0, 0), markerLetter: 'p', markerSize: MarkerSize.LARGE),
  height: 300,
  width: 600,
  zoomLevel: 16,
  style: MapBoxStyle.Streets,
  render2x: true,
);
Image without Marker
String getStaticImageWithoutMarker() => staticImage.getStaticUrlWithoutMarker(
    center: (lat: 37.75965, long: -122.42816),
    height: 300,
    width: 600,
    zoomLevel: 16,
    style: MapBoxStyle.Outdoors,
    render2x: true,
  );
Example App

Check out the example/ directory for a complete Flutter application demonstrating:

  • Forward & Reverse Geocoding
  • Batch Geocoding
  • Static Images (Markers, Polylines, Auto-framing)

카테고리

의존성

의존성 목록 5 개

소스 저장소

이 패키지를 사용하는 프로젝트