{"id":21438233,"url":"https://github.com/bpetermann/use-sort-cities-by-distance","last_synced_at":"2026-05-22T05:16:32.680Z","repository":{"id":185679920,"uuid":"673801763","full_name":"bpetermann/use-sort-cities-by-distance","owner":"bpetermann","description":"React hook to sort cities by distance to a point","archived":false,"fork":false,"pushed_at":"2024-12-03T14:51:48.000Z","size":1755,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-03-13T05:15:57.743Z","etag":null,"topics":["npm-package","react","reacthook"],"latest_commit_sha":null,"homepage":"https://bpetermann.github.io/use-sort-cities-by-distance/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/bpetermann.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-08-02T13:04:16.000Z","updated_at":"2024-12-03T14:58:43.000Z","dependencies_parsed_at":"2024-06-22T17:13:26.008Z","dependency_job_id":"0cf6a22c-3e55-42db-97e5-91d748a1de85","html_url":"https://github.com/bpetermann/use-sort-cities-by-distance","commit_stats":null,"previous_names":["bpetermann/use-sort-by-distance"],"tags_count":5,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bpetermann%2Fuse-sort-cities-by-distance","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bpetermann%2Fuse-sort-cities-by-distance/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bpetermann%2Fuse-sort-cities-by-distance/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bpetermann%2Fuse-sort-cities-by-distance/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/bpetermann","download_url":"https://codeload.github.com/bpetermann/use-sort-cities-by-distance/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243950805,"owners_count":20373664,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["npm-package","react","reacthook"],"created_at":"2024-11-23T00:34:14.761Z","updated_at":"2026-05-22T05:16:27.630Z","avatar_url":"https://github.com/bpetermann.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# useSortCitiesByDistance\n\n[![npm version](https://badge.fury.io/js/use-sort-cities-by-distance.svg)](https://badge.fury.io/js/use-sort-cities-by-distance)\n[![NPM version][npm-image]][npm-url]\n[![Build][github-build]][github-build-url]\n![npm-typescript]\n[![License][github-license]][github-license-url]\n\n`useSortCitiesByDistance` is a simple react hook that enables you to sort an array of cities based on their proximity to a given point. The distance is calculated with a straight line or travel distance between the places.\n\n## Getting started\n\n### Installation\n\n```bash\nnpm install use-sort-cities-by-distance\n#or\nyarn add use-sort-cities-by-distance\n```\n\nImport the 'useSortCitiesByDistance' hook from the package:\n\n```jsx\nimport { useSortCitiesByDistance } from 'use-sort-cities-by-distance'\n```\n\n## Usage with JSON Data\n\nDefine your starting point, target destinations, and a .json list with coordinates of the possible targets:\n\n```jsx\nimport React, { useState } from 'react'\nimport { useSortCitiesByDistance } from 'use-sort-cities-by-distance'\nimport cities from './cities.json'\n\nfunction YourComponent() {\n  const [config, setConfig] = useState({\n    list: cities, // List of possible cities\n    start: 'London', // Starting point\n    targets: ['London', 'Paris', 'New York', 'Barcelona'], // Array of target cities\n    unit: 'km', // Optional, default is 'miles', enter 'km' if you need kilometers\n  })\n\n  const { sorted } = useSortCitiesByDistance(config)\n\n  // Your component code\n}\n```\n\nThe list property should be an array of cities in the following .json format. A demo list can be found in the demo folder:\n\n```json\n[\n  { \"city\": \"Los Angeles\", \"lat\": 34.0522, \"lng\": -118.2437 },\n  { \"city\": \"London\", \"lat\": 51.5074, \"lng\": -0.1278 },\n  { \"city\": \"Tokyo\", \"lat\": 35.6895, \"lng\": 139.6917 }\n]\n```\n\n## Usage with Google Maps\n\nInstead of a list, you can also use the hook with the Google Maps API. Just enter your key as the \"key\" property and omit the \"list\". The use of Google Maps allows the distance in travel distance.\n\n```jsx\nconst config = {\n  key: '******', // Google Maps API key\n  start: 'London',\n  targets: ['London', 'Paris', 'New York', 'Barcelona'],\n  travelDistance: true, // Optional, default is straight line\n}\n```\n\nPossible errors are displayed in an error object, which you retain from the hook:\n\n```jsx\nconst { sorted, error } = useSortCitiesByDistance(config)\n```\n\n### Contributing\n\nContributions, issues, and feature requests are welcome!\n\n### License\n\nThis project is licensed under the MIT License\n\n[npm-url]: https://www.npmjs.com/package/use-sort-cities-by-distance\n[npm-image]: https://img.shields.io/npm/v/use-sort-cities-by-distance\n[github-license]: https://img.shields.io/github/license/bpetermann/use-sort-cities-by-distance\n[github-license-url]: https://github.com/bpetermann/use-sort-cities-by-distance/blob/main/LICENSE\n[github-build]: https://github.com/bpetermann/use-sort-cities-by-distance/actions/workflows/publish.yml/badge.svg\n[github-build-url]: https://github.com/bpetermann/use-sort-cities-by-distance/actions/workflows/publish.yml\n[npm-typescript]: https://img.shields.io/npm/types/use-sort-cities-by-distance\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbpetermann%2Fuse-sort-cities-by-distance","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbpetermann%2Fuse-sort-cities-by-distance","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbpetermann%2Fuse-sort-cities-by-distance/lists"}