本地JQuery读取json数据无法显示echarts地图问题

最新推荐文章于 2025-03-24 11:41:05 发布
最新推荐文章于 2025-03-24 11:41:05 发布
阅读量931 收藏
点赞数
分类专栏： echarts jQuery 文章标签： echarts jquery json
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/qq_37263478/article/details/121125028
版权
在本地使用JQuery加载json数据以显示echarts地图时遇到问题，原因是文件协议限制。解决方案是搭建本地服务器，推荐使用node.js的live-server插件。首先全局安装live-server，如果遇到权限问题，需以管理员身份运行Power shell并调整执行策略。然后在终端启动live-server，通过默认端口8080或指定端口访问网页文件，即可正常显示地图。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

这里需要建立一个本地服务器解决问题，文件协议即点击进行默认浏览器是访问不了数据的

前提下载好node.js ，这里推荐用vscode，可以下载live server 插件 ，非常方便

全局安装 输入 npm i -g live-server 安装成功

在终端运行运行  输入live-server 可能会出现下方这样的问题，

  1. 用管理员身份运行 Power shell  输入 Set-ExecutionPolicy -ExecutionPolicy UNRESTRICTED
  2. 输入Y
  3. 然后再次在终端根目录下，启动live-server 输入，这时候会打开默认浏览器，默认端口8080，地址为127.0.0.1:8080 ，后方输入你所需要访问的网页文件名即可显示完地图

 

