在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. EncodeError: 'latin-1' codec can't encode characters in position 69-70: ordinal not in range(256)

    UnicodeEncodeError: 'latin-1' codec can't encode characters in position 69-70: ordinal not in range( ...

  2. Android下Native的so编译:使用ndk-build.cmd/.sh

    最近将一个DLL库移植至安卓下,编译出so文件. 经历makefile.cmake等等的入门到放弃..... 最后还是使用android的ndk编译命令来解决 每个NDK文件下,均包含的是所有工具链. ...

  3. wpf 非窗体类中 异步调用窗体与控件

    App.Current.Dispatcher.Invoke((Action)(() => { MessageBoxWindow mwb = ); mwb.ShowDialog(); return ...

  4. oracle-不完全数据库恢复-被动恢复-RMAN-06025/ORA-01190

    不完全数据库恢复 到目前为止,前面讨论的都是完全恢复数据库,这是recover database\recover tablespace\recover datafile默认的行为特征. 所谓完全恢复指 ...

  5. 【MM系列】SAP 物料进销存报表查看

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[MM系列]在SAP里查看数据的方法   前言部 ...

  6. 数据结构系列之2-3-4树的插入、查找、删除和遍历完整版源代码实现与分析(dart语言实现)

    本文属于原创,转载请注明来源. 在上一篇博文中,详细介绍了2-3树的操作(具体地址:https://www.cnblogs.com/outerspace/p/10861488.html),那么对于更多 ...

  7. Linux-SSH远程管理服务实战

    figure:first-child { margin-top: -20px; } #write ol, #write ul { position: relative; } img { max-wid ...

  8. C函数调用过程原理及函数栈帧分析(转)

    在x86的计算机系统中,内存空间中的栈主要用于保存函数的参数,返回值,返回地址,本地变量等.一切的函数调用都要将不同的数据.地址压入或者弹出栈.因此,为了更好地理解函数的调用,我们需要先来看看栈是怎么 ...

  9. 解决IDEA中自动生成返回值带final修饰的问题

    修改配置文件: Editor--Code Style--Java--Code Generation--将Make generated local variables final勾选上

  10. cqoj921E整数匹配

    这是一个贪心题,把我坑的好惨,忘还原得70.上午被卡得,, 首先给出长度为n的一组数,可以两两配对相乘也可以进行相加,问怎样才可以使总和最大?那么可以显然看出来,当这个数为0或1时,我们要相加.其余进 ...