在vue中绘制地图需要加载一个本地china.json文件,我用的是get请求的方法加载的,而不是直接import,因为我怕import请求到的部署到线上的时候会有问题。如下是get请求方法:

this.$http.get(zhongguo).then(res => {
console.log(res);
this.$echarts.registerMap("china", res); //注册地图
console.log("223442");
var myChart = this.$echarts.extendsMap("mapChart", { //绘制地图
bgColor: "", // 画布背景色
mapName: "china", // 地图名
text: "by:wxw",
goDown: true, // 是否下钻
// 下钻回调
callback: function(name, option, instance) {
console.log(name, option, instance);
},
// 数据展示
data: areaProjects
});
});

在请求到数据后我直接用res来绘制地图,结果报错

我就纳闷,根本没有这个文件啊,但其实这个js文件就在我们安装的echarts包里面

报错行打断点:regions: undefined

我看到有人说别用get请求方法,直接import就不会报错,嗯?为什么会这样?我打印了一下res

这么多没用的数据,我们绘制地图只需要res.data,而不能是整个res,修改后就可以了展示地图了

this.$http.get(zhongguo).then(res => {
console.log(res);
this.$echarts.registerMap("china", res.data); //注册地图
console.log("223442");
var myChart = this.$echarts.extendsMap("mapChart", { //绘制地图
bgColor: "", // 画布背景色
mapName: "china", // 地图名
text: "by:wxw",
goDown: true, // 是否下钻
// 下钻回调
callback: function(name, option, instance) {
console.log(name, option, instance);
},
// 数据展示
data: areaProjects
});
});

就这个问题折腾了我两天时间,今天早上忽然开窍,真想给自己一个大嘴巴子

vue项目中使用echarts map报错Cannot read property 'push' of undefined nanhai.js的更多相关文章

  1. Vue 项目中的ESlint语法报错问题

    在项目中的""和;经常会报错,真的很纠结,今天看到一个解决方法,可以不用卸载删除 在项目根目录中,新建一个.prettierrc文件,来移除分号,和替换为单引号. { " ...

  2. vue.config.js报错cannot set property "preserveWhitespace" of undefined

    vue.config.js报错cannot set property "preserveWhitespace" of undefined 最近在项目中配置webpack,由于vue ...

  3. 小程序 for循环 报错 Cannot read property 'total' of undefined

    for循环一直报错  Cannot read property 'total' of undefined,但total在起初是有定义的,后来找到了问题,是i<=的问题,改为<不报错了. i ...

  4. datatables 多一列报错Cannot read property 'sWidth' of undefined(…)/少一列报错Cannot read property 'style' of undefined(…)

    datatables 多一列报错Cannot read property 'sWidth' of undefined(…)/少一列报错Cannot read property 'style' of u ...

  5. Vue 项目: npm run dev 报错 webpack-dev-server

    从码云上下载vue项目,运行npm run dev 时报错: > webpack-dev-server --inline --progress --config build/webpack.de ...

  6. 使用vue-preview报错Cannot read property 'open' of undefined

    最近在做一个vue项目中时,需要使用vue-preview插件制作缩略图,首先在终端使用npm i vue-preview -S指令安装了vue-preview插件,然后在main.js中,导入并引用 ...

  7. vue-cli创建的项目中引入第三方库报错 'caller', 'calle', and 'arguments' properties may not be...

    http://blog.csdn.net/sophie_u/article/details/76223978 以在vue中引入mui第三方库为例: 虽然针对vue,有单独的vue-mui库可以使用,但 ...

  8. vue-cli创建的项目中引入第三方库报错'caller', 'calle', and 'arguments' properties may not be...

    本文链接:https://blog.csdn.net/Sophie_U/article/details/76223978 问题: 在vue的main.js中引入mui.min.js时,报错. 如上,单 ...

  9. ASP.NET CORE MVC 2.0 项目中引用第三方DLL报错的解决办法 - InvalidOperationException: Cannot find compilation library location for package

    目前在学习ASP.NET CORE MVC中,今天看到微软在ASP.NET CORE MVC 2.0中又恢复了允许开发人员引用第三方DLL程序集的功能,感到甚是高兴!于是我急忙写了个Demo想试试,我 ...

随机推荐

  1. 【不错】MySQL 事务隔离级别

    一.事务描述 1.事务的四个特性 ACID 1. A:原子性 = 一个事务或者都成功.或者都失败: 2. C:一致性 = 在整个事务的生命周期里面,查询到的数据是一致的: MVCC多版本并发控制:利用 ...

  2. LeetCode.874-走路机器人模拟(Walking Robot Simulation)

    这是悦乐书的第335次更新,第360篇原创 01 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第205题(顺位题号是874).网格上的机器人从点(0,0)开始并朝北.机器人可以接收三 ...

  3. PHP Memcache 扩展安装

    PHP Memcache 扩展安装 PHP Memcache 扩展包下载地址:http://pecl.php.net/package/memcache,你可以下载最新稳定包(stable). 下载对应 ...

  4. jyputer notebook 、jypyter、IPython basics

    1 .修改jupyter默认工作目录:打开cmd,在命令行下指定想要进的工作目录,即键入“cd d/  G:\0工作面试\学习记录”标红部分是想要进入的工作目录. 2.Tab补全 a.在命令行输入表达 ...

  5. 【HBase】四、HBase的安装及命令行接口

      通过前面的介绍,对HBase数据模型,运行机制等理论基本了解,接下来从实践的角度介绍HBase的安装以及其各种接口的使用方法. 1.HBase的安装   HBase安装很简单,和所有的Hadoop ...

  6. Javascript实现的图片隐写术

    javascript图片隐写术,感觉可以用它来干点有想法的事情   1.什么是图片隐写术? 权威的wiki说法是“隐写术是一门关于信息隐藏的技巧与科学,所谓信息隐藏指的是不让除预期的接收者之外的任何人 ...

  7. [Web 前端] 030 ajax 是什么

    AJAX 是什么 1. AJAX 是一种"艺术" 简单地说 AJAX 是在不重新加载整个页面的情况下与服务器交换数据并更新部分网页的艺术 网上是这样说的 AJAX 指异步 Java ...

  8. [转帖]Docker从入门到动手实践

    Docker从入门到动手实践 https://www.cnblogs.com/nsky/p/10853194.html dockerfile的图很好呢. 但是自己没有做实验 , 其实知识都挺好. do ...

  9. 单词数 HDU 2072 字符串输入控制

    单词数 HDU 2072 字符串输入控制 题意 lily的好朋友xiaoou333最近很空,他想了一件没有什么意义的事情,就是统计一篇文章里不同单词的总数.下面你的任务是帮助xiaoou333解决这个 ...

  10. vue.js学习记录

    vue.js学习记录 文章已同步我的github笔记https://github.com/ymblog/blog,欢迎大家加star~~ vue实例 生命周期 beforeCreate:不能访问thi ...