搜尋套件、儲存庫與 APP 分類

GitHub 儲存庫ketanchoyal/mapbox_search

mapbox_search

一個用於使用 MapBox API 進行地點搜尋和靜態地圖影像的 Flutter 套件

mapbox_search 專案封面
星標
73
分支
62
最近推送(UTC)
2025年12月30日
專案狀態
未封存

原始 README

以下為英文專案原文快照,最新內容請造訪 GitHub。

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)
Ketan Choyal GitHub avatar
GitHub 作者

Ketan Choyal ↗

Sr. Full Stack Developer

Ontario, Canada官方網站 ↗
語言DartSwiftKotlinObjective-C

分類

此儲存庫發佈的套件

使用的依賴

依賴清單 11 項

如何選擇適合專案的儲存庫?

先依使用情境篩選,再比較專案活躍情況,最後到原始儲存庫確認使用要求。

  1. 透過儲存庫名稱、作者或描述搜尋,再依技術分類縮小範圍。
  2. 綜合星標、分支與最近推送比較專案;星標反映社群關注,不保證品質。
  3. 使用前在 GitHub 確認 README、授權條款與 Issues。

來源與維護

“A repository is the most basic element of GitHub.”

GitHub Docs — About repositories ↗