1
У меня есть область, которую я создал с помощью высоких диаграмм. Проблема, с которой они сталкиваются, - это когда линия пересекает другую, она становится светлее в цвете. Как я могу поддерживать цвет линии одинаково или когда я наводил курсор на линию, чтобы выделить ее и показать ее, не делая ее легче.выделение области диаграммы линий при скрещивании в высоких диаграммах
и как изменить цвет всплывающей подсказки в соответствии с цветом линии?
Ниже мой код
$(function() {
var marker = {
radius: 4,
fillColor: '#FFFFFF',
lineWidth: 2,
symbol: 'circle',
lineColor: null // inherit from series
};
var chart = new Highcharts.Chart({
credits: { enabled: false },
chart: {
renderTo: 'container',
type: 'area',
width: 600,
height: 400
},
title: { text: 'Title', x: -20 //center
},
subtitle: {text: 'Subtitle', x: -20 },
//title: { text: null },
xAxis: {
categories: [
'NOV 11' ,
'DEC 11' ,
'JAN 12' ,
'FEB 12' ,
'MAR 12' ,
'APR 12' ,
'MAY 12' ,
],
gridLineColor: '#DCEBEF',
gridLineWidth: 0.5,
lineColor: '#ffffff',
lineWidth: 1
//gridLineDashStyle: 'dash'
},
legend: {
enabled: false
},
yAxis: {
title: {
text: null
},
gridLineColor: '#DCEBEF',
lineColor: '#ffffff',
lineWidth: 1,
gridLineDashStyle: 'dash'
},
tooltip: {
formatter: function() {
return this.y;
},
backgroundColor: 'Grey',
borderWidth: 1,
borderColor: '#AAA',
style: {
fontWeight: 'bold',
color: 'White'
}
},
plotOptions: {
area: {
fillOpacity: 0.08
}
},
series: [{
name: null,
lineWidth: 2,
color: '#FA918C',
marker: marker,
data: [ 500, 500, 800, 1500, 1250, 800, 1150,],
zIndex: 2,
fillColor: {
linearGradient: [0, 0, 0,250],
stops: [
[0, 'rgba(250,145,150,0.5)'],
[1, 'rgba(255,255,255,0.5)']
]
}
},
{
name: null,
lineWidth: 2,
color: '#674313',
marker: marker,
data: [ 1500, 500, 800, 1500, 1050, 1800, 150,],
zIndex: 2,
fillColor: {
linearGradient: [0, 0, 0,250],
stops: [
[0, 'rgba(250,145,150,0.5)'],
[1, 'rgba(255,255,255,0.5)']
]
}
},
{
name: null,
lineWidth: 2,
color: '#87BCC2',
marker: marker,
data: [ 700, 950, 1100, 2000, 1650, 900, 1250,],
zIndex: 1,
fillColor: {
linearGradient: [0, 0, 0, 250],
stops: [
[0, 'rgba(135,188,194,0.5)'],
[1, 'rgba(255,255,255,0.5)']
]
}
}
]
});
});
Вот моя скрипка http://jsfiddle.net/tyz25j1p/3/
Любая помощь будет оценена