最低0.47元/天 解锁文章
echarts本地调试调用JSON地图无法显示问题处理
lbyyy的专栏
07-04 5797
echarts本地调试调用JSON地图无法显示问题处理本地测试调用JS的MAP都能正常显示，但调用JSON的MAP文件，却无法显示，页面一片空白。一阵代码纠结后，才发现，把代码放WWW服务器上，地图立马显示出来。代码：<!DOCTYPE html> <html lang="en"><head> <meta http-equiv="content-type"...
关于”echarts-JSON请求数据”一文读者反映chart无法显示数据的分析
qq_37763312的博客
10-19 2335
问题原文地址：http://blog.youkuaiyun.com/you23hai45/article/details/51585506#reply 1.大家反馈的问题： 页面框架和图表框架都有，控制台也可以看到json文件的内容，但是就是不显示数据 2.先说自己的解决方法吧： 2.1解决办法： 2.2 浏览器端截图： 3.代码 3.1链接源代码：原文地址：http://blo
对于地图上区域不是连片，由各块区域组合而成的地图JSON，echarts不显示的问题。
weixin_40645949的博客
04-11 958
前端问题: 解决方案： 在node-modues 下找到echarts文件夹，依次查找 echarts-lib-coord-geo下的parseDeoJson.js中修改代码。 修改内容如下： /* * Licensed to the Apache Software Foundation (ASF) under one * or more contributor license agreements. See the NOTICE file * distributed with th.
echarts引入json地图(乡镇级）
最新发布
m0_63931867的博客
03-24 593
KML 格式 （不能直接导出KML格式，先导出bmv格式。用Bigemap 逐个打开bmv格式，选中对应的乡镇右键导出kml格式）var dongpingMap = 这是在geojson 数据中新增内容，其他不用修改 .此文件是dongpingMap.js。右边红色圈的json数据就是我们需要放到echarts展示地图的geoJson数据新建 js 文件。复制右边的geoJson数据（ctrl a + ctrl + c），导入所有的街道、镇数据的效果。导入第一步下载好的kml。
C#调试web项目本地JSON数据文件无法加载:Echars地图数据不显示
第一段代码的博客
11-17 705
最近,使用Echarts开发地图功能,地图坐标数据要通过JSON本地文件加载渲染,遇到一个怪事,自己和一些小伙伴的电脑是可以正常加载的,也有一些小伙伴的电脑是无法加载的,检查过本地同步过来的项目代码包含该json文件,本地不存在缺少该json的情况,然后VS调试IIS渲染出来的就是缺失,并显示找不到该JSON文件,奇了怪!!! 后面请教大佬,是IIS配置相关导致,需要改下配置即可,非代码问题.加载数据为JSON格式的都加载不了，应该是MIME类型没有正确设置的问题. 网络上找了一些资料看了.主要有两个方
ajax地图显示不出来,vue2.0加载不出echarts引用的百度地图
weixin_42510188的博客
08-06 430
1.点击选择其中一个选项就会进行ajax请求echarts并更新，现在是echarts的中加载的百度地图出不来。2.点击选项都能够正确获取到json数据3.图表只显示了echarts中的visualMap，实际的地图并没有显示4.listValue[0]的数据格式见第一个图5.是不是我引入百度地图到echarts里有问题？。。。export default{data() {return {}},m...
ECharts本地json文件引用问题
qq_37944168的博客
10-12 3519
@比较详细，比较小白，大神笑看~ @求点赞，求打赏，请支持一个月薪3800的IT从业者☺️ echarts本地.json文件引用问题 初学echarts.js，遇到很多问题，因为没有网页基础，遇到很多问题。由于要做一个海口市地图的可视化，但是ecahrts现有的地图里面仅限于省市，没有区县的js文件可以引用，因此我在一个地图 选取器的网站上（http://datav.aliyun.com/tool...
Echarts美国地图完整项目文件
10-13
**ECharts美国地图完整项目文件**是一个基于ECharts的数据可视化项目，主要目的是使用ECharts库来展示美国各州的数据信息。ECharts是一个由百度开发的开源JavaScript图表库，支持丰富的图表类型，包括柱状图、折线图...
Echarts地图报表，从数据库获取数据，json传值
color007的专栏
01-29 9797
使用百度的Echarts插件做报表
echarts 地图 不显示地图的 解决办法 ！
weixin_30588675的博客
09-04 5471
1首先 需要 下载echarts 2 在main 中 需要引入 import echarts from 'echarts/dist/echarts.min.js' import china from 'echarts/map/json/china.json' echarts.registerMap('china', china) Vue.prototype.$echa...
echarts使用及页面读取json文件---echarts坑之路
热门推荐
欧阳小白闯天涯
01-25 2万+
页面通过读取json文件数据填充echarts遇到的坑 首先确保json文件数据格式正确： 1.echarts json：填充到echarts时的json格式尽量一样，分号等符号是否要加，到官网案例中测试。 2.使用jquery获取json的话：确保json格式满足jquery，不然获取不到 有时候甚至会出现不能同时满足双方的情况，那就自己取舍了。啊，真的操蛋。 如： 对于“la...
使用Echart地图扩展在本地直接浏览无法显示地图的处理办法
weixin_34034670的博客
09-25 756
2019独角兽企业重金招聘Python工程师标准>>> ...
使用http协议打开html文件显示echarts地图-vscode开发环境
qiuyushuofeng的专栏
07-15 719
使用http协议打开html文件显示echarts地图-vscode开发环境，黑马echarts教程
百度地图API 与 jquery 同时使用时报 TypeError $(...) is null错误 失效的原因及解决办法...
一花一叶
04-14 368
在引用百度地图API后,发现jquery 根据id 找不到 form。但是对于别的控件没有问题。 在排除了 html加载的问题后。 上网查找 发现以下解决办法： 原因应该是有冲突的插件。 解决办法将 $符号改为jQuery 引用： http://www.phpernote.com/jquery/851.html 最近在工作中发现个问题，原本好好的网页，写了一些自...
使用vue-echart时，地图数据无法显示
rgbhi的博客
09-27 1357
option={ geo: { map: "china", }, } 把gallery的代码copy到本地，发现地图数据没有显示，原因是没有导入对应的map数据 vue-echarts的github vue-echarts/src/demo/ 下有china的json 将地图数据复制到你的项目里 import chinaMap from '存放的路径/china.json' ECharts.registerMap('china', chinaMap) 至此，你就可以使用名为
Echarts使用本地JSON文件加载不出图表的解决方法以及Jquery访问本地JSON文件跨域的解决方法
爱吃雪糕的小布丁的博客
05-11 4395
最近需要做一个大屏展示，需要用原生html5+css+js来写，所以去学了一下echarts的使用。在使用的过程中难免碰到许多BUG，百度那是必不可少的，可是这些人写的牛头不对马嘴，简直是标题党一大堆，令我作呕，现将我认为比较重要的两个问题记录如下。
使用Echarts图表动态加载饼图数据 pie
丿kiss灬火舞的博客
09-14 2817
* Echarts简介* ECharts是一款开源、功能强大的数据可视化产品。 —— [ Echarts官网 ] 具体实现代码如下： HTML代码: <!--输出的报表内容---> <div id="main" style="height:300px;width:500px;"></div>12 JavaScript...
【前端】Echarts中Ajax获取的数据不展示问题的解决
野生Java小菜鸟的博客
05-29 2483
背景说明： 最近在使用Echarts的scatter3D 功能 首先配置好Echarts的大致框架，设置要求展示的各种属性 接下来写后台，此时我是通过Ajax异步获取的数据 经过测试数据获取没有问题 然后严格按照scatter3D所需的数据格式进行数据封装，这一步也没有问题 可是Echarts中却迟迟不能显示我所需的3D样式。。。 通过在前台页面封装数据的console.log，数据格式也没有问题...
echart地图不显示问题
weixin_55966654的博客
06-20 7142
解决echarts不显示地图问题，echarts5.0以上的版本不支持地图功能，所以需要装5.0以下的版本
echarts数据的动态更新 + vue + 读取json
04-03
在Vue项目中，可以通过axios或其他方式读取JSON数据，使用ECharts动态更新图表。 下面是一个简单的例子，展示如何使用ECharts和Vue实现动态更新图表： 1. 安装ECharts 可以通过npm或CDN方式安装ECharts，这里我们...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值