地图柱状图

wyb

2021-05-13 7ceffd3f681ba8ac601ba8b35c346a9df11c55b0

地图柱状图

 HDMap.html

@@ -93,7 +93,7 @@

    </div>

    <div id="zzt" class="left" style="width:600px;height: 600px;border: 1px solid red;">
    <div id="zzt" class="left" style="width:355px;height: 355px;">

        <h2>柱状图存放地方</h2>

@@ -249,7 +249,7 @@
                    max: 500,
                    realtime: false,
                    calculable: false,
                    color: ['#00E4FF', '#ffe4b5', '#ffe4b5']
                    color: ['#00E4FF', '#00E4FF', '#ffe4b5']
                },
                series: [{
                    name: '消费金额',
@@ -509,22 +509,22 @@
    })
    function aa(mychart1) {

        var years = ['2016', '2017', '2018'];
        var years = ['2019', '2020', '2021'];
        var jdData = [
            ['香港同胞', '澳门同胞', '台湾同胞', '日  本', '韩  国', '蒙  古', '印度尼西亚', '马来西亚', '菲律宾', '新加坡', '泰  国', '印  度', '越  南', '缅  甸', '朝  鲜', '巴基斯坦', '其  它'],
            ['香港同胞', '澳门同胞', '台湾同胞', '日  本', '韩  国', '蒙  古', '印度尼西亚', '马来西亚', '菲律宾', '新加坡', '泰  国', '印  度', '越  南', '缅  甸', '朝  鲜', '巴基斯坦', '其  它'],
            ['香港同胞', '澳门同胞', '台湾同胞', '日  本', '韩  国', '蒙  古', '印度尼西亚', '马来西亚', '菲律宾', '新加坡', '泰  国', '印  度', '越  南', '缅  甸', '朝  鲜', '巴基斯坦', '其  它']
            ['中  国', '美  国', '加拿大', '俄罗斯', '丹  麦', '蒙  古', '印度尼西亚', '马来西亚', '菲律宾', '新加坡', '泰  国', '印  度', '越  南', '缅  甸', '朝  鲜', '巴基斯坦', '俄罗斯'],
            ['中  国', '美  国', '加拿大', '俄罗斯', '丹  麦', '蒙  古', '印度尼西亚', '马来西亚', '菲律宾', '新加坡', '泰  国', '印  度', '越  南', '缅  甸', '朝  鲜', '巴基斯坦', '俄罗斯'],
            ['中  国', '美  国', '加拿大', '俄罗斯', '丹  麦', '蒙  古', '印度尼西亚', '马来西亚', '菲律宾', '新加坡', '泰  国', '印  度', '越  南', '缅  甸', '朝  鲜', '巴基斯坦', '俄罗斯']
        ]
        var data = [
            [13.2, 1.11, 13.6, 9284, 64138, 2237, 4779, 48877, 2371, 36224, 12956, 2499, 4778, 594, 717, 534, 16487],
            [15.26, 1.31, 16.68, 10331, 91580, 1909, 40469, 67490, 1765, 36982, 15371, 3643, 2871, 762, 962, 757, 34414],
            [14.23, 1.31, 21.13, 10873, 94964, 2966, 129748, 59827, 8519, 38344, 18495, 3531, 1369, 544, 2005, 975, 33855,],
            [66666, 555, 333, 233, 123, 111, 4779, 456, 567, 90, 567, 89, 123, 234, 345, 534, 567],
            [666, 555, 333, 72, 23, 111, 2133, 456, 627, 567, 123, 234, 567, 1567, 678, 757, 890],
            [6666, 777, 333, 221, 45, 1111, 35, 567, 768, 1273, 345, 567, 8920, 890, 3245, 975, 345,],
        ];

        option = {

            baseOption: {
                backgroundColor: '#2c343c', //背景颜色
                backgroundColor: '', //背景颜色
                timeline: {
                    data: years,
                    axisType: 'category',
@@ -540,12 +540,12 @@
                        normal: {
                            textStyle: {

                                color: 'red',
                                color: '#00E4FF',
                            }
                        },
                        emphasis: {
                            textStyle: {
                                color: 'red'
                                color: '#00E4FF'
                            }
                        }
                    },
@@ -558,8 +558,8 @@
                        borderWidth: 2
                    },
                    controlStyle: {
                        showNextBtn: true,
                        showPrevBtn: true,
                        showNextBtn: false,
                        showPrevBtn: false,
                        normal: {
                            color: '#ff8800',
                            borderColor: '#ff8800'
@@ -577,7 +577,7 @@
                    bottom: '8%',
                    textStyle: {
                        fontSize: 50,
                        color: 'black' //标题字体颜色
                        color: '#00E4FF' //标题字体颜色
                    }
                },
                tooltip: {
@@ -621,9 +621,9 @@

                                //color:function(d){return "#"+Math.floor(Math.random()*(256*256*256-1)).toString(16);//随机生成颜色

                                var colorarrays = ['#6bc0fb', '#7fec9d', '#fedd8b', '#ffa597', '#84e4dd', '#749f83',
                                    '#ca8622', '#bda29a', '#a8d8ea', '#aa96da', '#fcbad3', '#ffffd2',
                                    '#f38181', '#fce38a', '#eaffd0', '#95e1d3', '#e3fdfd', '#749f83', '#ca8622'
                                var colorarrays = ['', '', '', '', '', '',
                                    '', '', '', '', '', '',
                                    '', '', '', '', '', '', ''
                                ];

                                //console.log("111", Index, colorarrays[Index],params); //打印序列
@@ -638,13 +638,13 @@
                    axisLine: {

                        lineStyle: {
                            color: 'balck' //Y轴颜色
                            color: '' //Y轴颜色
                        },
                    },
                    splitLine: {
                        show: false,
                        lineStyle: {
                            color: 'balck'
                            color: ''
                        }
                    },

@@ -659,7 +659,7 @@
                    },
                    axisLine: {
                        lineStyle: {
                            color: '#ffa597' //X轴颜色
                            color: '' //X轴颜色
                        }
                    },
                    axisLabel: {
@@ -700,9 +700,9 @@
                            color: function (params) {
                                // build a color map as your need.
                                //color:function(d){return "#"+Math.floor(Math.random()*(256*256*256-1)).toString(16);//随机生成颜色         
                                var colorList = ['#6bc0fb', '#7fec9d', '#fedd8b', '#ffa597', '#84e4dd', '#749f83',
                                    '#ca8622', '#bda29a', '#a8d8ea', '#aa96da', '#fcbad3', '#ffffd2',
                                    '#f38181', '#fce38a', '#eaffd0', '#95e1d3', '#e3fdfd', '#749f83', '#ca8622'
                                var colorList = ['', '', '', '', '', '',
                                    '', '', '', '', '', '',
                                    '', '', '', '', '', '', ''
                                ];
                                // return colorList[params.dataIndex]

@@ -733,12 +733,12 @@
                            }
                        },
                    },
                    barWidth: '50%',
                    barWidth: '40%',
                    barGap: '-100%',
                    label: {
                        normal: {
                            show: true,
                            fontSize: 16,  //标签国家字体大小
                            fontSize: 8,  //标签国家字体大小
                            position: 'left', //数值显示在右侧
                            formatter: function (p) {
                                return p.name;
@@ -752,9 +752,9 @@
                            color: function (params) {
                                // build a color map as your need.
                                //color:function(d){return "#"+Math.floor(Math.random()*(256*256*256-1)).toString(16);//随机生成颜色         
                                var colorList = ['#6bc0fb', '#7fec9d', '#fedd8b', '#ffa597', '#84e4dd', '#749f83',
                                    '#ca8622', '#bda29a', '#a8d8ea', '#aa96da', '#fcbad3', '#ffffd2',
                                    '#f38181', '#fce38a', '#eaffd0', '#95e1d3', '#e3fdfd', '#749f83', '#ca8622'
                                var colorList = ['#84e4dd', '#7fec9d', '#ffe4b5', '#ffe4b5', '#00E4FF', '#749f83',
                                    '#ffe4b5', '#ffe4b5', '#84e4dd', '#ffe4b5', '#ffe4b5', '#ffe4b5',
                                    '#ffe4b5', '#ffe4b5', '#ffe4b5', '#ffe4b5', '#ffe4b5', '#ffe4b5', '#ffe4b5'
                                ];
                                // return colorList[params.dataIndex]