sdk-google-map/README.md

Simple to use (Angular) embedded Google map.

<img src="https://www.soodohkohd.com/assets/images/logo.png" title="soo-doh-kohd" height="200"/>

## Description:
The sdk-google-map component is a simple to use component that allows you to embed a Google Maps view without the need of any API keys. By providing either Lat/Long coordinates, or an address, you can dynamically display maps in your application.

## Angular Compatibility Chart

| Version | Compatibility |
|---------|---------------|
| 16      | EOL 2025      |
| 17      | EOL 2025      |
| 18      | ✔             |
| 19      | ✔             |
| 20      | Q3 2025       |

## INSTALLATION:
Using NPM:

```bash
npm install --save sdk-google-map
```

## CONFIGURATION:
To configure the ```sdk-google-map``` for your application, add the following lines to your app.module.ts file:

```typescript
import { SDKGoogleMapModule } from 'sdk-google-map';

@NgModule({
    imports: [
        SDKGoogleMapModule
    ]
})
export class AppModule { }
```

## PROPERTIES:
```typescript
height: string = ""; // This value should include a size type (e.g., '500px');
width: string = ""; // This value should include a size type (e.g., '500px');
latitude: string = ""; // Example: "37.422161"
longitude: string = ""; // Example: "-122.084267"
location: string = ""; // Example: "1600 Amphitheatre Parkway Mountain View, CA 94043"
zoom: string = "10"; // Default value shown.
border: string = "1px solid lightgray"; // Default value shown. Use 'unset' to remove the border.
```

## USAGE:
```html
<sdk-google-map location="1600 Amphitheatre Parkway Mountain View, CA 94043, USA"></sdk-google-map>

<sdk-google-map latitude="37.422161" longitude="-122.084267"></sdk-google-map>
```

Setting the zoom, height, width and border:
```html
<sdk-google-map location="1600 Amphitheatre Parkway Mountain View, CA 94043, USA" height="500px" width="750px" zoom="12" border="1px solid blue"></sdk-google-map>
```

Dynamic variables:
```typescript
public mapLatitude: string = "37.422161";
public mapLongitude: string = "-122.084267";
public mapLocation: string = "1600 Amphitheatre Parkway Mountain View, CA 94043";
```

```html
<sdk-google-map [latitude]="mapLatitude" [longitude]="mapLongitude" height="500px" width="750px" zoom="12"></sdk-google-map>
<sdk-google-map [location]="mapLocation" height="500px" width="750px" zoom="12"></sdk-google-map>
```

**NOTE:** Latitude/Longitude will be used in lieu of Location, if all 3 are provided.