使用Javascript的条件Highcharts标记符号
我发誓我以前见过这种情况,但似乎找不到答案 当我旋转Highcharts时,是否有一种方法让内联语句确定标记符号 例如:使用Javascript的条件Highcharts标记符号,javascript,highcharts,Javascript,Highcharts,我发誓我以前见过这种情况,但似乎找不到答案 当我旋转Highcharts时,是否有一种方法让内联语句确定标记符号 例如: Highcharts.stockChart(chartElementId, { title: { text: 'Foo chart' }, series: [{ name: 'Foo', data: ..., marker: { enabled: true,
Highcharts.stockChart(chartElementId, {
title: {
text: 'Foo chart'
},
series: [{
name: 'Foo',
data: ...,
marker: {
enabled: true,
symbol: this.x > 1 ? 'circle' : 'square'
}
}]
});
我见过类似的东西(在绘制图表之后),但我想知道是否有一种方法可以在渲染过程中进行。 可以挂接到负责绘制点的函数,在调用该函数之前,根据选项中定义的符号回调更新点
包装支点方法:
const H = Highcharts;
H.wrap(H.Series.prototype, 'drawPoints', function(p) {
const options = this.options;
const symbolCallback = options.marker && options.marker.symbolCallback;
const points = this.points;
if (symbolCallback && points.length) {
points.forEach(point => {
const symbol = symbolCallback.call(point);
if (symbol) {
point.update({
marker: {
symbol: symbol
}
}, false)
}
})
}
p.call(this);
})
系列配置:
series: [{
marker: {
symbolCallback: function() {
return this.x > 2 ? this.y > 150 ? 'circle' : 'triangle' : 'square';
}
},
实例
var H=Highcharts;
H.wrap(H.Series.prototype,'drawPoints',函数(p){
const options=this.options;
const symbolCallback=options.marker&&options.marker.symbolCallback;
const points=this.points;
if(symbolCallback&&points.length){
points.forEach(point=>{
const symbol=symbolCallback.call(点);
如果(符号){
point.update({
标记:{
符号:符号
}
},错)
}
})
}
p、 叫(这个);
})
H.图表(‘容器’{
系列:[{
标记:{
symbolCallback:function(){
返回这个.x>2?这个.y>150?'circle':'triangle':'square';
}
},
数据:[29.9,71.5,106.4,129.2,144.0,176.0,135.6148.5,216.4194.1,95.6,54.4]
}]
});代码>
您可以连接到负责绘制点的函数,在调用该函数之前,根据选项中定义的符号回调更新点
包装支点方法:
const H = Highcharts;
H.wrap(H.Series.prototype, 'drawPoints', function(p) {
const options = this.options;
const symbolCallback = options.marker && options.marker.symbolCallback;
const points = this.points;
if (symbolCallback && points.length) {
points.forEach(point => {
const symbol = symbolCallback.call(point);
if (symbol) {
point.update({
marker: {
symbol: symbol
}
}, false)
}
})
}
p.call(this);
})
系列配置:
series: [{
marker: {
symbolCallback: function() {
return this.x > 2 ? this.y > 150 ? 'circle' : 'triangle' : 'square';
}
},
实例
var H=Highcharts;
H.wrap(H.Series.prototype,'drawPoints',函数(p){
const options=this.options;
const symbolCallback=options.marker&&options.marker.symbolCallback;
const points=this.points;
if(symbolCallback&&points.length){
points.forEach(point=>{
const symbol=symbolCallback.call(点);
如果(符号){
point.update({
标记:{
符号:符号
}
},错)
}
})
}
p、 叫(这个);
})
H.图表(‘容器’{
系列:[{
标记:{
symbolCallback:function(){
返回这个.x>2?这个.y>150?'circle':'triangle':'square';
}
},
数据:[29.9,71.5,106.4,129.2,144.0,176.0,135.6148.5,216.4194.1,95.6,54.4]
}]
});代码>
在这种情况下,系列应该有“x”。其思想是在串联对象中使用自参考:
{ x:2,
name: 'Tokyo',
marker: {
enabled: true
},
init : function(){
this.marker.symbol = this.x > 1 ? 'circle' : 'square';
return this;
},
data: ....
}.init()
在这种情况下,系列应该有“x”。其思想是在串联对象中使用自参考:
{ x:2,
name: 'Tokyo',
marker: {
enabled: true
},
init : function(){
this.marker.symbol = this.x > 1 ? 'circle' : 'square';
return this;
},
data: ....
}.init()
是否要根据点值更改标记?@Barbara-在我的情况下,如果在另一个列表中找到X值,则会发生此情况。官方已根据系列中的值更改标记。是否要根据点值更改标记?@Barbara-在我的情况下,如果在另一个列表中找到X值,则会发生此情况。官方已根据序列中的值更改标记要澄清,我想根据其值自定义每个标记(不是自定义整个序列以使用相同的标记)。要澄清,我想根据其值自定义每个标记(不是自定义整个序列以使用相同的标记)。