Highcharts 将图像添加到图表上每个组的每列顶部
我计划使用散点序列在highcharts图表的每个条形图上方添加标记(图像)。在jsFiddle示例中,我希望将太阳放置在蓝色柱的上方,将云放置在灰色柱的上方,再次将太阳放置在绿色柱的上方。当有一个系列()时,这很简单,但当有几个系列()时,我就做不到。你能帮我吗Highcharts 将图像添加到图表上每个组的每列顶部,highcharts,Highcharts,我计划使用散点序列在highcharts图表的每个条形图上方添加标记(图像)。在jsFiddle示例中,我希望将太阳放置在蓝色柱的上方,将云放置在灰色柱的上方,再次将太阳放置在绿色柱的上方。当有一个系列()时,这很简单,但当有几个系列()时,我就做不到。你能帮我吗 您的小提琴不起作用,因为您对该系列的定义不正确: data: [ //{ y: 30, marker: { symbol: 'url(http://www.highcharts.com/demo/gfx/sun.pn
您的小提琴不起作用,因为您对该系列的定义不正确:
data: [
//{ y: 30, marker: { symbol: 'url(http://www.highcharts.com/demo/gfx/sun.png)' }},
{
data: [10,10],
marker: { symbol: 'url(http://www.highcharts.com/demo/gfx/sun.png)' }
}, {
data: [10,10],
marker: { symbol: 'url(http://www.highcharts.com/demo/gfx/sun.png)' }
},
],
在那里,您可以看到数据数组内部的数据对象,而API不支持这些数据对象。然而,这并不是全部
为了达到你所期望的效果,你需要加上六分(每个类别三分)。请记住,类别也是xAxis
值,因此可以将十进制值指定为x
值,如下所示:
数据:[
现场示例:您的小提琴不起作用,因为您对该系列的定义不正确:
data: [
//{ y: 30, marker: { symbol: 'url(http://www.highcharts.com/demo/gfx/sun.png)' }},
{
data: [10,10],
marker: { symbol: 'url(http://www.highcharts.com/demo/gfx/sun.png)' }
}, {
data: [10,10],
marker: { symbol: 'url(http://www.highcharts.com/demo/gfx/sun.png)' }
},
],
在这里,您可以看到数据数组中的数据对象,API不支持这些数据对象。但是,这并不是全部
要达到预期效果,您需要精确添加六个点(每个类别三个)。请记住,类别也是xAxis
值,因此您可以将十进制值指定为x
值,如下所示:
数据:[
实例:
// First category
{
x: -0.20,
y: 25,
marker: {
symbol: 'url(http://www.highcharts.com/demo/gfx/sun.png)'
}
}, {
x: 0,
y: 25,
marker: {
symbol: 'url(http://www.highcharts.com/demo/gfx/snow.png)'
}
}, {
x: 0.20,
y: 25,
marker: {
symbol: 'url(http://www.highcharts.com/demo/gfx/sun.png)'
}
},
// Second category
{
x: 0.80,
y: 25,
marker: {
symbol: 'url(http://www.highcharts.com/demo/gfx/sun.png)'
}
}, {
x: 1,
y: 25,
marker: {
symbol: 'url(http://www.highcharts.com/demo/gfx/snow.png)'
}
}, {
x: 1.20,
y: 25,
marker: {
symbol: 'url(http://www.highcharts.com/demo/gfx/sun.png)'
}
}]