--- title: 本地运行demo 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。 ![L7 地理可视化](https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*TrpMSJrrSDMAAAAAAAAAAABkARQnAQ) <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 打开,你可以下载代码。