mirror of https://gitee.com/antv-l7/antv-l7
1 line
78 KiB
JSON
1 line
78 KiB
JSON
{"componentChunkName":"component---node-modules-antv-gatsby-theme-antv-site-templates-document-tsx","path":"/en/docs/api/l7","result":{"data":{"site":{"siteMetadata":{"title":"L7","githubUrl":"https://github.com/antvis/L7","docs":[{"slug":"api/l7","title":{"zh":"简介 L7","en":"Introduction"},"order":0},{"slug":"api/l7stable","title":{"zh":"1.x 稳定版","en":"1.x Stable"},"order":1},{"slug":"tutorial","title":{"zh":"快速入门","en":"QuickStart"},"order":0},{"slug":"tutorial/map","title":{"zh":"地图","en":"Map"},"order":3},{"slug":"api/scene","title":{"zh":"场景 Scene","en":"Scene"},"order":1},{"slug":"api/layer","title":{"zh":"图层 Layer","en":"Layer"},"order":3},{"slug":"api/layer/point_layer","title":{"zh":"点图层","en":"PointLayer"},"order":1},{"slug":"api/layer/line_layer","title":{"zh":"线图层","en":"LineLayer"},"order":2},{"slug":"api/layer/polygon_layer","title":{"zh":"面图层","en":"PolygonLayer"},"order":3},{"slug":"api/layer/heatmap_layer","title":{"zh":"热力图","en":"HeatmapLayer"},"order":4},{"slug":"api/layer/image_layer","title":{"zh":"图片图层","en":"IMageLayer"},"order":5},{"slug":"api/layer/raster_layer","title":{"zh":"栅格图","en":"RasterLayer"},"order":6},{"slug":"api/layer/cityBuilding","title":{"zh":"城市建筑","en":"CityBuilding"},"order":8},{"slug":"api/source","title":{"zh":"数据 Source","en":"Source"},"order":2},{"slug":"api/component","title":{"zh":"组件 Component","en":"Component"},"order":4}]},"pathPrefix":""},"markdownRemark":{"html":"<p>An open source large-scale geospatial data visualization analysis development framework powered by WebGL.</p>\n<p>L7 是由蚂蚁金服 AntV 数据可视化团队推出的基于 WebGL 的开源大规模地理空间数据可视分析开发框架。L7 中的 L 代表 Location，7 代表世界七大洲，寓意能为全球位置数据提供可视分析的能力。L7 以图形符号学为理论基础，将抽象复杂的空间数据转化成 2D、3D 符号，通过颜色、大小、体积、纹理等视觉变量实现丰富的可视化表达。</p>\n<video id=\"video\" controls=\"\" preload=\"none\" poster=\"https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*rjkiQLCoZxUAAAAAAAAAAABkARQnAQ\">\n<source id=\"mp4\" src=\"https://gw.alipayobjects.com/mdn/antv_site/afts/file/A*viKwSJl2OGIAAAAAAAAAAABkARQnAQ\"; type=\"video/map4\">\n <source id=\"webm\" src=\"https://gw.alipayobjects.com/os/basement_prod/65d5dbe8-d78d-4c6b-9318-fa06b1456784.webm\" type=\"video/webm\">\n <source id=\"ogv\" src=\"https://media.w3.org/2010/05/sintel/trailer.ogv\" type=\"video/ogg\">\n<p>Your user agent does not support the HTML5 Video element.</p>\n</video>\n<p>✨ 2020.01.06 2.0 版本正式发布</p>\n<p>1.x 版本的用户需求我们持续跟进 <a href=\"https://antv-2018.alipay.com/zh-cn/l7/1.x/index.html\" target=\"_self\" rel=\"nofollow\">旧版官网地址</a></p>\n<h2 id=\"核心特性\" style=\"position:relative;\"><a href=\"#%E6%A0%B8%E5%BF%83%E7%89%B9%E6%80%A7\" aria-label=\"核心特性 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>核心特性</h2>\n<p>🌏 数据驱动可视化展示</p>\n<p>数据驱动，从数到形，支持丰富的地图可视化类型，更好洞察数据。</p>\n<p>🌏 2D，3D 一体化的海量数据高性能渲染</p>\n<p>百万级空间数据实时，动态渲染。</p>\n<p>🌏 简单灵活的数据接入</p>\n<p>支持 CSV，JSON，geojson 等数据格式接入，可以根据需求自定义数据格式，无需复杂的空间数据转换。</p>\n<p>🌏 多地图底图支持，支持离线内网部署</p>\n<p>高德地图国内合法合规的地理底图，Mapbox 满足国际化业务需求。</p>\n<h2 id=\"支持丰富的图表类型\" style=\"position:relative;\"><a href=\"#%E6%94%AF%E6%8C%81%E4%B8%B0%E5%AF%8C%E7%9A%84%E5%9B%BE%E8%A1%A8%E7%B1%BB%E5%9E%8B\" aria-label=\"支持丰富的图表类型 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>支持丰富的图表类型</h2>\n<h3 id=\"点图层\" style=\"position:relative;\"><a href=\"#%E7%82%B9%E5%9B%BE%E5%B1%82\" aria-label=\"点图层 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>点图层</h3>\n<ul>\n<li>气泡图</li>\n<li>散点图</li>\n<li>符号地图</li>\n<li>3D 柱状地图</li>\n<li>聚合地图</li>\n<li>复合图表地图</li>\n<li>自定义 Marker</li>\n</ul>\n<h3 id=\"线图层\" style=\"position:relative;\"><a href=\"#%E7%BA%BF%E5%9B%BE%E5%B1%82\" aria-label=\"线图层 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>线图层</h3>\n<ul>\n<li>路径地图</li>\n<li>弧线，支持 2D 弧线、3D 弧线以及大圆航线</li>\n<li>等值线</li>\n</ul>\n<h3 id=\"面图层\" style=\"position:relative;\"><a href=\"#%E9%9D%A2%E5%9B%BE%E5%B1%82\" aria-label=\"面图层 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>面图层</h3>\n<ul>\n<li>填充图</li>\n<li>3D 填充图</li>\n</ul>\n<h3 id=\"热力图\" style=\"position:relative;\"><a href=\"#%E7%83%AD%E5%8A%9B%E5%9B%BE\" aria-label=\"热力图 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>热力图</h3>\n<ul>\n<li>经典热力图</li>\n<li>蜂窝热力图</li>\n<li>网格热力图</li>\n</ul>\n<h3 id=\"栅格地图\" style=\"position:relative;\"><a href=\"#%E6%A0%85%E6%A0%BC%E5%9C%B0%E5%9B%BE\" aria-label=\"栅格地图 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>栅格地图</h3>\n<ul>\n<li>图片</li>\n<li>Raster</li>\n</ul>\n<h2 id=\"l7-20-roadmap\" style=\"position:relative;\"><a href=\"#l7-20-roadmap\" aria-label=\"l7 20 roadmap permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>L7 2.0 Roadmap</h2>\n<p><img src=\"https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*3j9HTLTQT2MAAAAAAAAAAABkARQnAQ\" alt=\"L7 Road Map\"></p>\n<p>更多技术细节，详细进展，请关注 <a href=\"https://github.com/antvis/L7\" target=\"_self\" rel=\"nofollow\">GitHub</a>，欢迎大家来给点点 Star，让更多人看到这个开源的项目。</p>","tableOfContents":"<ul>\n<li><a href=\"/en/docs/api/l7/#%E6%A0%B8%E5%BF%83%E7%89%B9%E6%80%A7\">核心特性</a></li>\n<li>\n<p><a href=\"/en/docs/api/l7/#%E6%94%AF%E6%8C%81%E4%B8%B0%E5%AF%8C%E7%9A%84%E5%9B%BE%E8%A1%A8%E7%B1%BB%E5%9E%8B\">支持丰富的图表类型</a></p>\n<ul>\n<li><a href=\"/en/docs/api/l7/#%E7%82%B9%E5%9B%BE%E5%B1%82\">点图层</a></li>\n<li><a href=\"/en/docs/api/l7/#%E7%BA%BF%E5%9B%BE%E5%B1%82\">线图层</a></li>\n<li><a href=\"/en/docs/api/l7/#%E9%9D%A2%E5%9B%BE%E5%B1%82\">面图层</a></li>\n<li><a href=\"/en/docs/api/l7/#%E7%83%AD%E5%8A%9B%E5%9B%BE\">热力图</a></li>\n<li><a href=\"/en/docs/api/l7/#%E6%A0%85%E6%A0%BC%E5%9C%B0%E5%9B%BE\">栅格地图</a></li>\n</ul>\n</li>\n<li><a href=\"/en/docs/api/l7/#l7-20-roadmap\">L7 2.0 Roadmap</a></li>\n</ul>","fields":{"slug":"/en/docs/api/l7","readingTime":{"text":"1 min read","time":42599.99999999999}},"frontmatter":{"title":"Introduction"},"parent":{"relativePath":"api/l7.en.md"}},"allMarkdownRemark":{"edges":[{"node":{"fields":{"slug":"/en/examples/gallery"},"frontmatter":{"title":"Gallery","order":-1}}},{"node":{"fields":{"slug":"/zh/examples/gallery"},"frontmatter":{"title":"所有图表","order":-1}}},{"node":{"fields":{"slug":"/zh/docs/tutorial/quickstart"},"frontmatter":{"title":"快速上手","order":0}}},{"node":{"fields":{"slug":"/en/docs/tutorial/quickstart"},"frontmatter":{"title":"QuickStart","order":0}}},{"node":{"fields":{"slug":"/en/docs/api/l7"},"frontmatter":{"title":"Introduction","order":0}}},{"node":{"fields":{"slug":"/zh/docs/api/l7"},"frontmatter":{"title":"简介","order":0}}},{"node":{"fields":{"slug":"/en/docs/tutorial/map/amap"},"frontmatter":{"title":"GaodeMap BaseMap","order":0}}},{"node":{"fields":{"slug":"/zh/docs/tutorial/map/amap"},"frontmatter":{"title":"高德地图","order":0}}},{"node":{"fields":{"slug":"/en/docs/tutorial/map/mapbox"},"frontmatter":{"title":"MapBox BaseMap","order":0}}},{"node":{"fields":{"slug":"/zh/docs/tutorial/map/mapbox"},"frontmatter":{"title":"MapBox地图","order":0}}},{"node":{"fields":{"slug":"/en/docs/api/source/source"},"frontmatter":{"title":"Source","order":0}}},{"node":{"fields":{"slug":"/zh/docs/api/source/source"},"frontmatter":{"title":"Source","order":0}}},{"node":{"fields":{"slug":"/en/docs/api/layer/layer"},"frontmatter":{"title":"Map Layer","order":0}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/layer"},"frontmatter":{"title":"Layer","order":0}}},{"node":{"fields":{"slug":"/zh/docs/api/component/popup"},"frontmatter":{"title":"popup","order":0}}},{"node":{"fields":{"slug":"/en/docs/api/layer/polygon_layer/polygonlayer"},"frontmatter":{"title":"PolygonLayer","order":0}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/polygon_layer/polygonlayer"},"frontmatter":{"title":"PolygonLayer","order":0}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/point_layer/pointlayer"},"frontmatter":{"title":"PointLayer","order":0}}},{"node":{"fields":{"slug":"/en/docs/api/layer/point_layer/pointlayer"},"frontmatter":{"title":"PointLayer","order":0}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/line_layer/linelayer"},"frontmatter":{"title":"LineLayer","order":0}}},{"node":{"fields":{"slug":"/en/examples/tutorial/map"},"frontmatter":{"title":"map","order":0}}},{"node":{"fields":{"slug":"/zh/examples/tutorial/map"},"frontmatter":{"title":"地图","order":0}}},{"node":{"fields":{"slug":"/en/examples/raster/basic"},"frontmatter":{"title":"Raster Map","order":0}}},{"node":{"fields":{"slug":"/zh/examples/raster/basic"},"frontmatter":{"title":"栅格图层","order":0}}},{"node":{"fields":{"slug":"/en/examples/polygon/3d"},"frontmatter":{"title":"Extrude Map","order":0}}},{"node":{"fields":{"slug":"/en/examples/polygon/fill"},"frontmatter":{"title":"Choropleth Map","order":0}}},{"node":{"fields":{"slug":"/zh/examples/polygon/fill"},"frontmatter":{"title":"填充地图","order":0}}},{"node":{"fields":{"slug":"/zh/examples/polygon/3d"},"frontmatter":{"title":"3D填充图","order":0}}},{"node":{"fields":{"slug":"/en/examples/point/bubble"},"frontmatter":{"title":"Bubble Map","order":0}}},{"node":{"fields":{"slug":"/zh/examples/point/bubble"},"frontmatter":{"title":"气泡地图","order":0}}},{"node":{"fields":{"slug":"/en/examples/line/path"},"frontmatter":{"title":"Path Map","order":0}}},{"node":{"fields":{"slug":"/en/examples/heatmap/heatmap"},"frontmatter":{"title":"HeatMap","order":0}}},{"node":{"fields":{"slug":"/zh/examples/line/path"},"frontmatter":{"title":"路径地图","order":0}}},{"node":{"fields":{"slug":"/zh/examples/heatmap/heatmap"},"frontmatter":{"title":"经典热力图","order":0}}},{"node":{"fields":{"slug":"/en/examples/gallery/animate"},"frontmatter":{"title":"Animate","order":0}}},{"node":{"fields":{"slug":"/zh/examples/gallery/animate"},"frontmatter":{"title":"动画","order":0}}},{"node":{"fields":{"slug":"/en/docs/tutorial/demo"},"frontmatter":{"title":"How to start the demo locally","order":1}}},{"node":{"fields":{"slug":"/zh/docs/tutorial/demo"},"frontmatter":{"title":"如何在本地运行demo","order":1}}},{"node":{"fields":{"slug":"/en/docs/api/source/geojson"},"frontmatter":{"title":"GeoJSON","order":1}}},{"node":{"fields":{"slug":"/zh/docs/api/source/geojson"},"frontmatter":{"title":"GeoJSON","order":1}}},{"node":{"fields":{"slug":"/en/docs/api/component/control"},"frontmatter":{"title":"Control","order":1}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/polygon_layer/extrude"},"frontmatter":{"title":"3D填充图","order":1}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/polygon_layer/fill"},"frontmatter":{"title":"填充图","order":1}}},{"node":{"fields":{"slug":"/en/docs/api/layer/point_layer/bubble"},"frontmatter":{"title":"气泡图","order":1}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/point_layer/bubble"},"frontmatter":{"title":"气泡图","order":1}}},{"node":{"fields":{"slug":"/en/docs/api/layer/line_layer/arc"},"frontmatter":{"title":"弧线图","order":1}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/line_layer/arc"},"frontmatter":{"title":"弧线图","order":1}}},{"node":{"fields":{"slug":"/en/docs/api/layer/line_layer/path"},"frontmatter":{"title":"Path","order":1}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/line_layer/path"},"frontmatter":{"title":"路径图","order":1}}},{"node":{"fields":{"slug":"/en/docs/api/layer/heatmap_layer/hexagon"},"frontmatter":{"title":"Hexagon HeatMap","order":1}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/heatmap_layer/grid"},"frontmatter":{"title":"网格热力图","order":1}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/heatmap_layer/hexagon"},"frontmatter":{"title":"蜂窝热力图","order":1}}},{"node":{"fields":{"slug":"/en/docs/api/layer/heatmap_layer/normal"},"frontmatter":{"title":"经典热力图","order":1}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/heatmap_layer/normal"},"frontmatter":{"title":"经典热力图","order":1}}},{"node":{"fields":{"slug":"/en/examples/point/text"},"frontmatter":{"title":"label","order":1}}},{"node":{"fields":{"slug":"/en/examples/point/scatter"},"frontmatter":{"title":"Scatter Map","order":1}}},{"node":{"fields":{"slug":"/zh/examples/point/text"},"frontmatter":{"title":"文本标注","order":1}}},{"node":{"fields":{"slug":"/zh/examples/point/scatter"},"frontmatter":{"title":"散点地图","order":1}}},{"node":{"fields":{"slug":"/en/examples/point/dot"},"frontmatter":{"title":"Dot Intensity","order":1}}},{"node":{"fields":{"slug":"/en/examples/point/cluster"},"frontmatter":{"title":"Cluster Map","order":1}}},{"node":{"fields":{"slug":"/zh/examples/point/cluster"},"frontmatter":{"title":"聚合图","order":1}}},{"node":{"fields":{"slug":"/zh/examples/point/dot"},"frontmatter":{"title":"亮度图","order":1}}},{"node":{"fields":{"slug":"/en/examples/heatmap/hexagon"},"frontmatter":{"title":"Hexagon Map","order":1}}},{"node":{"fields":{"slug":"/en/examples/gallery/basic"},"frontmatter":{"title":"Featured","order":1}}},{"node":{"fields":{"slug":"/zh/examples/gallery/basic"},"frontmatter":{"title":"基础可视化","order":1}}},{"node":{"fields":{"slug":"/zh/examples/heatmap/hexagon"},"frontmatter":{"title":"蜂窝热力图","order":1}}},{"node":{"fields":{"slug":"/en/examples/heatmap/grid"},"frontmatter":{"title":"Grid Map","order":1}}},{"node":{"fields":{"slug":"/zh/examples/heatmap/grid"},"frontmatter":{"title":"网格热力图","order":1}}},{"node":{"fields":{"slug":"/en/examples/line/arc"},"frontmatter":{"title":"Arc Line Map","order":1}}},{"node":{"fields":{"slug":"/zh/examples/line/arc"},"frontmatter":{"title":"弧线地图","order":1}}},{"node":{"fields":{"slug":"/en/docs/tutorial/data"},"frontmatter":{"title":"Data","order":2}}},{"node":{"fields":{"slug":"/zh/docs/tutorial/data"},"frontmatter":{"title":"数据","order":2}}},{"node":{"fields":{"slug":"/en/docs/api/map"},"frontmatter":{"title":"地图 Map","order":2}}},{"node":{"fields":{"slug":"/zh/docs/api/map"},"frontmatter":{"title":"地图 Map","order":2}}},{"node":{"fields":{"slug":"/en/docs/api/scene"},"frontmatter":{"title":"Scene","order":2}}},{"node":{"fields":{"slug":"/en/docs/tutorial/map/blankmap"},"frontmatter":{"title":"Blank BaseMap With Mapbox","order":2}}},{"node":{"fields":{"slug":"/zh/docs/api/scene"},"frontmatter":{"title":"场景 Scene","order":2}}},{"node":{"fields":{"slug":"/zh/docs/tutorial/map/blankmap"},"frontmatter":{"title":"使用无地图模式","order":2}}},{"node":{"fields":{"slug":"/en/docs/api/source/json"},"frontmatter":{"title":"JSON","order":2}}},{"node":{"fields":{"slug":"/zh/docs/api/source/json"},"frontmatter":{"title":"JSON","order":2}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/point_layer/scatter"},"frontmatter":{"title":"散点图","order":2}}},{"node":{"fields":{"slug":"/en/docs/api/layer/point_layer/scatter"},"frontmatter":{"title":"散点图","order":2}}},{"node":{"fields":{"slug":"/en/docs/api/layer/line_layer/linelayer"},"frontmatter":{"title":"LineLayer","order":2}}},{"node":{"fields":{"slug":"/en/examples/tutorial/marker"},"frontmatter":{"title":"control","order":2}}},{"node":{"fields":{"slug":"/zh/examples/tutorial/marker"},"frontmatter":{"title":"Marker","order":2}}},{"node":{"fields":{"slug":"/zh/examples/tutorial/control"},"frontmatter":{"title":"组件","order":2}}},{"node":{"fields":{"slug":"/en/examples/tutorial/control"},"frontmatter":{"title":"control","order":2}}},{"node":{"fields":{"slug":"/en/examples/point/image"},"frontmatter":{"title":"Symbol Map","order":2}}},{"node":{"fields":{"slug":"/zh/examples/point/image"},"frontmatter":{"title":"符号地图","order":2}}},{"node":{"fields":{"slug":"/en/examples/line/isoline"},"frontmatter":{"title":"Isoline Map","order":2}}},{"node":{"fields":{"slug":"/zh/examples/line/isoline"},"frontmatter":{"title":"等值线地图","order":2}}},{"node":{"fields":{"slug":"/en/docs/api/source/csv"},"frontmatter":{"title":"CSV","order":3}}},{"node":{"fields":{"slug":"/zh/docs/api/source/csv"},"frontmatter":{"title":"CSV","order":3}}},{"node":{"fields":{"slug":"/zh/docs/api/component/marker"},"frontmatter":{"title":"Marker","order":3}}},{"node":{"fields":{"slug":"/en/docs/api/component/marker"},"frontmatter":{"title":"Marker","order":3}}},{"node":{"fields":{"slug":"/zh/docs/api/component/control"},"frontmatter":{"title":"Control","order":3}}},{"node":{"fields":{"slug":"/en/docs/api/layer/point_layer/dot"},"frontmatter":{"title":"亮度图","order":3}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/point_layer/dot"},"frontmatter":{"title":"亮度图","order":3}}},{"node":{"fields":{"slug":"/en/docs/api/source/image"},"frontmatter":{"title":"Image","order":4}}},{"node":{"fields":{"slug":"/zh/docs/api/source/image"},"frontmatter":{"title":"Image","order":4}}},{"node":{"fields":{"slug":"/en/docs/api/component/popup"},"frontmatter":{"title":"Popup","order":4}}},{"node":{"fields":{"slug":"/en/docs/api/layer/point_layer/symbol"},"frontmatter":{"title":"符号图","order":4}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/point_layer/symbol"},"frontmatter":{"title":"符号图","order":4}}},{"node":{"fields":{"slug":"/en/examples/point/column"},"frontmatter":{"title":"Column Map","order":4}}},{"node":{"fields":{"slug":"/zh/examples/point/column"},"frontmatter":{"title":"3D 柱状地图","order":4}}},{"node":{"fields":{"slug":"/en/docs/api/source/raster"},"frontmatter":{"title":"Raster","order":5}}},{"node":{"fields":{"slug":"/zh/docs/api/source/raster"},"frontmatter":{"title":"栅格","order":5}}},{"node":{"fields":{"slug":"/en/docs/api/layer/imagelayer"},"frontmatter":{"title":"ImageLayer","order":5}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/imagelayer"},"frontmatter":{"title":"图片图层","order":5}}},{"node":{"fields":{"slug":"/en/docs/api/layer/raster_layer"},"frontmatter":{"title":"Raster","order":5}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/raster_layer"},"frontmatter":{"title":"栅格图层","order":5}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/point_layer/cluster"},"frontmatter":{"title":"聚合图","order":5}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/point_layer/column"},"frontmatter":{"title":"3D 柱图","order":5}}},{"node":{"fields":{"slug":"/en/docs/api/layer/point_layer/cluster"},"frontmatter":{"title":"聚合图","order":5}}},{"node":{"fields":{"slug":"/en/docs/api/layer/cityBuilding"},"frontmatter":{"title":"CityBuilding","order":6}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/cityBuilding"},"frontmatter":{"title":"城市建筑","order":6}}},{"node":{"fields":{"slug":"/en/docs/api/layer/point_layer/chart"},"frontmatter":{"title":"复合图表地图","order":6}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/point_layer/chart"},"frontmatter":{"title":"复合图表地图","order":6}}},{"node":{"fields":{"slug":"/en/examples/point/chart"},"frontmatter":{"title":"Chart Map","order":6}}},{"node":{"fields":{"slug":"/zh/examples/point/chart"},"frontmatter":{"title":"复合图表地图","order":6}}},{"node":{"fields":{"slug":"/en/docs/api/layer/point_layer/marker"},"frontmatter":{"title":"自定义 Marker","order":7}}},{"node":{"fields":{"slug":"/zh/docs/api/layer/point_layer/marker"},"frontmatter":{"title":"自定义 Marker","order":7}}},{"node":{"fields":{"slug":"/en/examples/point/marker"},"frontmatter":{"title":"Custom Marker","order":7}}},{"node":{"fields":{"slug":"/zh/examples/point/marker"},"frontmatter":{"title":"自定义 Marker","order":7}}},{"node":{"fields":{"slug":"/zh/docs/api/l7history"},"frontmatter":{"title":"1.x 历史版本","order":9}}},{"node":{"fields":{"slug":"/en/docs/api/l7history"},"frontmatter":{"title":"1.x history","order":9}}},{"node":{"fields":{"slug":"/en/docs/api/changelog"},"frontmatter":{"title":"ChangeLog","order":10}}},{"node":{"fields":{"slug":"/zh/docs/api/changelog"},"frontmatter":{"title":"发布日志","order":10}}},{"node":{"fields":{"slug":"/en/docs/api/layer/heatmap_layer/grid"},"frontmatter":{"title":"","order":null}}}]}},"pageContext":{"prev":{"node":{"fields":{"slug":"/en/docs/api/layer/point_layer/marker"},"frontmatter":{"title":"自定义 Marker","order":7},"html":"<p>可自定义点符号，通过自定义dom实现地图标注，富文本、动态点状符号都可用于地图上信息的标记。</p>\n<h2 id=\"使用\" style=\"position:relative;\"><a href=\"#%E4%BD%BF%E7%94%A8\" aria-label=\"使用 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>使用</h2>\n<p><a href=\"../../component\">Marker 文档</a></p>"}},"next":{"node":{"fields":{"slug":"/en/docs/api/scene"},"frontmatter":{"title":"Scene","order":2},"html":"<h1 id=\"简介\" style=\"position:relative;\"><a href=\"#%E7%AE%80%E4%BB%8B\" aria-label=\"简介 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>简介</h1>\n<h2 id=\"scene\" style=\"position:relative;\"><a href=\"#scene\" aria-label=\"scene permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Scene</h2>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\"><span class=\"token comment\">// Module 引用</span>\n<span class=\"token keyword\">import</span> <span class=\"token punctuation\">{</span> Scene <span class=\"token punctuation\">}</span> <span class=\"token keyword\">from</span> <span class=\"token string\">'@antv/l7'</span><span class=\"token punctuation\">;</span>\n<span class=\"token keyword\">import</span> <span class=\"token punctuation\">{</span> GaodeMap <span class=\"token punctuation\">}</span> <span class=\"token keyword\">from</span> <span class=\"token string\">'@antv/l7-maps'</span><span class=\"token punctuation\">;</span>\n<span class=\"token keyword\">const</span> scene <span class=\"token operator\">=</span> <span class=\"token keyword\">new</span> <span class=\"token class-name\">Scene</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">{</span>\n id<span class=\"token operator\">:</span> <span class=\"token string\">'map'</span><span class=\"token punctuation\">,</span>\n map<span class=\"token operator\">:</span> <span class=\"token keyword\">new</span> <span class=\"token class-name\">GaodeMap</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">{</span>\n style<span class=\"token operator\">:</span> <span class=\"token string\">'dark'</span><span class=\"token punctuation\">,</span>\n center<span class=\"token operator\">:</span> <span class=\"token punctuation\">[</span><span class=\"token number\">110.770672</span><span class=\"token punctuation\">,</span> <span class=\"token number\">34.159869</span><span class=\"token punctuation\">]</span><span class=\"token punctuation\">,</span>\n pitch<span class=\"token operator\">:</span> <span class=\"token number\">45</span><span class=\"token punctuation\">,</span>\n <span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">,</span>\n<span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n\n<span class=\"token comment\">// CDN 使用方法</span>\n<span class=\"token keyword\">const</span> scene <span class=\"token operator\">=</span> <span class=\"token keyword\">new</span> <span class=\"token class-name\">L7<span class=\"token punctuation\">.</span>Scene</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">{</span>\n id<span class=\"token operator\">:</span> <span class=\"token string\">'map'</span><span class=\"token punctuation\">,</span>\n map<span class=\"token operator\">:</span> <span class=\"token keyword\">new</span> <span class=\"token class-name\">L7<span class=\"token punctuation\">.</span>GaodeMap</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">{</span>\n style<span class=\"token operator\">:</span> <span class=\"token string\">'dark'</span><span class=\"token punctuation\">,</span>\n center<span class=\"token operator\">:</span> <span class=\"token punctuation\">[</span><span class=\"token number\">110.770672</span><span class=\"token punctuation\">,</span> <span class=\"token number\">34.159869</span><span class=\"token punctuation\">]</span><span class=\"token punctuation\">,</span>\n pitch<span class=\"token operator\">:</span> <span class=\"token number\">45</span><span class=\"token punctuation\">,</span>\n <span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">,</span>\n<span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre></div>\n<h2 id=\"map\" style=\"position:relative;\"><a href=\"#map\" aria-label=\"map permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Map</h2>\n<p>L7 地理可视化侧重于地理数据的可视化表达，地图层需要依赖第三方地图，第三方地图通过 Scene 统一创建，创建管理\n只需要通过 Scene 传入地图配置项即可。</p>\n<p>目前 L7 支持两种地图底图</p>\n<ul>\n<li>高德地图 国内业务场景 合规中国地图</li>\n<li>MapBox 国际业务，或者内网离线部署场景</li>\n</ul>\n<h3 id=\"map-1\" style=\"position:relative;\"><a href=\"#map-1\" aria-label=\"map 1 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>map</h3>\n<p>可以通过 scene map 属性获取 map 实例</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\"><span class=\"token keyword\">const</span> map <span class=\"token operator\">=</span> scene<span class=\"token punctuation\">.</span>map<span class=\"token punctuation\">;</span>\n</code></pre></div>\n<p>为了统一不同底图之前的接口差异 L7 在 scene 层对 map 的方法做了统一，因此一些地图的操作方法可以通过 scene 调用这样，切换不同底图时保证表现一致。</p>\n<p>示例代码</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\"><span class=\"token keyword\">const</span> scene <span class=\"token operator\">=</span> <span class=\"token keyword\">new</span> <span class=\"token class-name\">L7<span class=\"token punctuation\">.</span>Scene</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">{</span>\n id<span class=\"token operator\">:</span> <span class=\"token string\">'map'</span><span class=\"token punctuation\">,</span>\n map<span class=\"token operator\">:</span> <span class=\"token keyword\">new</span> <span class=\"token class-name\">L7<span class=\"token punctuation\">.</span>GaodeMap</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">{</span>\n style<span class=\"token operator\">:</span> <span class=\"token string\">'dark'</span><span class=\"token punctuation\">,</span>\n center<span class=\"token operator\">:</span> <span class=\"token punctuation\">[</span><span class=\"token number\">110.770672</span><span class=\"token punctuation\">,</span> <span class=\"token number\">34.159869</span><span class=\"token punctuation\">]</span><span class=\"token punctuation\">,</span>\n pitch<span class=\"token operator\">:</span> <span class=\"token number\">45</span><span class=\"token punctuation\">,</span>\n <span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">,</span>\n<span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre></div>\n<h3 id=\"构造函数\" style=\"position:relative;\"><a href=\"#%E6%9E%84%E9%80%A0%E5%87%BD%E6%95%B0\" aria-label=\"构造函数 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>构造函数</h3>\n<p><strong>Scene</strong></p>\n<h2 id=\"配置项\" style=\"position:relative;\"><a href=\"#%E9%85%8D%E7%BD%AE%E9%A1%B9\" aria-label=\"配置项 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>配置项</h2>\n<h3 id=\"地图配置项\" style=\"position:relative;\"><a href=\"#%E5%9C%B0%E5%9B%BE%E9%85%8D%E7%BD%AE%E9%A1%B9\" aria-label=\"地图配置项 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>地图配置项</h3>\n<h3 id=\"id\" style=\"position:relative;\"><a href=\"#id\" aria-label=\"id permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>id</h3>\n<p>需传入 dom 容器或者容器 id {domObject || string} [必选]</p>\n<h3 id=\"zoom\" style=\"position:relative;\"><a href=\"#zoom\" aria-label=\"zoom permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>zoom</h3>\n<p>地图初始显示级别 {number} （0-22）</p>\n<h3 id=\"center\" style=\"position:relative;\"><a href=\"#center\" aria-label=\"center permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>center</h3>\n<p>地图初始中心经纬度 {Lnglat}</p>\n<h3 id=\"pitch\" style=\"position:relative;\"><a href=\"#pitch\" aria-label=\"pitch permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>pitch</h3>\n<p>地图初始俯仰角度 {number} default 0</p>\n<h3 id=\"style\" style=\"position:relative;\"><a href=\"#style\" aria-label=\"style permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>style</h3>\n<p>简化地图样式设置，L7 内置了三种主题默认样式 高德，mapbox 都可以使用</p>\n<ul>\n<li>dark</li>\n<li>light</li>\n<li>normal</li>\n</ul>\n<p>除了内置的样式，你也可以传入自定义的其他属性。</p>\n<p>比如高德地图</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\"><span class=\"token punctuation\">{</span>\n style<span class=\"token operator\">:</span> <span class=\"token string\">'amap://styles/2a09079c3daac9420ee53b67307a8006?isPublic=true'</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// 设置方法和高德地图一致</span>\n<span class=\"token punctuation\">}</span>\n</code></pre></div>\n<h3 id=\"minzoom\" style=\"position:relative;\"><a href=\"#minzoom\" aria-label=\"minzoom permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>minZoom</h3>\n<p>地图最小缩放等级 {number} default 0 (0-22)</p>\n<h3 id=\"maxzoom\" style=\"position:relative;\"><a href=\"#maxzoom\" aria-label=\"maxzoom permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>maxZoom</h3>\n<p>地图最大缩放等级 {number} default 22 (0-22)</p>\n<h3 id=\"rotateenable\" style=\"position:relative;\"><a href=\"#rotateenable\" aria-label=\"rotateenable permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>rotateEnable</h3>\n<p>地图是否可旋转 {Boolean} default true</p>\n<h2 id=\"方法\" style=\"position:relative;\"><a href=\"#%E6%96%B9%E6%B3%95\" aria-label=\"方法 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>方法</h2>\n<h3 id=\"getzoom\" style=\"position:relative;\"><a href=\"#getzoom\" aria-label=\"getzoom permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>getZoom</h3>\n<p>获取当前缩放等级</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">scene<span class=\"token punctuation\">.</span><span class=\"token function\">getZoom</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre></div>\n<p>return {float} 当前缩放等级</p>\n<h3 id=\"getlayers\" style=\"position:relative;\"><a href=\"#getlayers\" aria-label=\"getlayers permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>getLayers()</h3>\n<p>获取所有的地图图层</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">scene<span class=\"token punctuation\">.</span><span class=\"token function\">getLayers</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre></div>\n<p>return 图层数组 {Array}</p>\n<h3 id=\"getcenter\" style=\"position:relative;\"><a href=\"#getcenter\" aria-label=\"getcenter permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>getCenter()</h3>\n<p>获取地图中心点</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">scene<span class=\"token punctuation\">.</span><span class=\"token function\">getCenter</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre></div>\n<p>return {Lnglat} :地图中心点</p>\n<h3 id=\"getsize\" style=\"position:relative;\"><a href=\"#getsize\" aria-label=\"getsize permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>getSize()</h3>\n<p>获取地图容器大小</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">scene<span class=\"token punctuation\">.</span><span class=\"token function\">getSize</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre></div>\n<p>return { Object } 地图容器的 width,height</p>\n<h3 id=\"getpitch\" style=\"position:relative;\"><a href=\"#getpitch\" aria-label=\"getpitch permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>getPitch()</h3>\n<p>获取地图俯仰角</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">scene<span class=\"token punctuation\">.</span><span class=\"token function\">getPitch</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre></div>\n<p>return {number} pitch</p>\n<h3 id=\"setmapstyle\" style=\"position:relative;\"><a href=\"#setmapstyle\" aria-label=\"setmapstyle permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>setMapStyle</h3>\n<p>参数：<code class=\"language-text\">style</code> {string} 地图样式 具体样式格式和各底图设置方法一致</p>\n<p>L7 内置了三种地图样式，AMAP 和 MapBox 都适用</p>\n<ul>\n<li>light</li>\n<li>dark</li>\n<li>normal</li>\n</ul>\n<p>设置地图底图样式的方法</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\"><span class=\"token comment\">// 快捷名称设置</span>\n\nscene<span class=\"token punctuation\">.</span><span class=\"token function\">setMapStyle</span><span class=\"token punctuation\">(</span><span class=\"token string\">'light'</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n\n<span class=\"token comment\">// mapbox 主题设置</span>\nscene<span class=\"token punctuation\">.</span><span class=\"token function\">setMapStyle</span><span class=\"token punctuation\">(</span><span class=\"token string\">'mapbox://styles/mapbox/streets-v11'</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n\n<span class=\"token comment\">// AMap</span>\nscene<span class=\"token punctuation\">.</span><span class=\"token function\">setMapStyle</span><span class=\"token punctuation\">(</span>\n <span class=\"token string\">'amap://styles/2a09079c3daac9420ee53b67307a8006?isPublic=true'</span><span class=\"token punctuation\">,</span>\n<span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre></div>\n<h3 id=\"setcenter\" style=\"position:relative;\"><a href=\"#setcenter\" aria-label=\"setcenter permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>setCenter()</h3>\n<p>设置地图中心点坐标</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">scene<span class=\"token punctuation\">.</span><span class=\"token function\">setCenter</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">[</span>lng<span class=\"token punctuation\">,</span> lat<span class=\"token punctuation\">]</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre></div>\n<p>参数：<code class=\"language-text\">center</code> {LngLat} 地图中心点</p>\n<h3 id=\"setzoomandcenter\" style=\"position:relative;\"><a href=\"#setzoomandcenter\" aria-label=\"setzoomandcenter permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>setZoomAndCenter</h3>\n<p>设置地图等级和中心</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">scene<span class=\"token punctuation\">.</span><span class=\"token function\">setZoomAndCenter</span><span class=\"token punctuation\">(</span>zoom<span class=\"token punctuation\">,</span> center<span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre></div>\n<p>参数：zoom {number}<br />center {LngLat}</p>\n<h3 id=\"setrotation\" style=\"position:relative;\"><a href=\"#setrotation\" aria-label=\"setrotation permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>setRotation</h3>\n<p>设置地图顺时针旋转角度，旋转原点为地图容器中心点，取值范围 [0-360]</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">scene<span class=\"token punctuation\">.</span><span class=\"token function\">setRotation</span><span class=\"token punctuation\">(</span>rotation<span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre></div>\n<p>参数： <code class=\"language-text\">rotation</code> {number}</p>\n<h3 id=\"zoomin\" style=\"position:relative;\"><a href=\"#zoomin\" aria-label=\"zoomin permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>zoomIn</h3>\n<p>地图放大一级</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">scene<span class=\"token punctuation\">.</span><span class=\"token function\">zoomIn</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre></div>\n<h3 id=\"zoomout\" style=\"position:relative;\"><a href=\"#zoomout\" aria-label=\"zoomout permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>zoomOut</h3>\n<p>地图缩小一级</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">scene<span class=\"token punctuation\">.</span><span class=\"token function\">ZoomOUt</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre></div>\n<h3 id=\"panto\" style=\"position:relative;\"><a href=\"#panto\" aria-label=\"panto permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>panTo</h3>\n<p>地图平移到指定的位置</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">scene<span class=\"token punctuation\">.</span><span class=\"token function\">panTo</span><span class=\"token punctuation\">(</span>LngLat<span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre></div>\n<p>参数：<code class=\"language-text\">center</code> LngLat 中心位置坐标</p>\n<h3 id=\"panby\" style=\"position:relative;\"><a href=\"#panby\" aria-label=\"panby permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>panBy</h3>\n<p>以像素为单位沿 X 方向和 Y 方向移动地图</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">scene<span class=\"token punctuation\">.</span><span class=\"token function\">panBy</span><span class=\"token punctuation\">(</span>x<span class=\"token punctuation\">,</span> y<span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre></div>\n<p>参数：<br /><code class=\"language-text\">x</code> {number} 水平方向移动像素 向右为正方向<br /> <code class=\"language-text\">y</code> {number} 垂直方向移动像素 向下为正方向</p>\n<h3 id=\"setpitch\" style=\"position:relative;\"><a href=\"#setpitch\" aria-label=\"setpitch permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>setPitch</h3>\n<p>设置地图仰俯角度</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">scene<span class=\"token punctuation\">.</span><span class=\"token function\">setPitch</span><span class=\"token punctuation\">(</span>pitch<span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre></div>\n<p>参数 :<br /> <code class=\"language-text\">pitch</code> {number}</p>\n<h3 id=\"fitbounds\" style=\"position:relative;\"><a href=\"#fitbounds\" aria-label=\"fitbounds permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>fitBounds</h3>\n<p>地图缩放到某个范围内<br />参数 :<br /> <code class=\"language-text\">extent</code> { array} 经纬度范围 [minlng,minlat,maxlng,maxlat]</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">scene<span class=\"token punctuation\">.</span><span class=\"token function\">fitBounds</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">[</span><span class=\"token number\">112</span><span class=\"token punctuation\">,</span> <span class=\"token number\">32</span><span class=\"token punctuation\">,</span> <span class=\"token number\">114</span><span class=\"token punctuation\">,</span> <span class=\"token number\">35</span><span class=\"token punctuation\">]</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre></div>\n<h3 id=\"removelayer\" style=\"position:relative;\"><a href=\"#removelayer\" aria-label=\"removelayer permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>removeLayer</h3>\n<p>移除 layer</p>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">scene<span class=\"token punctuation\">.</span><span class=\"token function\">removeLayer</span><span class=\"token punctuation\">(</span>layer<span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre></div>\n<p>参数 <code class=\"language-text\">layer</code> {Layer}</p>\n<h2 id=\"事件\" style=\"position:relative;\"><a href=\"#%E4%BA%8B%E4%BB%B6\" aria-label=\"事件 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>事件</h2>\n<h3 id=\"on\" style=\"position:relative;\"><a href=\"#on\" aria-label=\"on permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>on</h3>\n<p>事件监听</p>\n<h4 id=\"参数\" style=\"position:relative;\"><a href=\"#%E5%8F%82%E6%95%B0\" aria-label=\"参数 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>参数</h4>\n<p><code class=\"language-text\">eventName</code> {string} 事件名<br /><code class=\"language-text\">hander</code> {function } 事件回调函数</p>\n<h3 id=\"off\" style=\"position:relative;\"><a href=\"#off\" aria-label=\"off permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>off</h3>\n<p>移除事件监听<br /><code class=\"language-text\">eventName</code> {string} 事件名<br /><code class=\"language-text\">hander</code> {function } 事件回调函数</p>\n<h3 id=\"地图事件\" style=\"position:relative;\"><a href=\"#%E5%9C%B0%E5%9B%BE%E4%BA%8B%E4%BB%B6\" aria-label=\"地图事件 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>地图事件</h3>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">scene<span class=\"token punctuation\">.</span><span class=\"token function\">on</span><span class=\"token punctuation\">(</span><span class=\"token string\">'loaded'</span><span class=\"token punctuation\">,</span> <span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token operator\">=></span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">//地图加载完成触发</span>\nscene<span class=\"token punctuation\">.</span><span class=\"token function\">on</span><span class=\"token punctuation\">(</span><span class=\"token string\">'mapmove'</span><span class=\"token punctuation\">,</span> <span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token operator\">=></span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// 地图平移时触发事件</span>\nscene<span class=\"token punctuation\">.</span><span class=\"token function\">on</span><span class=\"token punctuation\">(</span><span class=\"token string\">'movestart'</span><span class=\"token punctuation\">,</span> <span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token operator\">=></span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// 地图平移开始时触发</span>\nscene<span class=\"token punctuation\">.</span><span class=\"token function\">on</span><span class=\"token punctuation\">(</span><span class=\"token string\">'moveend'</span><span class=\"token punctuation\">,</span> <span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token operator\">=></span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// 地图移动结束后触发，包括平移，以及中心点变化的缩放。如地图有拖拽缓动效果，则在缓动结束后触发</span>\nscene<span class=\"token punctuation\">.</span><span class=\"token function\">on</span><span class=\"token punctuation\">(</span><span class=\"token string\">'zoomchange'</span><span class=\"token punctuation\">,</span> <span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token operator\">=></span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// 地图缩放级别更改后触发</span>\nscene<span class=\"token punctuation\">.</span><span class=\"token function\">on</span><span class=\"token punctuation\">(</span><span class=\"token string\">'zoomstart'</span><span class=\"token punctuation\">,</span> <span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token operator\">=></span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// 缩放开始时触发</span>\nscene<span class=\"token punctuation\">.</span><span class=\"token function\">on</span><span class=\"token punctuation\">(</span><span class=\"token string\">'zoomend'</span><span class=\"token punctuation\">,</span> <span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token operator\">=></span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// 缩放停止时触发</span>\n</code></pre></div>\n<h3 id=\"鼠标事件\" style=\"position:relative;\"><a href=\"#%E9%BC%A0%E6%A0%87%E4%BA%8B%E4%BB%B6\" aria-label=\"鼠标事件 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>鼠标事件</h3>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">scene<span class=\"token punctuation\">.</span><span class=\"token function\">on</span><span class=\"token punctuation\">(</span><span class=\"token string\">'click'</span><span class=\"token punctuation\">,</span> <span class=\"token parameter\">ev</span> <span class=\"token operator\">=></span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// 鼠标左键点击事件</span>\nscene<span class=\"token punctuation\">.</span><span class=\"token function\">on</span><span class=\"token punctuation\">(</span><span class=\"token string\">'dblclick'</span><span class=\"token punctuation\">,</span> <span class=\"token parameter\">ev</span> <span class=\"token operator\">=></span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// 鼠标左键双击事件</span>\nscene<span class=\"token punctuation\">.</span><span class=\"token function\">on</span><span class=\"token punctuation\">(</span><span class=\"token string\">'mousemove'</span><span class=\"token punctuation\">,</span> <span class=\"token parameter\">ev</span> <span class=\"token operator\">=></span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// 鼠标在地图上移动时触发</span>\nscene<span class=\"token punctuation\">.</span><span class=\"token function\">on</span><span class=\"token punctuation\">(</span><span class=\"token string\">'mousewheel'</span><span class=\"token punctuation\">,</span> <span class=\"token parameter\">ev</span> <span class=\"token operator\">=></span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// 鼠标滚轮开始缩放地图时触发</span>\nscene<span class=\"token punctuation\">.</span><span class=\"token function\">on</span><span class=\"token punctuation\">(</span><span class=\"token string\">'mouseover'</span><span class=\"token punctuation\">,</span> <span class=\"token parameter\">ev</span> <span class=\"token operator\">=></span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// 鼠标移入地图容器内时触发</span>\nscene<span class=\"token punctuation\">.</span><span class=\"token function\">on</span><span class=\"token punctuation\">(</span><span class=\"token string\">'mouseout'</span><span class=\"token punctuation\">,</span> <span class=\"token parameter\">ev</span> <span class=\"token operator\">=></span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// 鼠标移出地图容器时触发</span>\nscene<span class=\"token punctuation\">.</span><span class=\"token function\">on</span><span class=\"token punctuation\">(</span><span class=\"token string\">'mouseup'</span><span class=\"token punctuation\">,</span> <span class=\"token parameter\">ev</span> <span class=\"token operator\">=></span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// 鼠标在地图上单击抬起时触发</span>\nscene<span class=\"token punctuation\">.</span><span class=\"token function\">on</span><span class=\"token punctuation\">(</span><span class=\"token string\">'mousedown'</span><span class=\"token punctuation\">,</span> <span class=\"token parameter\">ev</span> <span class=\"token operator\">=></span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// 鼠标在地图上单击按下时触发</span>\nscene<span class=\"token punctuation\">.</span><span class=\"token function\">on</span><span class=\"token punctuation\">(</span><span class=\"token string\">'rightclick'</span><span class=\"token punctuation\">,</span> <span class=\"token parameter\">ev</span> <span class=\"token operator\">=></span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// 鼠标右键单击事件</span>\nscene<span class=\"token punctuation\">.</span><span class=\"token function\">on</span><span class=\"token punctuation\">(</span><span class=\"token string\">'dragstart'</span><span class=\"token punctuation\">,</span> <span class=\"token parameter\">ev</span> <span class=\"token operator\">=></span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">//开始拖拽地图时触发</span>\nscene<span class=\"token punctuation\">.</span><span class=\"token function\">on</span><span class=\"token punctuation\">(</span><span class=\"token string\">'dragging'</span><span class=\"token punctuation\">,</span> <span class=\"token parameter\">ev</span> <span class=\"token operator\">=></span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// 拖拽地图过程中触发</span>\nscene<span class=\"token punctuation\">.</span><span class=\"token function\">on</span><span class=\"token punctuation\">(</span><span class=\"token string\">'dragend'</span><span class=\"token punctuation\">,</span> <span class=\"token parameter\">ev</span> <span class=\"token operator\">=></span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">//停止拖拽地图时触发。如地图有拖拽缓动效果，则在拽停止，缓动开始前触发</span>\n</code></pre></div>\n<h3 id=\"其它事件\" style=\"position:relative;\"><a href=\"#%E5%85%B6%E5%AE%83%E4%BA%8B%E4%BB%B6\" aria-label=\"其它事件 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>其它事件</h3>\n<div class=\"gatsby-highlight\" data-language=\"javascript\"><pre class=\"language-javascript\"><code class=\"language-javascript\">scene<span class=\"token punctuation\">.</span><span class=\"token function\">on</span><span class=\"token punctuation\">(</span><span class=\"token string\">'resize'</span><span class=\"token punctuation\">,</span> <span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token operator\">=></span> <span class=\"token punctuation\">{</span><span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span> <span class=\"token comment\">// 地图容器大小改变事件</span>\n</code></pre></div>"}}}}} |