https://github.com/smallpaes/google-map-api-practice-map

Built with Vue.js and Google Map API--Used to practice creating map, marker, and info window on a single page application.
https://github.com/smallpaes/google-map-api-practice-map

google-maps-api vue vuejs2

Last synced: 9 days ago
JSON representation

Built with Vue.js and Google Map API--Used to practice creating map, marker, and info window on a single page application.

• Host: GitHub
• URL: https://github.com/smallpaes/google-map-api-practice-map
• Owner: smallpaes
• Created: 2019-10-11T04:32:32.000Z (about 5 years ago)
• Default Branch: master
• Last Pushed: 2023-01-04T22:31:05.000Z (almost 2 years ago)
• Last Synced: 2024-10-15T01:46:02.437Z (23 days ago)
• Topics: google-maps-api, vue, vuejs2
• Language: Vue
• Homepage:
• Size: 4.5 MB
• Stars: 4
• Watchers: 2
• Forks: 0
• Open Issues: 23
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# # Google Api Practice: Map

This project is built with Vue.js and Google Map API, and is used to practice creating map, marker, and info window on a single page application.

## Project First Look

![Project First Look](google_api_practice3.gif)

 


## Project setup

### Clone

Clone this repository to your local machine

```

$ git clone https://github.com/smallpaes/google-map-api-practice-map.git

```

### Setup App

**1. Enter the project folder**

```

$ cd google-map-api-practice-map

```

**2. Install packages via npm**

```

$ npm install

```

**3. Place Google Map Project API Key**

> /public/index.html

```

```

**4. Compiles and hot-reloads for development**

```

$ npm run serve

```

**5. Visit the page**

```

http://localhost:8080/#/restaurants

```

___

## Related Blog Post

- [Medium: [筆記] 從零接觸 Google Map API：在 Vue.js 中實作地圖、地標、訊息視窗](http://tiny.cc/aibdez)

## Authors

- [Mike Huang](https://github.com/smallpaes)