前端几个小问题

前端echart里面几个常见问题
1.后端有数据过来,ip转成地理位置,可是传过来的地理位置在echarts地图中的地理位置不存在,怎么办?(比如地图中设定的是刚果共和国,但是传过来的是刚果布,此刻,echarts的世界地图出不来了!)
解决方案:将地图中没有设定的全部都设为“未知”。
修改1:

 `var convertData = function(data) {
        var res = [];
        for (var i = 0; i < data.length; i++) {
            var dataItem = data[i];
            if(geoCoordMap.hasOwnProperty(dataItem[0].name)){
                var fromCoord = geoCoordMap[dataItem[0].name];
            }else{
                var fromCoord = [124.8925, 30.4486];
            }

            if(geoCoordMap.hasOwnProperty(dataItem[1].name)){
                var toCoord = geoCoordMap[dataItem[1].name];
            }else{
                var toCoord = [124.8925, 30.4486];
            }

            if (fromCoord && toCoord) {
                res.push([{
                    coord: fromCoord,
                    value: dataItem[0].value
                }, {
                    coord: toCoord,
                }]);
            }
        }
        return res;
    };`var convertData = function(data) {
        var res = [];
        for (var i = 0; i < data.length; i++) {
            var dataItem = data[i];
            if(geoCoordMap.hasOwnProperty(dataItem[0].name)){
                var fromCoord = geoCoordMap[dataItem[0].name];
            }else{
                var fromCoord = [124.8925, 30.4486];
            }

            if(geoCoordMap.hasOwnProperty(dataItem[1].name)){
                var toCoord = geoCoordMap[dataItem[1].name];
            }else{
                var toCoord = [124.8925, 30.4486];
            }

            if (fromCoord && toCoord) {
                res.push([{
                    coord: fromCoord,
                    value: dataItem[0].value
                }, {
                    coord: toCoord,
                }]);
            }
        }
        return res;
    };

修改2:

symbol: 'circle',
                symbolSize: function (val) {
                    var l=0;
                    while(val[2] >= 1){
                        val[2]=val[2]/10;
                        l++;
                    }
                    return val[2] / Math.pow(10,l-3)+7;
                },
                itemStyle: {
                    normal: {
                        show: false,
                        color: '#f00'
                    }
                },
                data: item[1].map(function (dataItem) {
                    var fromCoord;
                    var nameValue;
                    if(geoCoordMap.hasOwnProperty(dataItem[0].name)){
                        fromCoord = geoCoordMap[dataItem[0].name];
                        nameValue = dataItem[0].name;
                    }else{
                        fromCoord = geoCoordMap['未知'];
                        nameValue = '未知';
                    }
                    return {
                        name: nameValue,
                        value: fromCoord.concat([dataItem[0].value])
                    };
                }),
            },

两处都要进行判读修改,不然图像出不来。

2.在top10,top5排序中,后端已经降序传过来数据,结果echarts图像好像是反着来的,查了好久
解决方法:yAxis加一项配置inverse: true反序排列就行了,晕!

3.时间戳转时间时,后端过来的是字符串!是转不了时间的!
解决方法:先将传过来的字符串数组转化为数组值。在转时间

for(let i=0;i<xData.length;i++){
    xData[i] = parseInt(xData[i])
}
console.log(xData);


for (var j = 0; j < xData.length; j++) {
    xData[j]= new Date(xData[j]);
}
4.在<p></p>插入后端的东西
<p id="ysy" style="color: #d0e9c6;font-weight:bold;font-size:32px;" ></p>
<script type="text/javascript">
        change();
    function change() {
       <p id="ysy" style="color: #d0e9c6;font-weight:bold;font-size:32px;" ></p>
<script type="text/javascript">
        change();
    function change() {
        var xdata =[];
        (function () {//<![CDATA[
            $.ajax({
                //请求方式
                type: "POST",
                //文件位置
                url: "链接",
                //返回数据格式为json,也可以是其他格式如
                dataType: "json",
                contentType: 'application/json',
                //请求成功后要执行的函数,拼接html
                success: function (result) {
                    xdata.push(result.data);
                    for(let i=0;i<xdata.length;i++){
                        xdata[i] = parseInt(xdata[i])
                    }
                    console.log(xdata);
                    document.getElementById("ysy").innerHTML = "xxx:" + xdata;
                }
            });
        })();
    };
                    document.getElementById("ysy").innerHTML = "系统综合评分:" + xdata;
                }
            });
        })();
    };
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值