https://github.com/watergis/maplibre-gl-sky

This repository is to add sky color to maplibre-gl-js smartly
https://github.com/watergis/maplibre-gl-sky

Last synced: about 1 month ago
JSON representation

This repository is to add sky color to maplibre-gl-js smartly

• Host: GitHub
• URL: https://github.com/watergis/maplibre-gl-sky
• Owner: watergis
• License: mit
• Created: 2024-08-08T20:09:23.000Z (5 months ago)
• Default Branch: main
• Last Pushed: 2024-10-24T06:05:52.000Z (about 2 months ago)
• Last Synced: 2024-10-25T00:37:18.395Z (about 2 months ago)
• Language: Svelte
• Homepage: https://maplibre-gl-sky.water-gis.com/
• Size: 1.23 MB
• Stars: 3
• Watchers: 0
• Forks: 1
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • Contributing: CONTRIBUTING.md
  • Funding: .github/FUNDING.yml
  • License: LICENSE

Awesome Lists containing this project

README

        
# malibre-gl-sky

![License](https://img.shields.io/github/license/watergis/maplibre-gl-sky)

[![CI](https://github.com/watergis/maplibre-gl-sky/actions/workflows/ci.yml/badge.svg)](https://github.com/watergis/maplibre-gl-sky/actions/workflows/ci.yml)

[![Netlify Status](https://api.netlify.com/api/v1/badges/d8d3c213-ee53-442b-b644-c2624c8f8062/deploy-status)](https://app.netlify.com/sites/maplibre-gl-sky/deploys)

![GitHub repo size](https://img.shields.io/github/repo-size/watergis/maplibre-gl-sky)

This repository is to add sky color to maplibre-gl-js smartly

![plugin-image](./static/assets/plugin-overview.webp)

## Installation

```shell

npm i -D @watergis/maplibre-gl-sky

```

## Usage

- Basic usage

This way, it will fetch the sun calc time from map center and try to get the right color palette for sky.

```ts

import maplibregl, { Map } from 'maplibre-gl';

import { SkyControl } from '@watergis/maplibre-gl-sky';

const map = new Map();

const sky = new SkyControl();

sky.addTo(map);

```

- add specific sky color

```ts

const sky = new SkyControl();

sky.addTo(map, {

	timeType: 'sunset'

});

```

- add specific date

```ts

const sky = new SkyControl();

sky.addTo(map, {

	date: new Date()

});

```

- Customise sky colors

```ts

import { defaultSkyOptions, SkyControl } from '@watergis/maplibre-gl-sky';

const newOptions = defaultSkyOptions;

// edit your options for `newOptions`

const sky = new SkyControl(newOptions);

sky.addTo(map);

```

## Contribution

See [CONTRIBUTING](./CONTRIBUTING.md)

## License

[MIT License](LICENSE)