建模gis监管页面修改

sgj

2026-03-05 8e4be3c0e5577fddae3ae30b0ca00f8b7a6c490e

 fzzy-igdss-web/src/main/resources/static/group/gis-chart.js

@@ -1,5 +1,4 @@
//------------------------------------------------------------------------------------------------
var breedChart = null;

/**
 * 饼图加载
@@ -18,7 +17,7 @@
                return params.name + ': ' + params.value;
            }
        },
        color: ['#00d2eb', '#16e2ad', '#ffb517', '#ec3c48', '#8767ff', '#297aff', '#ee3c90'],
        color: ['#96CEB4','#4ECDC4','#45B7D1','#FF6B6B','#FECA57','#FF9FF3','#54A0FF','#5F27CD','#00D2D3','#FF7675','#208620'],
        series: [
            {
                name: '',
@@ -40,57 +39,6 @@
    }
}

/**
 * 堆叠柱状图加载
 * @param obj
 * @param id
 */
// 正常数据
var listData = [{
    value: 8,
    name: '测试1'
},
    {
        value: 2,
        name: '测试2'
    },
    {
        value: 83,
        name: '测试3'
    },
    {
        value: 22,
        name: '测试4'
    },
    {
        value: 22,
        name: '测试5'
    }
];
// 异常数据
var listData1 = [{
    value: 20,
    name: '测试1'
},
    {
        value: 10,
        name: '测试2'
    },
    {
        value: 4,
        name: '测试3'
    },
    {
        value: 20,
        name: '测试4'
    },
    {
        value: 20,
        name: '测试5'
    }
];


function toThousands(num) {
    num = num.toString().split("."); // 分隔小数点
    var arr = num[0].split("").reverse(); // 转换成字符数组并且倒序排列
@@ -111,37 +59,24 @@

}


