@neshan-maps-platform/react-openlayers 2.0.10 → 2.0.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +214 -173
- package/dist/React-Openlayers.js +212 -211
- package/dist/React-Openlayers.umd.cjs +9 -9
- package/dist/style.css +1 -1
- package/dist/types/App.d.ts +3 -3
- package/dist/types/App.model.d.ts +3 -3
- package/dist/types/assets/ol.model.d.ts +131 -0
- package/dist/types/components/Map.d.ts +5 -5
- package/dist/types/components/Map.model.d.ts +55 -89
- package/dist/types/components/index.d.ts +3 -2
- package/dist/types/main.d.ts +1 -1
- package/dist/types/parameters/index.d.ts +47 -47
- package/dist/types/store/ContextProvider.d.ts +3 -3
- package/dist/types/store/ContextProvider.model.d.ts +11 -11
- package/dist/types/store/context.d.ts +11 -11
- package/dist/types/utils/features.util.d.ts +2 -2
- package/dist/types/utils/index.d.ts +7 -7
- package/dist/types/utils/location.util.d.ts +30 -30
- package/package.json +48 -51
package/README.md
CHANGED
|
@@ -1,174 +1,215 @@
|
|
|
1
|
-
<p align="center">
|
|
2
|
-
<a href="https://platform.neshan.org">
|
|
3
|
-
<img width="150" src="https://static.neshanmap.ir/content/places/assets/images/21.png">
|
|
4
|
-
</a>
|
|
5
|
-
</p>
|
|
6
|
-
|
|
7
|
-
<h1 align="center">React Neshan Map Openlayers</h1>
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
[
|
|
21
|
-
|
|
22
|
-
[
|
|
23
|
-
[
|
|
24
|
-
[
|
|
25
|
-
[
|
|
26
|
-
[
|
|
27
|
-
[
|
|
28
|
-
[
|
|
29
|
-
[
|
|
30
|
-
[
|
|
31
|
-
[
|
|
32
|
-
[
|
|
33
|
-
[
|
|
34
|
-
[
|
|
35
|
-
[
|
|
36
|
-
[
|
|
37
|
-
[
|
|
38
|
-
[
|
|
39
|
-
[
|
|
40
|
-
[
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
-
|
|
54
|
-
-
|
|
55
|
-
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
[
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
[
|
|
173
|
-
|
|
1
|
+
<p align="center">
|
|
2
|
+
<a href="https://platform.neshan.org">
|
|
3
|
+
<img width="150" src="https://static.neshanmap.ir/content/places/assets/images/21.png">
|
|
4
|
+
</a>
|
|
5
|
+
</p>
|
|
6
|
+
|
|
7
|
+
<h1 align="center">React Neshan Map Openlayers</h1>
|
|
8
|
+
<div align="center">
|
|
9
|
+
An official React wrapper for neshan-map-openlayers library
|
|
10
|
+
</div>
|
|
11
|
+
|
|
12
|
+
<!-- <div align="center">
|
|
13
|
+
|
|
14
|
+
An enterprise-class UI design language and React UI library.
|
|
15
|
+
|
|
16
|
+
[![CI status][github-action-image]][github-action-url] [![codecov][codecov-image]][codecov-url] [![NPM version][npm-image]][npm-url] [![NPM downloads][download-image]][download-url]
|
|
17
|
+
|
|
18
|
+
[![][bundlephobia-image]][bundlephobia-url] [![][bundlesize-js-image]][unpkg-js-url] [![FOSSA Status][fossa-image]][fossa-url]
|
|
19
|
+
|
|
20
|
+
[![Follow Twitter][twitter-image]][twitter-url] [![Renovate status][renovate-image]][renovate-dashboard-url] [![][issues-helper-image]][issues-helper-url] [![Issues need help][help-wanted-image]][help-wanted-url]
|
|
21
|
+
|
|
22
|
+
[npm-image]: http://img.shields.io/npm/v/antd.svg?style=flat-square
|
|
23
|
+
[npm-url]: http://npmjs.org/package/antd
|
|
24
|
+
[github-action-image]: https://github.com/ant-design/ant-design/workflows/%E2%9C%85%20test/badge.svg
|
|
25
|
+
[github-action-url]: https://github.com/ant-design/ant-design/actions?query=workflow%3A%22%E2%9C%85+test%22
|
|
26
|
+
[codecov-image]: https://img.shields.io/codecov/c/github/ant-design/ant-design/master.svg?style=flat-square
|
|
27
|
+
[codecov-url]: https://codecov.io/gh/ant-design/ant-design/branch/master
|
|
28
|
+
[download-image]: https://img.shields.io/npm/dm/antd.svg?style=flat-square
|
|
29
|
+
[download-url]: https://npmjs.org/package/antd
|
|
30
|
+
[fossa-image]: https://app.fossa.io/api/projects/git%2Bgithub.com%2Fant-design%2Fant-design.svg?type=shield
|
|
31
|
+
[fossa-url]: https://app.fossa.io/projects/git%2Bgithub.com%2Fant-design%2Fant-design?ref=badge_shield
|
|
32
|
+
[help-wanted-image]: https://flat.badgen.net/github/label-issues/ant-design/ant-design/help%20wanted/open
|
|
33
|
+
[help-wanted-url]: https://github.com/ant-design/ant-design/issues?q=is%3Aopen+is%3Aissue+label%3A%22help+wanted%22
|
|
34
|
+
[twitter-image]: https://badgen.net/twitter/follow/antdesignui?style=flat-square
|
|
35
|
+
[twitter-url]: https://twitter.com/AntDesignUI
|
|
36
|
+
[bundlesize-js-image]: https://img.badgesize.io/https:/unpkg.com/antd/dist/antd.min.js?label=antd.min.js&compression=gzip&style=flat-square
|
|
37
|
+
[unpkg-js-url]: https://unpkg.com/browse/antd/dist/antd.min.js
|
|
38
|
+
[bundlephobia-image]: https://badgen.net/bundlephobia/minzip/antd?style=flat-square
|
|
39
|
+
[bundlephobia-url]: https://bundlephobia.com/package/antd
|
|
40
|
+
[issues-helper-image]: https://img.shields.io/badge/using-issues--helper-orange?style=flat-square
|
|
41
|
+
[issues-helper-url]: https://github.com/actions-cool/issues-helper
|
|
42
|
+
[renovate-image]: https://img.shields.io/badge/renovate-enabled-brightgreen.svg?style=flat-square
|
|
43
|
+
[renovate-dashboard-url]: https://github.com/ant-design/ant-design/issues/32498
|
|
44
|
+
|
|
45
|
+
</div> -->
|
|
46
|
+
|
|
47
|
+
<!-- [](https://ant.design)
|
|
48
|
+
|
|
49
|
+
English | [Português](./README-pt_BR.md) | [简体中文](./README-zh_CN.md) | [Українською](./README-uk_UA.md) | [Spanish](./README-sp_MX.md) | [日本語](./README-ja_JP.md)
|
|
50
|
+
|
|
51
|
+
## ✨ Features
|
|
52
|
+
|
|
53
|
+
- 🌈 Enterprise-class UI designed for web applications.
|
|
54
|
+
- 📦 A set of high-quality React components out of the box.
|
|
55
|
+
- 🛡 Written in TypeScript with predictable static types.
|
|
56
|
+
- ⚙️ Whole package of design resources and development tools.
|
|
57
|
+
- 🌍 Internationalization support for dozens of languages.
|
|
58
|
+
- 🎨 Powerful theme customization in every detail.
|
|
59
|
+
|
|
60
|
+
## 🖥 Environment Support
|
|
61
|
+
|
|
62
|
+
- Modern browsers
|
|
63
|
+
- Server-side Rendering
|
|
64
|
+
- [Electron](https://www.electronjs.org/)
|
|
65
|
+
|
|
66
|
+
| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>Safari | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/electron/electron_48x48.png" alt="Electron" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>Electron |
|
|
67
|
+
| ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
68
|
+
| Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions | --> |
|
|
69
|
+
## ⚙️ Before Install
|
|
70
|
+
You need a map key to use our map on your react web application.
|
|
71
|
+
You can signup and get a key from [Our Platfrom](https://platform.neshan.org/panel/api-key).
|
|
72
|
+
<br/>
|
|
73
|
+
For a more information, visit our [doc page](https://platform.neshan.org/sdk/react-component#).
|
|
74
|
+
|
|
75
|
+
|
|
76
|
+
## 📦 Install
|
|
77
|
+
|
|
78
|
+
```bash
|
|
79
|
+
npm install @neshan-maps-platform/react-openlayers
|
|
80
|
+
```
|
|
81
|
+
|
|
82
|
+
```bash
|
|
83
|
+
yarn add @neshan-maps-platform/react-openlayers
|
|
84
|
+
```
|
|
85
|
+
|
|
86
|
+
## 🔨 Usage
|
|
87
|
+
|
|
88
|
+
```jsx
|
|
89
|
+
import { useEffect, useRef, useState } from "react"
|
|
90
|
+
import "@neshan-maps-platform/react-openlayers/dist/style.css"
|
|
91
|
+
|
|
92
|
+
// If you want to use ol types like below, your project has to support typescript.
|
|
93
|
+
import { NeshanMap, NeshanMapRef, OlMap, Ol } from "@neshan-maps-platform/react-openlayers"
|
|
94
|
+
|
|
95
|
+
function App() {
|
|
96
|
+
const mapRef = useRef<NeshanMapRef | null>(null)
|
|
97
|
+
|
|
98
|
+
const [ol, setOl] = useState<Ol>()
|
|
99
|
+
const [olMap, setOlMap] = useState<OlMap>()
|
|
100
|
+
|
|
101
|
+
const onInit = (ol: Ol, map: OlMap) => {
|
|
102
|
+
setOl(ol)
|
|
103
|
+
setOlMap(map)
|
|
104
|
+
|
|
105
|
+
setTimeout(() => {
|
|
106
|
+
const view = map.getView()
|
|
107
|
+
view.animate({
|
|
108
|
+
center: (ol.proj.fromLonLat)([
|
|
109
|
+
51.36281969540723, 35.69672648316882,
|
|
110
|
+
]),
|
|
111
|
+
zoom: 12,
|
|
112
|
+
duration: 1000,
|
|
113
|
+
})
|
|
114
|
+
}, 2000)
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
useEffect(() => {
|
|
118
|
+
const interval = setInterval(() => {
|
|
119
|
+
if (mapRef.current?.map) {
|
|
120
|
+
mapRef.current?.map.setMapType("standard-night")
|
|
121
|
+
clearInterval(interval)
|
|
122
|
+
}
|
|
123
|
+
}, 1000)
|
|
124
|
+
return () => clearInterval(interval)
|
|
125
|
+
}, [])
|
|
126
|
+
|
|
127
|
+
return (
|
|
128
|
+
<>
|
|
129
|
+
<NeshanMap
|
|
130
|
+
mapKey="web.ef01013a8aad4ba293504994d34aa8ad"
|
|
131
|
+
defaultType="neshan"
|
|
132
|
+
center={{ latitude: 35.7665394, longitude: 51.4749824 }}
|
|
133
|
+
style={{ height: "48vh", width: "100%" }}
|
|
134
|
+
onInit={onInit}
|
|
135
|
+
zoom={13}
|
|
136
|
+
></NeshanMap>
|
|
137
|
+
<hr />
|
|
138
|
+
<NeshanMap
|
|
139
|
+
ref={mapRef}
|
|
140
|
+
mapKey="web.ef01013a8aad4ba293504994d34aa8ad"
|
|
141
|
+
traffic={false}
|
|
142
|
+
defaultType="dreamy"
|
|
143
|
+
style={{ height: "48vh", width: "100%" }}
|
|
144
|
+
></NeshanMap>
|
|
145
|
+
</>
|
|
146
|
+
)
|
|
147
|
+
}
|
|
148
|
+
|
|
149
|
+
export default App
|
|
150
|
+
```
|
|
151
|
+
|
|
152
|
+
### TypeScript
|
|
153
|
+
|
|
154
|
+
`@neshan-maps-platform/react-openlayers` is written in TypeScript with complete definitions.
|
|
155
|
+
<!-- , check [Use in TypeScript](https://ant.design/docs/react/use-in-typescript) to get started. -->
|
|
156
|
+
|
|
157
|
+
<!-- ## 🌍 Internationalization
|
|
158
|
+
|
|
159
|
+
Dozens of languages are supported in `antd`, see [i18n](https://ant.design/docs/react/i18n).
|
|
160
|
+
|
|
161
|
+
## 🔗 Links
|
|
162
|
+
|
|
163
|
+
- [Home page](https://ant.design/)
|
|
164
|
+
- [Components Overview](https://ant.design/components/overview)
|
|
165
|
+
- [Ant Design Pro](http://pro.ant.design/)
|
|
166
|
+
- [Change Log](CHANGELOG.en-US.md)
|
|
167
|
+
- [rc-components](http://react-component.github.io/)
|
|
168
|
+
- [Mobile UI](http://mobile.ant.design)
|
|
169
|
+
- [Mini Program UI](http://mini.ant.design)
|
|
170
|
+
- [Ant Design Pro Components](https://procomponents.ant.design)
|
|
171
|
+
- [Ant Design Charts](https://charts.ant.design)
|
|
172
|
+
- [Ant Design Icons](https://github.com/ant-design/ant-design-icons)
|
|
173
|
+
- [Ant Design Colors](https://github.com/ant-design/ant-design-colors)
|
|
174
|
+
- [Landing Pages](https://landing.ant.design)
|
|
175
|
+
- [Motion](https://motion.ant.design)
|
|
176
|
+
- [Scaffold Market](http://scaffold.ant.design)
|
|
177
|
+
- [Developer Instruction](https://github.com/ant-design/ant-design/wiki/Development)
|
|
178
|
+
- [Versioning Release Note](https://github.com/ant-design/ant-design/wiki/%E8%BD%AE%E5%80%BC%E8%A7%84%E5%88%99%E5%92%8C%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B)
|
|
179
|
+
- [FAQ](https://ant.design/docs/react/faq)
|
|
180
|
+
- [CodeSandbox Template](https://u.ant.design/codesandbox-repro) for bug reports
|
|
181
|
+
- [Customize Theme](https://ant.design/docs/react/customize-theme)
|
|
182
|
+
- [How to Apply for Being A Collaborator](https://github.com/ant-design/ant-design/wiki/Collaborators#how-to-apply-for-being-a-collaborator)
|
|
183
|
+
|
|
184
|
+
## ⌨️ Development
|
|
185
|
+
|
|
186
|
+
Use Gitpod, a free online dev environment for GitHub.
|
|
187
|
+
|
|
188
|
+
[](https://gitpod.io/#https://github.com/ant-design/ant-design)
|
|
189
|
+
|
|
190
|
+
Or clone locally:
|
|
191
|
+
|
|
192
|
+
```bash
|
|
193
|
+
$ git clone git@github.com:ant-design/ant-design.git
|
|
194
|
+
$ cd ant-design
|
|
195
|
+
$ npm install
|
|
196
|
+
$ npm start
|
|
197
|
+
```
|
|
198
|
+
|
|
199
|
+
Open your browser and visit http://127.0.0.1:8001 , see more at [Development](https://github.com/ant-design/ant-design/wiki/Development).
|
|
200
|
+
|
|
201
|
+
## 🤝 Contributing [](http://makeapullrequest.com)
|
|
202
|
+
|
|
203
|
+
Read our [contributing guide](https://ant.design/docs/react/contributing) and let's build a better antd together.
|
|
204
|
+
|
|
205
|
+
We welcome all contributions. Please read our [CONTRIBUTING.md](https://github.com/ant-design/ant-design/blob/master/.github/CONTRIBUTING.md) first. You can submit any ideas as [pull requests](https://github.com/ant-design/ant-design/pulls) or as [GitHub issues](https://github.com/ant-design/ant-design/issues). If you'd like to improve code, check out the [Development Instructions](https://github.com/ant-design/ant-design/wiki/Development) and have a good time! :)
|
|
206
|
+
|
|
207
|
+
If you are a collaborator, please follow our [Pull Request principle](https://github.com/ant-design/ant-design/wiki/PR-principle) to create a Pull Request with [collaborator template](https://github.com/ant-design/ant-design/compare?expand=1&template=collaborator.md).
|
|
208
|
+
|
|
209
|
+
[](https://issuehunt.io/repos/34526884)
|
|
210
|
+
|
|
211
|
+
## ❤️ Sponsors and Backers [](https://opencollective.com/ant-design#support) [](https://opencollective.com/ant-design#support)
|
|
212
|
+
|
|
213
|
+
[](https://opencollective.com/ant-design#support)
|
|
214
|
+
|
|
174
215
|
[](https://opencollective.com/ant-design#support) -->
|