2019-12-02 11:12:30 +08:00
|
|
|
|
---
|
2020-01-16 12:02:06 +08:00
|
|
|
|
title: 本地运行demo
|
2019-12-02 11:12:30 +08:00
|
|
|
|
order: 1
|
|
|
|
|
|
---
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
### 一、打开L7demo页面
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
选择一个任意一个你想看的demo
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<img src="https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*bKT5TrlYlGEAAAAAAAAAAABkARQnAQ" alt="L7 地理可视化" width = "50%" height = "100%">
|
|
|
|
|
|
|
|
|
|
|
|
你可能没有注意，代码区的上方有一排工具按钮，注意了你可能不知道干什么用的。
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
### 二、打开 codesandbox。
|
|
|
|
|
|
|
|
|
|
|
|
点击左侧第三个按钮，你就进入了 codesandbox。
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<img src="https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*coZsTLbX2FQAAAAAAAAAAABkARQnAQ" alt="L7 地理可视化" width = "50%" height = "100%">
|
|
|
|
|
|
|
|
|
|
|
|
你发现你进入了一个线代码编辑器比较流行，这个里面你可以修改代码，并且能够随时看到效果
|
|
|
|
|
|
|
|
|
|
|
|
你可能想说我就想本地跑起来，不想在线修改。
|
|
|
|
|
|
|
|
|
|
|
|
当然是是可以的
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
### 三、下载demo源码
|
|
|
|
|
|
在codesandbox的文件目录工具有下载按钮，参照图中红色部分
|
|
|
|
|
|
|
|
|
|
|
|
点击下载你可以把这个demo的源码下载到本地。
|
|
|
|
|
|
|
|
|
|
|
|
### 四、启动项目
|
|
|
|
|
|
解压项目，进入项目目录
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
#### 1.安装环境依赖
|
|
|
|
|
|
|
|
|
|
|
|
如果不知道yarn可能需要补充一下前端知识了，如果没有yarn环境你需要安装一下，
|
|
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
|
yarn install
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
#### 2. 启动项目
|
|
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
|
yarn start
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
浏览器就会自动打开 [http://localhost:3000/](http://localhost:3000/)，这样demo 就跑起来了
|
|
|
|
|
|
|
|
|
|
|
|
<img src="https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*oQQ2RbOzx0oAAAAAAAAAAABkARQnAQ" alt="L7 地理可视化" width = "50%" height = "100%">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
现在你可以尽情的本地修改代码，添加自己的图层了。
|
|
|
|
|
|
|
|
|
|
|
|
L7 所有demo都可以在codesandbox 打开，你可以下载代码。
|
|
|
|
|
|
|
|
|
|
|
|
|
