highcharts柱形图高宽设置不同颜色之后怎么根据不同颜色设置对应是图例

问题对人有帮助,内容完整,我也想知道答案
问题没有实际价值,缺少关键内容,没有改进余地
我想要自定义图例,请问各位大神该怎么自定义图例每一根柱子定义一个图例
答案对人有帮助,有参考价值
答案没帮助,是错误的答案,答非所问
自己用 div + css + js 写个类似图例的功能不就行了嘛,参考例子:
同步到新浪微博
分享到微博?
你好!看起来你挺喜欢这个内容,但是你还没有注册帐号。 当你创建了帐号,我们能准确地追踪你关注的问题,在有新答案或内容的时候收到网页和邮件通知。还能直接向作者咨询更多细节。如果上面的内容有帮助,记得点赞 (????)? 表示感谢。
明天提醒我
关闭理由:
删除理由:
忽略理由:
推广(招聘、广告、SEO 等)方面的内容
与已有问题重复(请编辑该提问指向已有相同问题)
答非所问,不符合答题要求
宜作评论而非答案
带有人身攻击、辱骂、仇恨等违反条款的内容
无法获得确切结果的问题
非开发直接相关的问题
非技术提问的讨论型问题
其他原因(请补充说明)
我要该,理由是:series: [{&
&&&&&&&&&&&&&&& data: [{'color':'#F6BD0F','y':11},&
&& &&& &&& &&& &&& &&& &&& &{'color':'#AFD8F8','y':12},&
&& &&& &&& &&& &&& &&& &&& &{'color':'#8BBA00','y':13},&
&& &&& &&& &&& &&& &&& &&& &{'color':'#FF8E46','y':14},&
&& &&& &&& &&& &&& &&& &&& &{'color':'#008E8E','y':15},&
&& &&& &&& &&& &&& &&& &&& &{'color':'#D64646','y':16},&
&& &&& &&& &&& &&& &&& &&& &{'color':'#8E468E','y':17}],&&
&&&&&&&&&&& }]
本文已收录于以下专栏:
相关文章推荐
在使用Echarts制作柱状图的时候,通常在横轴每个标签只有一个柱子的时候,每个柱子的颜色都是一样的,如下图所示:
然而,很多时候我们为了使界面更加美观,通常会有使每个柱子颜色都不相同的需求。那...
转自:/topic/?439
highcharts图表组件如何设置某个数据点的颜色或者数据标签的颜色值
作者:highc...
网络绝对是任何系统的核心,对于容器而言也是如此。Docker 作为目前最火的轻量级容器技术,有很多令人称道的功能,如 Docker 的镜像管理。然而,Docker的网络一直以来都比较薄弱,所以我们有必要深入了解Docker的网络知识,以满足更高的网络需求。
配置highcharts的柱状图的颜色渐变效果
JFreeChart柱状图中单组柱子用不同颜色来显示的实现方法是自定义一个Renderer来继承BarRenderer类,然后重载getItemPaint(int i,int j)方法。
实现效果如...
JFreeChart柱状图中单组柱子用不同颜色来显示的实现方法是自定义一个Renderer来继承BarRenderer类,然后重载getItemPaint(int i,int j)方法。
ExtJs的柱状图的画法其实与《【ExtJs】折线图》(点击打开链接)的画法几乎完全一样,难点在于各个柱子的颜色。ExtJs对于柱状图的颜色,并没有单独为其开放独立的参数。因此还是与《【ExtJs】表...
更多咨讯见xiaok海洋测绘网
取样器的安装:
2)活塞及管
4)安装完毕
//上周和本周的时间设置:上周(dbbartime4至dbbartime3);本周(dbbartime2至dbbartime1)
Calendar c2 = Calendar.getInstance...
【转载】Highcharts一些属性
%@ page language=&java& contentType=&text/ charset=UTF-8&   ...
工具:Vs2010,Teechart V8.0
通过teechart画柱形图,并且给每个柱形分配不同的颜色
他的最新文章
讲师:董西成
讲师:唐宇迪
您举报文章:
举报原因:
原文地址:
原因补充:
(最多只允许输入30个字)最近做移动端的数据图,需要设置正负两种柱子,以及正负两种柱子显示不同的颜色,查看API,无奈API太庞大了,求问谷歌,伟大的谷歌给我了正确的答案
I have a working chart with negative values. I would like to have columns with positive values to be blue and columsn with negative vlaues to be red.
Here is what I have:
翻译:我有一个负的值的工作表。我想有柱的正面价值观是蓝色和columsn负值是。
这里是我的:
代码就不贴了
下面是答案:
Since you are not describing how you are populating&modafor your data series here are some generalities:
The&&item is accessible. So, when building the&series.data&up you could calculate what color it should be based on the value.
You are only allowing one color in your list:&colors: [ 'blue' ],
Another option is to set the&.
既然你不能描述你是如何填充moda你的数据系列,这里有一些共性:
的项目可。所以,当建筑series.data你能计算出它应该基于价值什么颜色。
你是只允许在您的名单中,一种颜色:colors: [ 'blue' ],
另一个选项是设置。
引用地址:/question/258586/highcharts-column-with-negative-values-column-color.html
API地址:/api/index.php#plotOptions.column.negativeColor
demo地址:http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-/tree/master/samples/highcharts/plotoptions/arearange-negativecolor/
http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-/tree/master/samples/highcharts/plotoptions/series-negative-color/
//日收益率
(function () {
if($("#everyday_charts").length==0){
return false;
$('#everyday_charts').highcharts({
type: 'column'
text: null
categories: ['09-14', '09-15', '09-16', '09-17', '09-18', '09-19', '09-20', '09-21', '09-22', '09-23', '09-24', '09-25','09-26', '09-27', '09-28', '09-29', '09-30','10-01','10-02','10-03','10-04','10-05','10-06','10-07','10-08','10-09','10-10','10-11','10-12','10-13','10-14'],
step: 5 //设置X轴间隔多少显示
text: null
series: [{
color:'#ff2c55',
negativeColor: '#00ce9b',//就是这个属性设置负值的颜色
data: [15,12,-10,15,12,15,12,-10,20,12,-5,-10,20,12,-5,20,15,12,-10,20,12,-5,15,-5,12,-5,15,12,12,-5]
credits: {
enabled: false
enabled: false
credits:{//版权信息
enabled:false
tooltip:{//数据点提示框
enabled:false
阅读(...) 评论()在Highcharts中文网里,介绍了如何按照Y轴的数值范围设置背景色,也叫分辨带,它提供的demo效果像这样:
而如果要想沿着X轴设置不同的背景色或者叫分辨带该怎么办呢,在笔者的项目中,就曾经碰到过这样的需求。因为电能统计的时候是按照用电时间区分峰平谷电价的。尽量调节用电高峰到谷时电价区间,是节能的一个办法。效果图如下:
代码如下:
function chartsDay(renderTo) {
zoomType: 'x',
resetZoomButton: {
fill: 'white',
stroke: 'silver',
fill: '#000',
color: 'white'
renderTo: renderTo,
plotBackgroundColor: null,
plotBorderWidth: null,
height: 382,
plotShadow: false,
type: 'spline'
text: currentRoom == 0 ? '总功率 ' + theYear + '年' + (theMonth + 1) + '月' + theDay + '日' : currentRoom + ' 号房间 ' + currentRoomName + ' ' + theYear + '年' + (theMonth + 1) + '月' + theDay + '日' + ' 功率曲线'
subtitle: {
type: 'datetime',
tickLength: 0,
tickWidth: 0,
rotation: 0,
align: 'right',
fontSize: '13px',
fontFamily: 'Verdana, sans-serif'
plotBands: [
from: Date.UTC(theYear, theMonth, theDay, 0) + localOffset,
to: Date.UTC(theYear, theMonth, theDay, 6) + localOffset,
color: '#003377',
text: '谷时',
color: '#FFFFFF'
from: Date.UTC(theYear, theMonth, theDay, 6) + localOffset,
to: Date.UTC(theYear, theMonth, theDay, 8) + localOffset,
text: '平时',
color: '#FFFFFF'
from: Date.UTC(theYear, theMonth, theDay, 8) + localOffset,
to: Date.UTC(theYear, theMonth, theDay, 11) + localOffset,
color: '#800000',
text: '峰时',
color: '#FFFFFF'
from: Date.UTC(theYear, theMonth, theDay, 11) + localOffset,
to: Date.UTC(theYear, theMonth, theDay, 13) + localOffset,
text: '平时',
color: '#FFFFFF'
from: Date.UTC(theYear, theMonth, theDay, 13) + localOffset,
to: Date.UTC(theYear, theMonth, theDay, 15) + localOffset,
color: '#800000',
text: '峰时',
color: '#FFFFFF'
from: Date.UTC(theYear, theMonth, theDay, 15) + localOffset,
to: Date.UTC(theYear, theMonth, theDay, 18) + localOffset,
text: '平时',
color: '#FFFFFF'
from: Date.UTC(theYear, theMonth, theDay, 18) + localOffset,
to: Date.UTC(theYear, theMonth, theDay, 21) + localOffset,
color: '#800000',
text: '峰时',
color: '#FFFFFF'
from: Date.UTC(theYear, theMonth, theDay, 21) + localOffset,
to: Date.UTC(theYear, theMonth, theDay, 22) + localOffset,
text: '平时',
color: '#FFFFFF'
from: Date.UTC(theYear, theMonth, theDay, 22) + localOffset,
to: Date.UTC(theYear, theMonth, theDay, 24) + localOffset,
color: '#003377',
text: '谷时',
color: '#FFFFFF'
text: 'kW'
plotLines: [{
plotOptions: {
allowPointSelect: true,
cursor: 'pointer',
lineWidth: 2,
lineWidth: 3
enabled: false
tooltip: {
crosshairs: true,
shared: true
enabled: false
exporting: {
enabled: false
series: [{
name: '功率值',
pointStart: Date.UTC(theYear, theMonth, theDay, 0, 0, 0, 0) + localOffset,
pointInterval: 300 * 1000,
data: dayValueArray
简单来说,就是给xAxis的plotBands设置属性数组。
持续更新中。。。
本文已收录于以下专栏:
相关文章推荐
Highcharts是一款纯javascript编写的图表库,能够很简单便捷地在Web网站或Web应用中添加交互性的图表,Highcharts目前支持直线图、曲线图、面积图、柱状图、饼图、散点图等多达...
本文简单介绍下VC程序中list列表控件的背景设置。
1.新建对话框应用程序
首先,新建对话框应用程序,然后添加两个list列表控件
2.设置控件模式为报告模式
网络绝对是任何系统的核心,对于容器而言也是如此。Docker 作为目前最火的轻量级容器技术,有很多令人称道的功能,如 Docker 的镜像管理。然而,Docker的网络一直以来都比较薄弱,所以我们有必要深入了解Docker的网络知识,以满足更高的网络需求。
基于对话框的MFC AppWizard应用程序中,改变对话框的背景颜色---- 方法一:    调用CWinApp类的成员函数SetDialogBkColor来实现。 ---- 其中函数的第一个参数指...
在安卓中,有时候一句话中的文本有不同的颜色、大小,如果我们用不同TextView去拼接会增多view的个数,不利于性能优化。可以通过代码的方式在一个View中显示不同的文本属性
UICollectionView 无法通过属性设置或数据源来为不同的 Section 设置不同的背景颜色,要想达到这样的效果就需要自定义自己的布局对象(UICollectionViewLayout)。...
package com.mz.import android.content.C
import android.graphics.B
import android.g...
java.util.ArrayL 
java.util.HashM 
android.os.B 
下午在做图表的练习,刚把模型搞完,想着练练图表的开发,结果就一个背景的那个交替色带,想不要他,结果找了半天没找到,
记得之前写过博客的,结果一看,博客名字起得有问题,描述也是有问题的,没有介绍清楚,看...
项目中用到更改自定义AndroidMenu背景图片,背景色等,网上转载了一篇如下:本文转载自 池塘里的大象
更改背景颜色后效果如下:
具体代码如下:
public boolean onC...
今天研究了一下午,终于整出了,menu的背景图片和背景色的设置。效果如上图,呵呵不太好看啊
这我就不管了,只作为参考,你们自己看看吧。代码如下:
package com.hooypay....
他的最新文章
讲师:董西成
讲师:唐宇迪
您举报文章:
举报原因:
原文地址:
原因补充:
(最多只允许输入30个字)

我要回帖

更多关于 highcharts 颜色设置 的文章

 

随机推荐