JS数据根据键值匹配Echarts颜色的解决方案

简介: JS数据根据键值匹配Echarts颜色的解决方案
 // 排行颜色
    var colorListMapping = {
        '广东': '#7711AF',
        '山东': '#CF77FF',
        '浙江': '#AE004F',
        '上海': '#F35872',
        '北京': '#FA7729',
        '江苏': '#FFC526',
        '安徽': '#F8E71C',
        '四川': '#34ADAE',
        '湖北': '#3DDFD2',
        '河北': '#A0FFFF',
        '湖南': '#7711AF',
        '福建': '#CF77FF',
        '河南': '#7711AF',
        '广西': '#CF77FF',
        '陕西': '#AE004F',
        '云南': '#F35872',
        '江西': '#FA7729',
        '天津': '#FFC526',
        '重庆': '#F8E71C',
        '山西': '#34ADAE',
        '辽宁': '#3DDFD2',
        '贵州': '#A0FFFF',
        '甘肃': '#7711AF',
        '内蒙古': '#CF77FF',
        '海南': '#7711AF',
        '黑龙江': '#CF77FF',
        '吉林': '#AE004F',
        '宁夏': '#F35872',
        '新疆': '#FA7729',
        '青海': '#FFC526'
    };
    var colorListS1 = [];
    var colors = []
    for (var key in colorListMapping) {
        colors.push(colorListMapping[key])
    }
    for (var i = 0; i < rankData.length; i++) {
        var colorListF1 = {};
        for (var n = 0; n < rankData[i].data.length; n++) {
            var name = rankData[i].data[n].name;
            colorListF1[name] = colors[n];
        }
        colorListS1[i] = colorListF1;
    }
相关文章
|
23天前
echarts 横纵分割线颜色透明度
echarts 横纵分割线颜色透明度
|
2月前
|
JSON JavaScript 前端开发
解决js中Long类型数据在请求与响应过程精度丢失问题(springboot项目中)
解决js中Long类型数据在请求与响应过程精度丢失问题(springboot项目中)
42 0
|
2月前
|
JavaScript 前端开发
JavaScript随手笔记 --- 对数据进行判断最大位数是否超过八位
JavaScript随手笔记 --- 对数据进行判断最大位数是否超过八位
|
3月前
|
前端开发 算法 数据可视化
怎么在echarts图上左右滑动切换数据区间
怎么在echarts图上左右滑动切换数据区间
59 0
|
3月前
|
数据可视化
echarts图表坐标轴数据标签添加下划线
echarts图表坐标轴数据标签添加下划线
55 0
|
3月前
|
前端开发 JavaScript BI
Django教程第5章 | Web开发实战-数据统计图表(echarts、highchart)
使用echarts和highcharts图表库实现折线图、柱状图、饼图和数据集图
64 2
|
2天前
|
JavaScript 前端开发 网络协议
利用Node.js和cpolar实现远程访问,无需公网IP和路由器设置的完美解决方案
利用Node.js和cpolar实现远程访问,无需公网IP和路由器设置的完美解决方案
12 0
|
5天前
|
新零售 分布式计算 数据可视化
数据分享|基于Python、Hadoop零售交易数据的Spark数据处理与Echarts可视化分析
数据分享|基于Python、Hadoop零售交易数据的Spark数据处理与Echarts可视化分析
16 0
|
9天前
|
JavaScript 前端开发 安全
JavaScript中跨域资源共享(CORS):原理和解决方案
【4月更文挑战第22天】本文介绍了JavaScript中跨域资源共享(CORS)的原理和解决方案。CORS借助HTTP头部字段允许跨域请求,核心是Access-Control-Allow-Origin响应头。解决方案包括:服务器端设置响应头(如使用Express.js的cors中间件)、使用代理服务器或JSONP。现代Web开发推荐使用CORS,因为它更安全、灵活,而JSONP已逐渐被淘汰。理解并正确实施CORS能提升Web应用性能和安全性。
|
23天前
|
JavaScript
EasyUi js 加载数据进下拉框combobox
EasyUi js 加载数据进下拉框combobox