普通网友 2017-11-14 09:02 采纳率: 0%
浏览 4010
已结题

关于echarts创建多边形

代码如下,注释为1和2的分别打印了x,为什么每次都是1循环打印完之后才会走进2,求大神帮忙看看
for(var x = 0; x < 3; x++) {
console.log(x) //----------------------------1
var points1 = [];
var name1 = []; //扇区名称
var value1 = [];
var Pts = []; //扇区点组
for(var i = 0; i < data[x].length; i++) {
var arr = [];
points1.push(data[x][i].point);
name1.push(data[x][i].name);
value1.push(data[x][i].value);
jQuery.each(points1[i], function(i, val) {
arr.push(val);
});
Pts.push(arr);
arr = [];
}
option.options.push({
series: {
type: 'custom',
coordinateSystem: 'geo',
renderItem: function(params, api, x) {
console.log(x); //----------------------------2
var CX = new Array;
var color = api.visual('color');
var children = [];
var zoom = myChart.getOption().geo[0].zoom;
for(var j = 0; j < Pts.length; j++) {
var pointss = [];
for(var i = 0; i < Pts[j].length; i++) { //点数组坐标值转换为坐标系上的点
pointss.push(api.coord(Pts[j][i]));
}
CX.push(pointss); //转换后的点组
if(value1[j] < 10) {
CS_fill = "#ffffff";
} else if(value1[j] >= 10 && value1[j] < 20) {
CS_fill = "#f04504";
} else if(value1[j] >= 20 && value1[j] < 30) {
CS_fill = "#49483e";
} else {
CS_fill = "#494a5f";
}
if(zoom > 7) { //判断是否显示扇区名称——显示
var polygon = { //画多边形
type: 'polygon',
name: name[j],
shape: {
points: echarts.graphic.clipPointsByRect(CX[j], {
x: params.coordSys.x,
y: params.coordSys.y,
width: params.coordSys.width + 10000,
height: params.coordSys.height + 10000
})
},
style: api.style({ //多边形样式
fill: CS_fill,
opacity: 0.3,
text: name1[j] + value1[j],
stroke: CS_border

                                    }),
                                }
                            } else { //不显示扇区名称
                                var polygon = { //画多边形
                                    type: 'polygon',
                                    name: name1[j],
                                    shape: {
                                        points: echarts.graphic.clipPointsByRect(CX[j], {
                                            x: params.coordSys.x,
                                            y: params.coordSys.y,
                                            width: params.coordSys.width + 10000,
                                            height: params.coordSys.height + 10000
                                        })
                                    },
                                    style: api.style({ //多边形样式
                                        fill: CS_fill,
                                        text: null,
                                        stroke: CS_border

                                    }),
                                }
                            }
                            children.push(polygon);

                        }
                        return {
                            type: 'group',
                            name: '机场',
                            children: children
                        };
                    },
                    data: [0],
                }
            });

        }
  • 写回答

1条回答 默认 最新

  • ting_521 2018-08-21 09:05
    关注

    代码如下,注释为1和2的分别打印了x,为什么每次都是1循环打印完之后才会走进2,求大神帮忙看看
    for(var x = 0; x < 3; x++) {
    console.log(x) //----------------------------1
    var points1 = [];
    var name1 = []; //扇区名称
    var value1 = [];
    var Pts = []; //扇区点组
    for(var i = 0; i < data[x].length; i++) {
    var arr = [];
    points1.push(data[x][i].point);
    name1.push(data[x][i].name);
    value1.push(data[x][i].value);
    jQuery.each(points1[i], function(i, val) {
    arr.push(val);
    });
    Pts.push(arr);
    arr = [];
    }
    option.options.push({
    series: {
    type: 'custom',
    coordinateSystem: 'geo',
    renderItem: function(params, api, x) {
    console.log(x); //----------------------------2
    var CX = new Array;
    var color = api.visual('color');
    var children = [];
    var zoom = myChart.getOption().geo[0].zoom;
    for(var j = 0; j < Pts.length; j++) {
    var pointss = [];
    for(var i = 0; i < Pts[j].length; i++) { //点数组坐标值转换为坐标系上的点
    pointss.push(api.coord(Pts[j][i]));
    }
    CX.push(pointss); //转换后的点组
    if(value1[j] < 10) {
    CS_fill = "#ffffff";
    } else if(value1[j] >= 10 && value1[j] < 20) {
    CS_fill = "#f04504";
    } else if(value1[j] >= 20 && value1[j] < 30) {
    CS_fill = "#49483e";
    } else {
    CS_fill = "#494a5f";
    }
    if(zoom > 7) { //判断是否显示扇区名称——显示
    var polygon = { //画多边形
    type: 'polygon',
    name: name[j],
    shape: {
    points: echarts.graphic.clipPointsByRect(CX[j], {
    x: params.coordSys.x,
    y: params.coordSys.y,
    width: params.coordSys.width + 10000,
    height: params.coordSys.height + 10000
    })
    },
    style: api.style({ //多边形样式
    fill: CS_fill,
    opacity: 0.3,
    text: name1[j] + value1[j],
    stroke: CS_border

    评论

报告相同问题?

悬赏问题

  • ¥15 C++ 头文件/宏冲突问题解决
  • ¥15 用comsol模拟大气湍流通过底部加热(温度不同)的腔体
  • ¥50 安卓adb backup备份子用户应用数据失败
  • ¥20 有人能用聚类分析帮我分析一下文本内容嘛
  • ¥15 请问Lammps做复合材料拉伸模拟,应力应变曲线问题
  • ¥30 python代码,帮调试
  • ¥15 #MATLAB仿真#车辆换道路径规划
  • ¥15 java 操作 elasticsearch 8.1 实现 索引的重建
  • ¥15 数据可视化Python
  • ¥15 要给毕业设计添加扫码登录的功能!!有偿