Echarts: How to add custom graphic based on coordinate in the chart?
up vote
0
down vote
favorite
I have a line and want to add one arrow picture to sit on that line.
series: [
{
data: this.chartData.map(period => period.v),
symbol: 'circle',
symbolSize: 8,
connectNulls: false,
type: 'line',
zlevel: 1,
markLine: {
data: [
{
name: 'limitLIne',
yAxis: this.limitLine,
lineStyle: {
color: '#000',
type: 'solid',
width: 2,
},
},
]},
},
],
graphic: [{
type: 'image',
id: 'arrowUp',
style: {
x: 50,
y: 100,
image: arrows.arrowUp,
},
}]
I want to add picture based on position of the limitLine. So the picture will sit on top of it. Is this possible to do. I only found in docs to use absolute position. This is not the problem for x axis but I want y to be reactive.
javascript echarts
asked Nov 7 at 14:36
lejhbah
103111
add a comment |
up vote
0
down vote
favorite
I have a line and want to add one arrow picture to sit on that line.
series: [
{
data: this.chartData.map(period => period.v),
symbol: 'circle',
symbolSize: 8,
connectNulls: false,
type: 'line',
zlevel: 1,
markLine: {
data: [
{
name: 'limitLIne',
yAxis: this.limitLine,
lineStyle: {
color: '#000',
type: 'solid',
width: 2,
},
},
]},
},
],
graphic: [{
type: 'image',
id: 'arrowUp',
style: {
x: 50,
y: 100,
image: arrows.arrowUp,
},
}]
I want to add picture based on position of the limitLine. So the picture will sit on top of it. Is this possible to do. I only found in docs to use absolute position. This is not the problem for x axis but I want y to be reactive.
javascript echarts
asked Nov 7 at 14:36
lejhbah
103111
add a comment |
up vote
0
down vote
favorite
up vote
0
down vote
favorite
I have a line and want to add one arrow picture to sit on that line.
series: [
{
data: this.chartData.map(period => period.v),
symbol: 'circle',
symbolSize: 8,
connectNulls: false,
type: 'line',
zlevel: 1,
markLine: {
data: [
{
name: 'limitLIne',
yAxis: this.limitLine,
lineStyle: {
color: '#000',
type: 'solid',
width: 2,
},
},
]},
},
],
graphic: [{
type: 'image',
id: 'arrowUp',
style: {
x: 50,
y: 100,
image: arrows.arrowUp,
},
}]
I want to add picture based on position of the limitLine. So the picture will sit on top of it. Is this possible to do. I only found in docs to use absolute position. This is not the problem for x axis but I want y to be reactive.
javascript echarts
asked Nov 7 at 14:36
lejhbah
103111
I have a line and want to add one arrow picture to sit on that line.
series: [
{
data: this.chartData.map(period => period.v),
symbol: 'circle',
symbolSize: 8,
connectNulls: false,
type: 'line',
zlevel: 1,
markLine: {
data: [
{
name: 'limitLIne',
yAxis: this.limitLine,
lineStyle: {
color: '#000',
type: 'solid',
width: 2,
},
},
]},
},
],
graphic: [{
type: 'image',
id: 'arrowUp',
style: {
x: 50,
y: 100,
image: arrows.arrowUp,
},
}]
I want to add picture based on position of the limitLine. So the picture will sit on top of it. Is this possible to do. I only found in docs to use absolute position. This is not the problem for x axis but I want y to be reactive.
javascript echarts
javascript echarts
asked Nov 7 at 14:36
lejhbah
103111
asked Nov 7 at 14:36
lejhbah
103111
asked Nov 7 at 14:36
lejhbah
103111
asked Nov 7 at 14:36
lejhbah
103111
asked Nov 7 at 14:36
lejhbah
103111
103111
add a comment |
add a comment |
active
oldest
votes
active
oldest
votes
active
oldest
votes
active
oldest
votes
active
oldest
votes
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53191603%2fecharts-how-to-add-custom-graphic-based-on-coordinate-in-the-chart%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
