{"_id":"laser-design","_rev":"42-fa7f0d6a117fc79575dc884bbe9d9dd6","name":"laser-design","dist-tags":{"latest":"2.0.7"},"versions":{"2.0.0":{"name":"laser-design","version":"2.0.0","keywords":[],"author":{"name":"idea"},"license":"ISC","_id":"laser-design@2.0.0","maintainers":[{"name":"idea-laser","email":"laser-itadmin@idea.edu.cn"}],"dist":{"shasum":"002459fb43c1f94eb9cfe744b27df968fab7a019","tarball":"https://registry.npmjs.org/laser-design/-/laser-design-2.0.0.tgz","fileCount":73,"integrity":"sha512-AjbSj3mxc1/0VAk2UZcYXdh/cOyNubbvtzM4gmJRsfXqVJKE9WsZICjp23SI0WS2Z9KlEqQ7dN1iJx/1/r8MPQ==","signatures":[{"sig":"MEYCIQDNaJo1mDofb3FlCGto1B59DzaH4kRIFr0luy9JMo/xcQIhAKA/HDnQE0ntIumj8LB7cB1J7tLSCQXfZRn1b1LRWdKW","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":3521890},"main":"index.js","gitHead":"c36c4e480bd46bbedec3bcfa11a655980182abc6","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"idea-laser","email":"laser-itadmin@idea.edu.cn"},"_npmVersion":"10.9.0","description":"基于腾讯地图API的React地图组件库，支持Marker、Icon等功能","directories":{},"_nodeVersion":"22.11.0","dependencies":{"@turf/turf":"^7.3.4"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/laser-design_2.0.0_1773805470778_0.564024456458994","host":"s3://npm-registry-packages-npm-production"}},"2.0.1":{"name":"laser-design","version":"2.0.1","keywords":[],"author":{"name":"idea"},"license":"ISC","_id":"laser-design@2.0.1","maintainers":[{"name":"idea-laser","email":"laser-itadmin@idea.edu.cn"}],"dist":{"shasum":"d7e2c10b3e5d0e8d9ba787bd1bf07399af1e6b53","tarball":"https://registry.npmjs.org/laser-design/-/laser-design-2.0.1.tgz","fileCount":73,"integrity":"sha512-VHxvkzKZ18HxLP6xJzILUvx/o/eyZO4qy8pdYuNkEv15/oIlYagPC93Xg6ZCSrGcM+YZkgI+rbtfq4VU+SXSYQ==","signatures":[{"sig":"MEUCIQCt1fZ9bltPCB4jHLlVk5HRycoL8z9CN4JPnYtWizVdsQIgOpNvKNGI40nRnE6gp/ixlSKE01oMHC43zZuHXHQ2Uq0=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":3522884},"main":"index.js","gitHead":"3bc76fe47a18d341c396e8e02d2e4ff0fe5c32ab","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"idea-laser","email":"laser-itadmin@idea.edu.cn"},"_npmVersion":"10.9.0","description":"基于腾讯地图API的React地图组件库，支持Marker、Icon等功能","directories":{},"_nodeVersion":"22.11.0","dependencies":{"@turf/turf":"^7.3.4"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/laser-design_2.0.1_1773819798976_0.3811058901888824","host":"s3://npm-registry-packages-npm-production"}},"2.0.2":{"name":"laser-design","version":"2.0.2","keywords":[],"author":{"name":"idea"},"license":"ISC","_id":"laser-design@2.0.2","maintainers":[{"name":"idea-laser","email":"laser-itadmin@idea.edu.cn"}],"dist":{"shasum":"2cae4b89ae942152107aee3897bacc511d29ece0","tarball":"https://registry.npmjs.org/laser-design/-/laser-design-2.0.2.tgz","fileCount":73,"integrity":"sha512-FtCFH2+IZ3dYyfozY3munWrd4dkl2QTaSoasmmj1Jt7dSQd9XexTWqDfCef3klUCJvD2QaMfmfNvejOa0upA8w==","signatures":[{"sig":"MEQCIHIOq711R9md9oOysU6IOVHr7a5YLS/1kq2vz02eBPajAiBoMbm0h08sJAjgtDg9GOPTnHmSNETdgbbctyYgvK6yhQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":3522882},"main":"index.js","gitHead":"f847a33dda508e1c47435d6c6af748099459254c","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"idea-laser","email":"laser-itadmin@idea.edu.cn"},"_npmVersion":"10.9.0","description":"基于腾讯地图API的React地图组件库，支持Marker、Icon等功能","directories":{},"_nodeVersion":"22.11.0","dependencies":{"@turf/turf":"^7.3.4"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/laser-design_2.0.2_1773826412148_0.44462168418501213","host":"s3://npm-registry-packages-npm-production"}},"2.0.3":{"name":"laser-design","version":"2.0.3","keywords":[],"author":{"name":"idea"},"license":"ISC","_id":"laser-design@2.0.3","maintainers":[{"name":"idea-laser","email":"laser-itadmin@idea.edu.cn"}],"dist":{"shasum":"392b1d68cb2ec2eda2c63eb00227e2d372be2c7f","tarball":"https://registry.npmjs.org/laser-design/-/laser-design-2.0.3.tgz","fileCount":73,"integrity":"sha512-JMUa8qdtmS2s4grkiMAyU46w9QEtOnXYEpgfGg4hBiFgI/59iWnepPQgHb3rdR1WSnIgk3ZpLiCkqrVeQcZQSw==","signatures":[{"sig":"MEYCIQDguehqGrGwKDcbp2qGIOwdo84A7aAUhE61qGDCQuEVrwIhAIqKnlTammKaU9ATRkJYiZNs1c8Wi3AfLXnDRU5J1WQQ","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":3483954},"main":"index.js","gitHead":"4c4c419eaa919cda9685543d6333306dd9509b95","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"idea-laser","email":"laser-itadmin@idea.edu.cn"},"_npmVersion":"10.8.1","description":"基于腾讯地图API的React地图组件库，支持Marker、Icon等功能","directories":{},"_nodeVersion":"20.14.0","dependencies":{"@turf/turf":"^7.3.4"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/laser-design_2.0.3_1773911343222_0.24959572096738136","host":"s3://npm-registry-packages-npm-production"}},"2.0.4":{"name":"laser-design","version":"2.0.4","keywords":[],"author":{"name":"idea"},"license":"ISC","_id":"laser-design@2.0.4","maintainers":[{"name":"idea-laser","email":"laser-itadmin@idea.edu.cn"}],"dist":{"shasum":"3f13d3c722f6365a875528b1282db9fdc2b8aecc","tarball":"https://registry.npmjs.org/laser-design/-/laser-design-2.0.4.tgz","fileCount":73,"integrity":"sha512-ThjnctHVle+iowJ+o4xa8zVdqklR7zoP6KCyVlT9KfSepWNk/L2U+wlbqGG+4gYQKI9GhCylwIb0AopjAe9+lg==","signatures":[{"sig":"MEQCIAbYMbmZeCK8EzJCxagGWoXfLLSdOUf/h6QkDdgFmDxGAiA2ZF4SMDjFkyhhNjCkIDPv+slphKek0/clGBxdQvNdFg==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":3483454},"main":"index.js","gitHead":"effe21c42517fb14e78a8925cf5f2af7d76370d3","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"idea-laser","email":"laser-itadmin@idea.edu.cn"},"_npmVersion":"10.8.1","description":"基于腾讯地图API的React地图组件库，支持Marker、Icon等功能","directories":{},"_nodeVersion":"20.14.0","dependencies":{"@turf/turf":"^7.3.4"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/laser-design_2.0.4_1773973210029_0.20487681087593024","host":"s3://npm-registry-packages-npm-production"}},"2.0.5":{"name":"laser-design","version":"2.0.5","keywords":[],"author":{"name":"idea"},"license":"ISC","_id":"laser-design@2.0.5","maintainers":[{"name":"idea-laser","email":"laser-itadmin@idea.edu.cn"}],"dist":{"shasum":"12fd343a807f327cb1e75913159703f344f4b13c","tarball":"https://registry.npmjs.org/laser-design/-/laser-design-2.0.5.tgz","fileCount":73,"integrity":"sha512-Hc+Coj2A7preTpkYAeeN8fBBuWHbkD6wXNMCWRsmMraZBHCghl6IWRo51pSdMDY8+IAPthgbDZ8nZw2XS97DRQ==","signatures":[{"sig":"MEYCIQCkYU3htSkI/cXTQB3XmrS5f0yBHZxAa/jWg+wB4BDi+QIhAJrHjEom94MfFq261oRX4PcoqBceFJrQid6gBv88JgwE","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":3485562},"main":"index.js","gitHead":"560b102231771c18b2d25fe94ec1bf9b3dd2b59b","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"idea-laser","email":"laser-itadmin@idea.edu.cn"},"_npmVersion":"10.8.1","description":"基于腾讯地图API的React地图组件库，支持Marker、Icon等功能","directories":{},"_nodeVersion":"20.14.0","dependencies":{"@turf/turf":"^7.3.4"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/laser-design_2.0.5_1773992409813_0.5433594427025126","host":"s3://npm-registry-packages-npm-production"}},"2.0.6":{"name":"laser-design","version":"2.0.6","author":{"url":"https://www.silassz.com","name":"粤港澳大湾区数字经济研究院-低空经济分院"},"license":"Apache-2.0","_id":"laser-design@2.0.6","maintainers":[{"name":"idea-laser","email":"laser-itadmin@idea.edu.cn"}],"homepage":"https://github.com/IDEA-LASER/laser-design#readme","bugs":{"url":"https://github.com/IDEA-LASER/laser-design/issues"},"dist":{"shasum":"f338bf89db959eeea343f7e1570d8afd7819aae8","tarball":"https://registry.npmjs.org/laser-design/-/laser-design-2.0.6.tgz","fileCount":74,"integrity":"sha512-01sC4hN7/OCNRW+yJbqtfgFQdpsjrvcdrfQWErzAJ1u/4H/S98m4aijicP6XOsPjok2O1HUGlN8Mzu5T65Y/jQ==","signatures":[{"sig":"MEYCIQCiiM1zU10mHIAJkWRJ7pFzA/qwJgYKqcA9mMDSe5Fc5gIhAIZHauWmCC5Vz/OfpBXyOfxWqb7RgCNPBPBmyRK6Lpwp","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":3510490},"main":"index.js","gitHead":"5cc959b7069feb67334781221f40df4c8505a5e0","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_npmUser":{"name":"idea-laser","email":"laser-itadmin@idea.edu.cn"},"repository":{"url":"git+https://github.com/IDEA-LASER/laser-design.git","type":"git"},"_npmVersion":"10.9.2","description":"基于腾讯地图API的React地图组件库，支持Marker、Icon等功能","directories":{},"_nodeVersion":"22.17.1","dependencies":{"@turf/turf":"^7.3.4"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/laser-design_2.0.6_1774927580818_0.9839319720377393","host":"s3://npm-registry-packages-npm-production"}},"2.0.7":{"name":"laser-design","version":"2.0.7","main":"index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"license":"Apache-2.0","repository":{"type":"git","url":"git+https://github.com/IDEA-LASER/laser-design.git"},"author":{"name":"粤港澳大湾区数字经济研究院-低空经济分院","url":"https://www.silassz.com"},"description":"基于腾讯地图API的React地图组件库，支持Marker、Icon等功能","dependencies":{"@turf/turf":"^7.3.4"},"_id":"laser-design@2.0.7","gitHead":"0e6fba913e2c63fcfbec4df9c45a579e2bf2315b","bugs":{"url":"https://github.com/IDEA-LASER/laser-design/issues"},"homepage":"https://github.com/IDEA-LASER/laser-design#readme","_nodeVersion":"22.17.1","_npmVersion":"10.9.2","dist":{"integrity":"sha512-csumcqk53/t3DGawY2K7NlmthymsmtHuldzATqdB9IauWOmAbspNmw3+73oxo9PqjHOXFTFdrZuWLTydW1i8TQ==","shasum":"2763c53c0f5bbedc5a0e2ecefa849b4fb4897009","tarball":"https://registry.npmjs.org/laser-design/-/laser-design-2.0.7.tgz","fileCount":74,"unpackedSize":3510490,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIFERYTKXnRtw23hc+zGX8OfMfv/sTBNXmjGOZ9/bUg/ZAiEA+lOKgWvH9mjmIJ9qfnQfjQUrogEIk8ZD8xAPoL4Osqs="}]},"_npmUser":{"name":"idea-laser","email":"laser-itadmin@idea.edu.cn"},"directories":{},"maintainers":[{"name":"idea-laser","email":"laser-itadmin@idea.edu.cn"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/laser-design_2.0.7_1774929686876_0.5957832424990936"},"_hasShrinkwrap":false}},"time":{"created":"2026-03-18T03:44:30.778Z","modified":"2026-03-31T04:01:27.228Z","1.0.0":"2025-11-04T07:25:27.165Z","1.1.0":"2025-11-04T07:31:44.608Z","1.2.0":"2025-12-02T07:00:26.828Z","1.3.0":"2025-12-06T03:54:18.676Z","1.4.0":"2025-12-06T06:30:39.494Z","1.4.1":"2025-12-06T06:51:41.232Z","1.4.2":"2025-12-06T07:25:38.184Z","1.4.3":"2025-12-06T07:38:41.667Z","1.4.4":"2025-12-06T07:47:19.692Z","1.4.5":"2025-12-09T02:24:47.597Z","1.4.8":"2025-12-12T10:39:56.200Z","1.4.9":"2025-12-17T03:32:41.725Z","1.5.0":"2025-12-17T06:26:52.888Z","1.5.1":"2025-12-17T06:37:57.209Z","1.5.2":"2025-12-17T09:33:46.703Z","1.5.3":"2025-12-18T01:46:17.444Z","1.5.4":"2025-12-18T03:37:03.347Z","1.5.5":"2025-12-18T05:41:30.264Z","1.5.6":"2025-12-18T08:29:25.509Z","1.5.7":"2026-03-16T01:59:22.778Z","1.0.5":"2026-03-16T06:46:00.195Z","1.0.6":"2026-03-16T08:29:32.714Z","1.0.7":"2026-03-16T08:36:38.165Z","1.0.8":"2026-03-16T08:44:08.374Z","1.0.9":"2026-03-16T08:46:33.197Z","1.0.1":"2026-03-16T08:53:58.181Z","1.0.2":"2026-03-16T09:08:08.166Z","1.0.3":"2026-03-16T09:14:03.650Z","1.0.4":"2026-03-16T09:21:36.373Z","0.0.1":"2026-03-16T09:25:57.893Z","0.0.2":"2026-03-16T09:43:42.233Z","0.0.3":"2026-03-16T10:02:08.685Z","0.0.4":"2026-03-16T10:05:20.855Z","2.0.0":"2026-03-18T03:44:30.970Z","2.0.1":"2026-03-18T07:43:19.166Z","2.0.2":"2026-03-18T09:33:32.355Z","2.0.3":"2026-03-19T09:09:03.400Z","2.0.4":"2026-03-20T02:20:10.228Z","2.0.5":"2026-03-20T07:40:10.054Z","2.0.6":"2026-03-31T03:26:21.031Z","2.0.7":"2026-03-31T04:01:27.118Z"},"bugs":{"url":"https://github.com/IDEA-LASER/laser-design/issues"},"author":{"name":"粤港澳大湾区数字经济研究院-低空经济分院","url":"https://www.silassz.com"},"license":"Apache-2.0","homepage":"https://github.com/IDEA-LASER/laser-design#readme","repository":{"type":"git","url":"git+https://github.com/IDEA-LASER/laser-design.git"},"description":"基于腾讯地图API的React地图组件库，支持Marker、Icon等功能","maintainers":[{"name":"idea-laser","email":"laser-itadmin@idea.edu.cn"}],"readme":"# LASER Design\r\n\r\nLASER Design基于低空UI设计规范及其标准，为React开发者提供了一套功能完备、开箱即用的高质量组件集合，致力于将设计系统的一致性高效转化为代码实现。LASER Design将设计原则转化为可复用的代码标准，规范了低空领域界面视觉与开发的统一语言。通过标准化的文档说明，帮助低空行业的可视化开发者快速理解组件作用与可视化表现形式，赋能开发者，构建互联互通的低空未来。\r\n\r\n## 前置准备\r\n\r\n以腾讯地图为例，以下是一些前置准备工作。\r\n\r\n### 1. 部署地图/位置服务（以腾讯地图为例）\r\n\r\n*   注册并登录 腾讯位置服务控制台，成为腾讯位置服务开发者；&#x20;\r\n*   展开应用管理菜单，并选择我的应用。点击右侧创建应用，如果已经创建过应用，可以直接选择添加Key。（Javascript API GL 并不需要勾选任何产品，直接创建 Key 就可以使用）&#x20;\r\n*   引入 script 标签加载 API 服务，具体格式如下。其中的详细参数说明可参考相关文档。\r\n\r\n\r\n\r\n```javascript\r\n// 声明：获取和使用腾讯地图相关的账号及功能，需要遵循腾讯地图相关的隐私协议和服务协议\r\n// 腾讯地图服务协议：https://rule.tencent.com/rule/0c5ee022-04cf-4614-a116-32d9f362552a\r\n// 腾讯地图隐私协议：https://privacy.qq.com/document/preview/4cf61fd47f584dae83758bb0f11c1533\r\n\r\n<script charset=\"utf-8\" src=\"https://map.qq.com/api/gljs?v=1.exp&key=YOUR_KEY\"></script>\r\n```\r\n\r\n### 2. 安装相关其他工具\r\n\r\n*   安装Node.Js\r\n\r\n    Node.Js 安装包及源码下载地址为：<https://nodejs.org/en/download/>\r\n\r\n*   安装React\r\n\r\n    React 下载地址：<https://react.dev/>\r\n\r\n## 安装组件库\r\n\r\n使用如下命令行安装组件库：\r\n\r\n```bash\r\nnpm install laser-design\r\n```\r\n\r\n## 初始化地图\r\n\r\n*   申明地图来源\r\n\r\n    LASER Design 示例中，使用的地图相关组件均来自 腾讯地图 。\r\n\r\n*   初始化地图\r\n\r\n```javascript\r\nimport { useRef, useEffect } from 'react';\r\n\r\nexport default () => {\r\n  // 地图容器ref\r\n  const containerRef = useRef(null)\r\n\r\n  useEffect(() => {\r\n\r\n    // 初始化地图\r\n    const map = new TMap.Map(containerRef.current, {\r\n      zoom: 17, //地图缩放级别\r\n      mapStyleId: 'style1', //地图样式id\r\n      center: new TMap.LatLng(39.98210863924864, 116.31310899739151), //地图中心点经纬度\r\n      pitch: 0, //地图俯仰角度，取值范围为0~80\r\n      rotation: 0, //地图在水平面上的旋转角度\r\n    });\r\n\r\n    return () => { map.destroy() }\r\n\r\n  }, [])\r\n\r\n  return <div \r\n    ref={containerRef} \r\n    style={{ width: '100vw', height: '100vh' }} \r\n  />\r\n}\r\n```\r\n\r\n## 基础图标绘制\r\n\r\n```javascript\r\nimport { BaseIconDrawer } from 'laser-design';\r\n\r\nconst icon = new BaseIconDrawer({\r\n  map: map,\r\n  lat: 30.244831,\r\n  lng: 120.151634,\r\n  type: 'UAV-Compliant',\r\n  width: 40,\r\n  height: 40\r\n});\r\n```\r\n\r\n## 开源协议声明\r\n\r\nLASER Design 组件库使用Apache 2.0开源协议。详见：https://opensource.org/license/apache-2.0 \r\n * 补充说明：\r\n    1. 本文件中涉及的腾讯地图相关功能，基于腾讯位置服务API开发，使用需遵守《腾讯位置服务开放API服务协议》及相关隐私服务协议，需申请并使用合法的腾讯地图API Key。\r\n    2. 本组件库开发使用过程涉及React相关功能，需遵循相应的开源协议等，详见：<br>\r\n    https://github.com/facebook/react?tab=MIT-1-ov-file#readme\r\n    3. 本组件库开发使用过程涉及node.js相关功能，需遵循相应的开源协议等，详见：<br>\r\n    https://github.com/nodejs/node?tab=License-1-ov-file#readme\r\n    4. 本组件库开发使用过程涉及Turf.js相关功能，需遵循相应的开源协议等，详见：<br>\r\n    https://github.com/Turfjs/turf?tab=MIT-1-ov-file#readme","readmeFilename":"README.md"}