账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    vue中使用echarts和高德地图,散点不出现
    40
    0

    ` series: [{

              name: "",
              type: "effectScatter",
              coordinateSystem: "geo",
              data: this.convertData([{ name: "广州市", value: 9 }]),
              symbolSize: 12,
              label: {
                normal: {
                  show: false
                },
                emphasis: {
                  show: true
                }
              },
              itemStyle: {
                normal: {
                  color: "#ddb926"
                }
              }
            },
            {
              name: "数据名称",
              type: "map",
              roam: false,
              mapType: mapName,
              selectedMode: "single",
              showLegendSymbol: false,
              visibility: "off",
              itemStyle: {
                normal: {
                  color: "#ccc",
                  areaColor: "#fff",
                  borderColor: "#fff",
                  borderWidth: 0.5,
                  label: {
                    show: true,
                    textStyle: {
                      color: "rgb(249, 249, 249)"
                    }
                  }
                },
                emphasis: {
                  areaColor: false,
                  borderColor: "#fff",
                  areaStyle: {
                    color: "#fff"
                  },
                  label: {
                    show: true,
                    textStyle: {
                      color: "rgb(249, 249, 249)"
                    }
                  }
                }
              },
              data: this.mapData
            }
          ]`
          
          `  convertData(data) {
      let res = [];
      for (let i = 0; i < data.length; i++) {
        const geoCoord = this.geoCoordMap[data[i].name];
        if (geoCoord) {
          res.push({
            name: data[i].name,
            value: geoCoord.concat(data[i].value)
          });
        }
      }
      return res;
    },`
    
    代码如图所示,不知道为什么地图上没有出现散点图
    0
    打赏
    收藏
    点击回答
    您的回答被采纳后将获得:提问者悬赏的 10 元积分
        全部回答
    • 0
    • 愚蠢的痞子 普通会员 1楼

      在 Vue 中使用 echarts 和 高德地图 创建散点图时,可能会出现散点不出现的情况。这可能是由于以下原因导致的:

      1. 服务器返回的数据显示错误:请检查您的服务器返回的数据,确保它们包含正确的散点数据。

      2. 地图数据错误:请检查您的地图数据,确保它们包含正确的经纬度数据。

      3. echarts 渲染错误:请检查您的 echarts 渲染代码,确保它们没有语法错误。

      4. 高德地图数据错误:请检查您的高德地图数据,确保它们包含正确的地图数据。

      5. 确保地图调用正确:请确保在地图上绘制散点时,地图的调用是正确的。例如,如果您的地图是一个地图实例,那么您需要调用地图的 setOption 方法来设置地图选项。

      6. 在 Vue 中使用 echarts 时,确保你的数据是正确的。在 Vue 中,你需要将你的数据绑定到 Vue实例的 data 属性上。你可以通过将数据作为 Vue 实例的属性值来实现这一点。

      7. 如果你在使用 Vue 的 data 属性,确保你将 value 选项设置为正确的值。例如,如果你的数据是一个对象,你可以将 value 选项设置为 对象.values

      请尝试以上的解决方案,如果问题仍然存在,建议您查看 Vue 的官方文档或者寻求专业的技术支持。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部