function barChartLoad(data, id) {
    var dom = document.getElementById('ss');
function barChartLoad(id) {
    var dom = document.getElementById(id);
    var barChart = echarts.init(dom);
    var predata = [];
    var ydata = [];
    if (data) {
        for (var i = 0; i < data.typeChartPie.length; i++) {
            if (data.typeChartPie[i].name == "省级储备粮") {
                predata[0] = data.typeChartPie[i].percent;
                ydata[0] = data.typeChartPie[i].value;
            }
            if (data.typeChartPie[i].name == "其他粮食") {
                predata[1] = data.typeChartPie[i].percent;
                ydata[1] = data.typeChartPie[i].value;
            }
            if (data.typeChartPie[i].name == "省级储备油") {
                predata[2] = data.typeChartPie[i].percent;
                ydata[2] = data.typeChartPie[i].value;
            }
            if (data.typeChartPie[i].name == "其他油") {
                predata[3] = data.typeChartPie[i].percent;
                ydata[3] = data.typeChartPie[i].value;
            }
        }
    if (gisData) {
        predata[0] = gisData.sumPer;
        ydata[0] = gisData.sum;

        predata[1] = gisData.bankSumPer;
        ydata[1] = gisData.bankSum;

        predata[2] = gisData.normalSumPer;
        ydata[2] = gisData.normalSum;
    } else {
        predata = [50, 30, 10, 10];
        ydata = [3733.230, 1825.356, 2523.248, 2005.123];
        predata = [100, 50, 50];
        ydata = [1000, 500, 500];
    }
    console.log(ydata);
    console.log(predata);
    var option = {
        grid: {
            top: '10%',
@@ -218,7 +153,7 @@
                    },
                    img: {
                        backgroundColor: {
                            image: '/static/group/img/c-i1.png',
                            image: '/img/web/group/c-i1.png',
                        },
                        width: 17,
                        align: 'left',
@@ -228,7 +163,7 @@
            axisTick: {
                show: false
            },
            data: ['省级储备粮', '其他粮食', '省级储备油', '其它油'],
            data: ['总重量', '质押重量', '非质押重量'],
        },
            {
                type: "category",
@@ -298,83 +233,158 @@
            }
        ]
    };

    barChart.setOption(option);
    /*   if (id === 'breedChart') {
        breedChart = pieChart;
      } */


}

window.onload = function () {
   // barChartLoad(null);
    /*粮食品种*/
    window.onresize = function (e) {
        if (breedChart) {
            breedChart.resize();
        }
function modelingBarChartLoad(id) {
    var dom = document.getElementById(id);
    var barChart = echarts.init(dom);
    var predata = [];
    var ydata = [];
    if (gisData) {
        predata[0] = gisData.bankSumPer;
        ydata[0] = gisData.bankSum;
    } else {
        predata = [50];
        ydata = [500];
    }

  //  ajaxFoodNum();
}

/**
 * 获取饼状图数据
 */
function ajaxFoodNum() {

    var data = {
        "county": county,
        "type": type,
        "companyId": companyId
    };

    $.ajax({
        type: "POST",
        url: "../../visual/amount-food-number",
        dataType: "json",
        contentType: "application/json;charset=UTF-8",
        data: JSON.stringify(data),
        success: function (result) {
            if (result.code == "0000") {
                var data = result.data;
                renderFoodNum(data);
    var option = {
        grid: {
            top: '20%',
            left: '2%',
            right: '5%',
            bottom: '1%',
        },
        tooltip: {
            show: true,
            trigger: "axis",
            formatter: function (data) {
                let result = '';
                let content = '';
                for (let i = 0; i < data.length - 1; i++) {
                    if (data[i].componentSubType === 'bar' && data[i].seriesName !== '背景条') {
                        content += `${data[i].marker} ${data[i].seriesName}<span style='font-size:12px; float:right;margin-left:20px;'>${data[i].data}</span><br/>`
                        result = `<span style='font-size: 14px;'>${data[i].name}</span> <br/> ${content}`;
                    }
                }
                return result;
            }
        },
        error: function (error) {

        }
    });
        xAxis: {
            splitLine: {
                show: false
            },
            axisLabel: {
                margin: 20,
                show: false
            },
            axisTick: {
                show: false
            },
            axisLine: {
                show: false
            }
        },
        yAxis: [{
            inverse: true,
            type: 'category',
            splitLine: {
                show: false
            },
            axisLine: {
                show: false
            },
            axisLabel: {
                align: 'left',
                verticalAlign: 'bottom',
                padding: [0, 0, 26, 10],
                fontSize: "18",
                color: '#fff',
                formatter: function (param) {
                    return ['{img|}' + '{b|' + param + '}']
                },
                rich: {
                    b: {
                        fontSize: 18,
                        color: '#fff',
                        padding: [0, 0, 0, 10]
                    },
                    img: {
                        backgroundColor: {
                            image: '/img/web/group/c-i1.png',
                        },
                        width: 17,
                        align: 'left',
                    }
                }
            },
            axisTick: {
                show: false
            },
            data: ['质押重量'],
        },
            {
                type: "category",
                inverse: true,
                axisTick: "none",
                axisLine: "none",
                show: true,
                axisLabel: {
                    inside: true,
                    verticalAlign: "bottom",
                    textStyle: {
                        fontFamily: 'DINCond-Bold',
                        color: "#ffd12b",
                        fontSize: "20",
                        padding: [0, 0, 26, 0],
                    },
                    formatter: function (param) {
                        return toThousands(param)
                    }
                },
                data: ydata,
            }
        ],
        series: [{
            name: '占比',
            type: 'bar',
            stack: 'all',
            barWidth: 12,
            itemStyle: {
                color: '#00e4fa'
            },
            data: predata,
            z: 1
        },
            {
                name: '辅助值',
                type: 'pictorialBar',
                barWidth: 12,
                symbol: 'roundRect',
                symbolMargin: 2,
                symbolSize: [2, 12],
                symbolOffset: [-2, '0%'],
                symbolClip: true,
                symbolRepeat: true,
                itemStyle: {
                    color: '#082640'
                },
                data: [100],
                z: 2
            },
            {
                name: '背景条',
                type: 'bar',
                silent: true,
                barWidth: 12,
                barGap: '-100%',
                itemStyle: {
                    color: '#082640'
                },
                data: [100],
                z: 0
            }
        ]
    };
    barChart.setOption(option);
}

//更新饼状图信息
function renderFoodNum(data) {
    if (data.allSum.length > 8) {
        $("#foodSum").css("font-size", "25px");
    } else {
        $("#foodSum").css("font-size", "32px");
    }
    $("#foodSum").html(data.allSum);

    var foodNumPerHtml = "";
    var color = ["0, 228, 250", "22, 226, 173", "255, 181, 23", "238, 60, 72", "135, 103, 255", "41, 122, 255", "238, 60, 144", "0, 228, 250", "22, 226, 173", "255, 181, 23", "238, 60, 72", "135, 103, 255", "41, 122, 255", "238, 60, 144"];
    for (var i = 0; i < data.varietyChartPie.length; i++) {
        foodNumPerHtml += "" +
            "<li>\n" +
            "\t\t\t\t\t\t\t\t\t<div class=\"con\" style=\"background-color: rgba(" + color[i] + ",.05);\">\n" +
            "\t\t\t\t\t\t\t\t\t\t<div class=\"dot\" style=\"background-color: rgb(" + color[i] + ");\"></div>\n" +
            "\t\t\t\t\t\t\t\t\t\t<div class=\"num\" style=\"color: rgb(" + color[i] + ");\">" + data.varietyChartPie[i].percent + "%</div>\n" +
            "\t\t\t\t\t\t\t\t\t\t<div class=\"type\">" + data.varietyChartPie[i].name + "</div>\n" +
            "\t\t\t\t\t\t\t\t\t</div>\n" +
            "\t\t\t\t\t\t\t\t</li>";
    }
    $("#foodNumPer").html(foodNumPerHtml);
    if (data.varietyChartPie.length > 0) {
        var varietyChart = breedChart;
        varietyChart.option.series[0].data = data.varietyChartPie;
        varietyChart.chart.setOption(varietyChart.option, true);
        breedChart = varietyChart;
    }
    barChartLoad(data);
}