qq_59884435 2022-09-21 00:30 采纳率: 0%
浏览 32

Echarts插入数据后后台有数据但是图表显示不出

问题遇到的现象和发生背景

Echarts插入数据后后台有数据但是图表显示不出

用代码块功能插入代码,请勿粘贴截图
var chartDom = document.getElementById('box1');
var myChart = echarts.init(chartDom);
var option;
function request(url, 参数dict) {
    var result = {}
    var b = $.ajax({
        url: url,
        data: 参数dict,
        async: false,
        type: "get",
        dataType: "json",
        contentType: 'application/x-www-form-urlencoded',
        success: function (r) {
            result = r
        },
        error: function () {
            /*获取失败 */
            result = { "code": 404, "tishi": "网络连接失败!,请刷新" }
        }
    });
    return result

}

/*全局数据*/
var data = request("data.json",{})

/*过滤台湾地区 */
taiwan = []
zhenji = []
shijian = []
weizhi = []
var dayu = new Date("2022-5-1")
for(i in data){
    var a = data[i]["参考位置"]
    var t = new Date(i)
    if(a.indexOf("台湾")>-1 && t > dayu){
        zhenji.push(data[i]["震级"])
        shijian.push(data[i]["发震时刻"])
        weizhi.push(data[i]["参考位置"])
    }
}

console.log(shijian)
console.log(zhenji)
console.log(weizhi)
/*清洗数据 */

option = {
  dataset: {
    source: [
         ['shijian', 'zhenji', 'weizhi'],
         [shijian, zhenji, weizhi]
    ]
  },
  grid: { containLabel: true },
  xAxis: { name: '地震数据图' },
  yAxis: { type: 'category' },
  visualMap: {
    orient: 'horizontal',
    left: 'center',
    min: 0,
    max: 10,
    text: ['高频率', '低频率'],
    // Map the score column to color
    dimension: 0,
    inRange: {
      color: ['#65B581', '#FFCE34', '#FD665F']
    }
  },
  series: [
    {
      type: 'bar',
      encode: {
        // Map the "amount" column to X axis.
        x: 'zhenji',
        // Map the "product" column to Y axis
        y: 'weizhi',
      }
    }
  ]
};

option && myChart.setOption(option);


运行结果及报错内容

img

我想要达到的结果

img


后面重写了过滤信息,新增了地区,把数据放一个包里,解决

img

img

  • 写回答

1条回答 默认 最新

    报告相同问题?

    相关推荐 更多相似问题

    问题事件

    • 修改了问题 9月21日
    • 创建了问题 9月21日

    悬赏问题

    • ¥15 关于C# 英文打字练习器程序设计
    • ¥15 想用switch完成这个操作,但试了很多遍都无法运行
    • ¥15 wfp应用层设计规则如何能传递到内核层
    • ¥15 关于机器学习创新点几个问题
    • ¥15 python程序编写
    • ¥15 Type-C扩展坞的RTL8153地址硬改
    • ¥15 uniapp websocket 发送 sub 监听后,代码自动发送了 unsub ,解除了监听
    • ¥15 nativefier封装electron的应用遇到alert弹窗后input栏获取不到焦点,confirm不弹出的问题。
    • ¥15 Simulink使用HDL coder生成verilog代码时遇到问题
    • ¥20 怎样让两台不同的电脑访问外网的IP一致?