值应该是从大到小排列的,我想让颜色与值一一对应 (1-3名 各对应一个颜色,4-10对应同一种颜色),

但实际上好像是反正来着,是从小到大排列的。

color: function (params) {

var colorList = ['#faad39', '#66d99c', '#2f9bf1', '#64b8f9'];

return colorList[params.dataIndex];

},

var initSqrkChart = function () {

var sqrkChart = echarts.init(document.getElementById("sq-ranking"));

var sqrkOption = {

grid: {

left: '30%',

bottom: '5%',

top: '5%',

right: '10%',

},

calculable: true,

xAxis: [{

type: 'value',

show: false,

boundaryGap: [0, 0.01]

}],

yAxis: [{

type: 'category',

data: ['杭州', '呼和浩特', '北京', '深圳', '湖南', '海南', '江西', '内蒙古', '徐州', '朔州'],

axisLabel: {

textStyle: {

color: '#9da5b5', //坐标值得具体的颜色

}

},

axisLine: {

show: false

},

axisTick: {

show: false

}

}],

series: [{

type: 'bar',

radius: ['50%', '70%'],

avoidLabelOverlap: false,

center: ['52%', '60%'],

barWidth: 16,

itemStyle: {

normal: {

color: function (params) {

console.log(params);

var colorList = ['#faad39', '#66d99c', '#2f9bf1', '#64b8f9'];

return colorList[params.dataIndex];

},

// 初始化 柱形图圆角

barBorderRadius: [4, 4, 4, 4]

}

},

data: [{

value: 100,

name: '杭州'

}, {

value: 90,

name: '呼和浩特'

},

{

value: 80,

name: '北京'

},

{

value: 70,

name: '深圳'

},

{

value: 60,

name: '湖南'

},

{

value: 50,

name: '海南'

},

{

value: 30,

name: '江西'

}, {

value: 20,

name: '内蒙古'

},

{

value: 10,

name: '徐州'

},

{

value: 5,

name: '朔州'

},

]

}]

};

if (sqrkOption && typeof sqrkOption === "object") {

sqrkChart.setOption(sqrkOption, true);

}

}

echarts自动排序_百度echarts 排序问题相关推荐

  1. echarts中x轴文件消失_百度Echarts图表在Vue项目的完整引入以及按需加载

    导语 近日在项目中需要进行图表展示,百度的Echarts图表是非常合适的一个选择.项目是vue-cli搭建的,如何在项目中引入Echarts就是一个问题了.亲自动手实践了下,整理总结,希望对小伙伴提供 ...

  2. echarts 世界地图标点_关于echarts的那些事(地图标点,折线图,饼图)

    前记:离上一篇博客的发布已经过去两个月了,这期间总想写点什么,却怎么都写不出来,一直拖到了现在.现在的感觉,不是像这期间一样,想好好整理一番,写一篇好博客,却写不出来.事实发现,随心就好,较好的博客, ...

  3. vba 自动排序_学会这个Excel表格技巧之后,立刻实现自动排序,太牛了

    怎么实现自动排序呢?老师从网上下载的2018年各大城市最新平均工资排行表 当我改动其中一个城市的平均工资时,比如广州由7965改为10000,整个表格的顺序会自动调整: 是不是很神奇的样子,怎么做到的 ...

  4. python中用def实现自动排序_漫画排序算法Python实现

    冒泡排序 冒泡排序的思想,我们要把相邻的元素两两比较,当一个元素大于右侧相邻元素时, 交换它们的位置;当一个元素小于或等于右侧相邻元素时,位置不变. def bubbleSort(list): ran ...

  5. 百度Apollo自动驾驶_百度车载小程序

    一.百度Apollo 百度阿波罗是百度官方发布名为Apollo的自动驾驶开放平台. 百度Apollo已在自动驾驶,智能汽车,智能交通三大领域拥有解决方案. 全球智能驾驶产业领跑者 百度2013年开始布 ...

  6. cad输入法自动切换_百度输入法 Linux 版本发布,支持 Ubuntu/Deepin

    国内 Linux 生态发展又添一个惊喜,百度输入法 Linux 版本正式发布.官网显示百度输入法 Linux 版支持 Ubuntu 1804.1810.1904.1910 版本和 Deepin(深度操 ...

  7. mysql 关闭in自动排序_为什么MySQL的in查询会自动排序

    $id_arr = array(2,6,3,10);//排好序的id列表 $sql = "select user,id from user_member where id in (" ...

  8. echarts年龄饼图_解决echarts饼图显示百分比,和显示内容字体及大小

    //基于准备好的dom,初始化echarts实例 var pieEchart = echarts.init(document.getElementById('pieEchart'));//指定图表的配 ...

  9. echarts 3d地图_用Echarts绘制地图-绘制省级地图

    公司有一个大数据平台的需求,图表什么的都还好实现.主要就是当中的地图效果我没有做过所以耗费了我一些时间去查资料,万幸还是实现出来了,当然只是一个特别基础的图层没有散点没有下钻,但后面会逐步写出来,所以 ...

  10. 交叉表 列字段排序_百度App设计部:四步打造交互设计自查表

    UXD设计研究室 · 百度MEUX外部合作自媒体 设计自查是设计师常用的检验工具,经常以"自查表"形式呈现,可以帮助我们快速遍历设计方案,修正遗漏或不周.善用设计自查,不止可以避免 ...

最新文章

  1. JavaScript的AMD规范
  2. 2021-01-20 Matlab画图技巧与实例:堆叠图stackedplot
  3. 微信二维码支付快速入门
  4. POST请求转换为其他请求失效 input type=“hidden“ name=“_method“ value=“put“无效
  5. 漫画:云市场下,运营商甲方爸爸也出来抢乙方生意了?
  6. 漫画算法:5 分钟搞明白红黑树到底是什么?
  7. php和数据库的永久链接,php – WordPress永久链接,包括名称和ID,但仅考虑ID
  8. iOS 解决导航栏左右 BarButtonItem偏移位置的问题
  9. JS学习总结(4)——条件语句
  10. Win10自定义开始菜单磁贴背景颜色及图标
  11. 【资料】《模拟电子技术基础-童诗白第四版》
  12. 【已解决】由于此设备上的安全设置已更改,你的pin不再可用,单击以重新设置Pin
  13. 提升网络营销策略的方法
  14. ad17如何生成坐标文件_pcb如何导出坐标文件
  15. 音视频开发系列1:音视频开发基本概念
  16. 安装Ubuntu20.04后我做的那些事:插件,美化
  17. css hack方法,css hack方式有哪些
  18. Win10同一路由器下共享打印机
  19. 【GSAP3教程】初次上手GSAP3
  20. 十二星座匹配对象_十二星座爱情配对,看着合适各自谈恋爱的星座

热门文章

  1. Pspice仿真模型创建
  2. jdk1.8_API中文帮助文档
  3. 赛门铁克卸载工具CleanWipe14亲测有效
  4. 综合金融服务方案模板
  5. VS2012下MFC程序的换肤(Skin++、SkinMagic、USkin、SkinSharp)
  6. Word转PDF(SaveAsPDFandXPS + jacob)
  7. 软件工程毕业设计选题java_软件工程毕业设计选题
  8. 安装Git SCM for Windows
  9. 2022年(第八届)全国大学生统计建模大赛
  10. 统计学原理 实验方法