highchart图表 | 改变图表颜色

2024-06-04 19:18
文章标签 图表 改变 颜色 highchart

本文主要是介绍highchart图表 | 改变图表颜色,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

highchart默认颜色:



加上如下代码即可:

colors:['#000000',//黑'#FF0000',//红'#00FF00',//绿'#0000FF',//蓝'#FFFF00',//黄'#FF00FF',//紫'#FFFFFF',//紫],


完整代码:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">  <script src="jquery-1.10.2.min.js"></script>
<script src="highcharts.js"></script>   
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>  
<script>  // Create the chart  
$(function () {$('#container').highcharts({chart: {  type: 'column', },  title: {  text: 'colum'  },  colors:['#000000',//黑'#FF0000',//红'#00FF00',//绿'#0000FF',//蓝'#FFFF00',//黄'#FF00FF',//紫'#FFFFFF',//紫],xAxis: {  type: 'category',},  legend: {  enabled: false  },  plotOptions: {  series: {  borderWidth: 0,  dataLabels: {  enabled: true  },  events:{  click:function(e){//点击事件  }  }    }  },  series: [{  name: 'Things',  colorByPoint: true,  data: [{  name: 'Animals',  y: 5}, {  name: 'Fruits',  y: 2 }, {  name: 'Cars',  y: 4  }]  }], })
})  </script>  


测试结果:


这篇关于highchart图表 | 改变图表颜色的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1030882

相关文章

react笔记 8-18 事件 方法 定义方法 获取/改变数据 传值

1、定义方法并绑定 class News extends React.Component {constructor(props) {super(props)this.state = {msg:'home组件'}}run(){alert("我是一个run") //方法写在类中}render() {return (<div><h2>{this.state.msg}</h2><button onCli

渐变颜色填充

GradientFill函数可以对特定的矩形区域或者三角形区域进行渐变颜色的填充。我们先来看看GradientFill函数到底长得什么样子,帅不帅。 [cpp]  view plain copy print ? BOOL GradientFill(     _In_  HDC hdc,     _In_  PTRIVERTEX pVertex,     _In_  ULONG

【全网最全】2024年数学建模国赛A题30页完整建模文档+17页成品论文+保奖matla代码+可视化图表等(后续会更新)

您的点赞收藏是我继续更新的最大动力! 一定要点击如下的卡片,那是获取资料的入口! 【全网最全】2024年数学建模国赛A题30页完整建模文档+17页成品论文+保奖matla代码+可视化图表等(后续会更新)「首先来看看目前已有的资料,还会不断更新哦~一次购买,后续不会再被收费哦,保证是全网最全资源,随着后续内容更新,价格会上涨,越早购买,价格越低,让大家再也不需要到处买断片资料啦~💰💸👋」�

【前端】animation动画以及利用vue制作简单的透明度改变动画,包含vue生命周期实现

一. 问题描述 想做一个文字透明度从1到0然后再从0到1的css动画。 二. 代码写法 2.1 animation写法 2.1.1 animation属性key 2.1.2 代码展示 <!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=de

【虚拟机/服务器】非图形化界面下修改Shell中颜色的设置

1、首先 cd ~ && ll 可以看到如下图所示 2、输入 sudo vim .bashrc 进入 .bashrc 并通过 /PS1 迅速从上往下定位第一个PS1 3、输入 i 进入插入模式后修改 else 下面的配置如下 说明:\e[1;32;40m] 其中1表示高亮显示,32表示字体颜色是绿色,40表示背景色为黑色 4、输入 esc 退出编辑模式到命令模式,再输入

HTML5如何成为改变移动互联网幕后的推手

在未来的某一天,我们打开手机,不再需要访问手机应用商店,不论是 Apple的还是Google的,我们只需要点击手机主菜单页面上的一个链接,手机就会立即在它的浏览器上启动一个 “应用程序”;再也不需要flash插件,就能欣赏华丽丽视频画面。   AD:2013云计算架构师峰会课程资料下载   2012年,说HTML5集千宠万爱于一身也毫不夸张,IE、Chrome、Firefox和Opera等

Excel查询颜色RGB值

1.选中单元格,点右键,设置单元格格式-填充-其他颜色-自定义,下面显示的就是该单元格颜色的RGB值 2.与十六进制换算: https://www.sioe.cn/yingyong/yanse-rgb-16/