使用D3js创建地图的基础及TopoJson文件跨域加载问题

嘿，这个问题我熟得很——你遇到的是浏览器的跨域安全限制。当你直接双击HTML文件用file://协议打开时，浏览器出于安全考虑，会阻止加载其他本地文件（比如你的map-2.topojson），这就是控制台报错的核心原因。

下面给你几个靠谱的解决办法，按推荐程度排序：

• 启动本地HTTP服务器（强烈推荐）
  这是前端开发规避跨域问题的标准操作，完全合规且简单。你可以用Python内置的简易服务器：

  • 如果你装的是Python 2，打开终端进入项目文件夹，运行：python -m SimpleHTTPServer 8000
  • 若是Python 3，运行：python3 -m http.server 8000
    之后在浏览器访问http://localhost:8000，找到你的HTML文件打开即可。此时所有资源都通过HTTP协议加载，跨域限制自然就不存在了。

• 借助Sublime Text插件快速搭建服务器
  既然你用Sublime Text当编辑器，不妨装个LiveReload插件。安装完成后，右键点击你的HTML文件，选择LiveReload: Enable/disable plug-ins里的SimpleHTTPServer，它会自动帮你启动本地服务器并打开页面，还支持实时刷新修改，开发体验拉满。

• 临时修改浏览器安全设置（不推荐）
  如果你只是临时测试不想折腾服务器，可以给浏览器加启动参数关闭跨域检查（仅限开发环境，日常浏览千万别用）：
  比如Chrome，先关闭所有Chrome窗口，再在终端运行：open -a "Google Chrome" --args --disable-web-security --user-data-dir="/tmp/chrome_dev"
  这个方法会降低浏览器安全性，测试完记得恢复正常启动方式。

最后再提醒一句：检查下HTML里加载map-2.topojson的路径，要用相对路径（比如./map-2.topojson），别用绝对的file://路径，不然就算开了服务器也可能加载失败。

内容的提问来源于stack exchange，提问作者LandryCJ