npmpackage.info

Gathering detailed insights and metrics for @uiw/react-amap-circle

Other packages similar to @uiw/react-amap-circle

@uiw/react-amap-circle-marker

7.1.3

构造一个圆形覆盖物。可直接满足创建圆形标注的需要。

@uiw/react-amap-circle

基于 React 封装的高德地图组件，帮助你轻松的接入地图到 React 项目中。

7.1.3

444

MIT

TypeScript

971.00 B

44,478 5.3

Installations

npm install @uiw/react-amap-circle

Developer Guide

BETA

Typescript

Yes

Module System

CommonJS

Node Version

20.17.0

NPM Version

10.8.2 Score

67.1

Supply Chain

83.5

Quality

83.8

Maintenance

100

Vulnerability

100

License

Pull Requests

Open

6

Total

261

Closed

121

Merged

134

Issues

Open

45

Total

119

Closed

74

Releases

126

v7.1.3

Published on 20 Sept 2024

v7.1.2

Published on 19 Sept 2024

v7.1.1

Published on 30 Aug 2024

v7.1.0

Published on 11 Jul 2024

v7.0.2

Published on 04 Jul 2024

v7.0.1

Published on 03 Jul 2024

View all 126 releases

Contributors

Unable to fetch Contributors

View all 19 contributors

Languages

TypeScript

HTML

Less

CSS

Shell

TypeScript (97.28%)

HTML (2.27%)

Less (0.24%)

CSS (0.14%)

Shell (0.06%)

Developer

uiwjs

Download Statistics

Total Downloads

44,478

Last Day

Last Week

217

Last Month

925

Last Year

11,488

GitHub Statistics

444 Stars

683 Commits

70 Forks

6 Watching

11 Branches

19 Contributors

Bundle Size

2.14 kB

Minified

971.00 B

Minified + Gzipped

Bundlephobia

Sponsor this package

https://jaywcjlove.github.io/#/sponsor

Maintainers

Package Meta Information

Latest Version

7.1.3

Package Id

@uiw/react-amap-circle@7.1.3

Unpacked Size

11.91 kB

Size

3.66 kB

File Count

NPM Version

10.8.2

Node Version

20.17.0

Publised On

20 Sept 2024

Total Downloads

Cumulative downloads

Total Downloads

44,478

Last day

4.5%

Compared to previous day

Last week

30.7%

217

Compared to previous week

Last month

-0.1%

925

Compared to previous month

Last year

-38.7%

11,488

Compared to previous year

Daily Downloads

Weekly Downloads

Monthly Downloads

Yearly Downloads

Dependencies

@uiw/react-amap-map @uiw/react-amap-types @uiw/react-amap-utils

Peer Dependencies

react react-dom

Versions

Circle 圆形组件

构造圆形对象，通过 CircleOptions 指定多边形样式

1import { Circle } from '@uiw/react-amap';
2// 或者单独安装使用
3import { Circle } from '@uiw/react-amap-circle';

基本用法

1import ReactDOM from 'react-dom';
2import React, { useState } from 'react';
3import { Map, APILoader, Circle } from '@uiw/react-amap';
4
5const Example = () => {
6  const [show, setShow] = useState(true);
7  return (
8    <>
9      <button onClick={() => setShow(!show)}>
10        {show ? '隐藏' : '显示'}
11      </button>
12      <div style={{ width: '100%', height: '300px' }}>
13        <Map zoom={14} center={[116.400274, 39.905812]}>
14          <Circle
15            visible={show}
16            radius={1000}
17            strokeColor="#fff"
18            strokeWeight={2}
19            center={new AMap.LngLat(116.39,39.9)}
20          />
21        </Map>
22      </div>
23    </>
24  );
25}
26
27const Mount = () => (
28  <APILoader akey="a7a90e05a37d3f6bf76d4a9032fc9129">
29    <Example />
30  </APILoader>
31);
32
33export default Mount;

Props

更多参数设置

参数	说明	类型	默认值
visible	覆盖物是否可见。	`boolean`	-
radius	圆半径，单位:米	`number`	-

事件

事件类型文档

参数	说明	类型
onHide	隐藏	`(): void;`
onShow	显示	`(): void;`
onRightClick	鼠标右键单击事件	`(event: MapsEvent): void;`
onClick	鼠标左键单击事件	`(event: MapsEvent): void;`
onTouchEnd	鼠标左键单击事件	`(event: MapsEvent): void;`
onDblClick	鼠标左键双击事件	`(event: MapsEvent): void;`
onTouchMove	触摸移动进行中时触发事件，仅适用移动设备	`(event: MapsEvent): void;`
onTouchStart	触摸开始时触发事件，仅适用移动设备	`(event: MapsEvent): void;`
onMouseOut	鼠标移出	`(event: MapsEvent): void;`
onMouseOver	鼠标经过	`(event: MapsEvent): void;`
onMouseUp	鼠标抬起	`(event: MapsEvent): void;`
onMouseDown	鼠标按下	`(event: MapsEvent): void;`

Security-Policy

Determines if the project has published a security policy.

0

SAST

Determines if the project uses static code analysis.

Score

5.3

/10

Last Scanned on 2025-01-27

The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.

Learn More