You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by GitBox <gi...@apache.org> on 2020/09/11 19:44:12 UTC
[GitHub] [incubator-echarts] Bilge opened a new issue #13269: Style MarkLine label background
Bilge opened a new issue #13269:
URL: https://github.com/apache/incubator-echarts/issues/13269
### What problem does this feature solve?
Better MarkLine label presentation.
| What I want to achieve | Best I can achieve with eCharts currently |
|-|-|
|  |  |
### What does the proposed API look like?
```js
markLine: {
labelStyle: {
color: '#f00',
background: '#0f0',
borderRadius: 2,
padding: 4,
}
}
```
<!-- This issue is generated by echarts-issue-helper. DO NOT REMOVE -->
<!-- This issue is in English. DO NOT REMOVE -->
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] echarts-bot[bot] commented on issue #13269: Style MarkLine label background
Posted by GitBox <gi...@apache.org>.
echarts-bot[bot] commented on issue #13269:
URL: https://github.com/apache/incubator-echarts/issues/13269#issuecomment-691280261
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] Bilge commented on issue #13269: Style MarkLine label background
Posted by GitBox <gi...@apache.org>.
Bilge commented on issue #13269:
URL: https://github.com/apache/incubator-echarts/issues/13269#issuecomment-692639884
Thanks @narayn92, I was able to get results quite close to the reference image with the properties you provided.
| What I want to achieve | Best I can achieve with eCharts now |
|-|-|
|  |  |
But why aren't they documented? Probably we should keep this issue open until they are documented so other people can find them.
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] mmm2006 edited a comment on issue #13269: Style MarkLine label background
Posted by GitBox <gi...@apache.org>.
mmm2006 edited a comment on issue #13269:
URL: https://github.com/apache/incubator-echarts/issues/13269#issuecomment-730080331
@narayn92, Thank your help. I will try it.
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] narayn92 commented on issue #13269: Style MarkLine label background
Posted by GitBox <gi...@apache.org>.
narayn92 commented on issue #13269:
URL: https://github.com/apache/incubator-echarts/issues/13269#issuecomment-728001369
@mmm2006 Html format is not supported for labels currently. Instead you can use rich text for label.
Please refer the following link,
https://echarts.apache.org/en/tutorial.html#Rich%20Text
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] mmm2006 commented on issue #13269: Style MarkLine label background
Posted by GitBox <gi...@apache.org>.
mmm2006 commented on issue #13269:
URL: https://github.com/apache/incubator-echarts/issues/13269#issuecomment-730080331
narayn92, Thank your help. I will try it.
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] narayn92 edited a comment on issue #13269: Style MarkLine label background
Posted by GitBox <gi...@apache.org>.
narayn92 edited a comment on issue #13269:
URL: https://github.com/apache/incubator-echarts/issues/13269#issuecomment-692580788
@Bilge The above problem can be solved using the existing label properties which are not listed in the official documentation.
You can see these properties in the source code. Attached screenshot for your reference.
**Sample chart option:**
var option = {
xAxis: {
data: ['A', 'B', 'C', 'D', 'E'],
},
yAxis: {},
series: [{
name: 'line',
type: 'line',
data: [1, 2, 3, 4, 5],
markLine: {
data: [{
name: 'My label',
xAxis: 'D',
label: {
formatter: '{b}',
position: 'insideMiddleTop',
color: '#fff',
textBorderColor: '#000',
textBorderWidth: 2,
fontStyle: 'italic',
fontWeight: 'bold',
fontSize: 50,
fontFamily: 'Helvetica',
// lineHeight: 25,
// width: 200,
// height: 200,
// tag: 'asdasdasdasdasd',
backgroundColor: '#ff0000',
padding: 25,
borderColor: '#000',
borderWidth: 2,
borderRadius: 5,
shadowColor: '#333333',
shadowBlur: 5,
shadowOffsetX: 5,
shadowOffsetY: 5,
textShadowColor: '#0000ff',
textShadowBlur: 5,
textShadowOffsetX: 5,
textShadowOffsetY: 5,
}
}]
}
}]
};
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] narayn92 commented on issue #13269: Style MarkLine label background
Posted by GitBox <gi...@apache.org>.
narayn92 commented on issue #13269:
URL: https://github.com/apache/incubator-echarts/issues/13269#issuecomment-692580788
@Bilge The above problem can be solved using the existing label properties which are not listed in the official documentation.
You can see these properties in the source code. Attached screenshot for your reference.
**Sample chart option:**
`var option = {
xAxis: {
data: ['A', 'B', 'C', 'D', 'E'],
},
yAxis: {},
series: [{
name: 'line',
type: 'line',
data: [1, 2, 3, 4, 5],
markLine: {
data: [{
name: 'My label',
xAxis: 'D',
label: {
formatter: '{b}',
position: 'insideMiddleTop',
color: '#fff',
textBorderColor: '#000',
textBorderWidth: 2,
fontStyle: 'italic',
fontWeight: 'bold',
fontSize: 50,
fontFamily: 'Helvetica',
// lineHeight: 25,
// width: 200,
// height: 200,
// tag: 'asdasdasdasdasd',
backgroundColor: '#ff0000',
padding: 25,
borderColor: '#000',
borderWidth: 2,
borderRadius: 5,
shadowColor: '#333333',
shadowBlur: 5,
shadowOffsetX: 5,
shadowOffsetY: 5,
textShadowColor: '#0000ff',
textShadowBlur: 5,
textShadowOffsetX: 5,
textShadowOffsetY: 5,
}
}]
}
}]
};
`
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] echarts-bot[bot] commented on issue #13269: Style MarkLine label background
Posted by GitBox <gi...@apache.org>.
echarts-bot[bot] commented on issue #13269:
URL: https://github.com/apache/incubator-echarts/issues/13269#issuecomment-691280261
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] mmm2006 commented on issue #13269: Style MarkLine label background
Posted by GitBox <gi...@apache.org>.
mmm2006 commented on issue #13269:
URL: https://github.com/apache/incubator-echarts/issues/13269#issuecomment-724478251
hello, I just want to know whether height and weight is supported in markline. In your upper setting, I just find height and weight, But it don't work in my test. I also want to add html tag and css attributes in my formatter: function(value),just like below,
`
formatter: function (param) { //自定义tooltip内容
var text = '';
text += '<div style="display:flex;flex-direction:row;">'+
'<div style="background-color:#03D16D;height:auto;width:10px;margin-right:5px;"></div>'+
'<div style="display:flex;flex-direction:column;">'+
'<span>'+ param[0].value+'</span>'+
'<span>'+ param[0].axisValue+'</span>'
'</div>'
'</div>'
return text;
}
`
But it just show a string. Please tell me how to support html and css in markline. Thanks.
br
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] Bilge edited a comment on issue #13269: Style MarkLine label background
Posted by GitBox <gi...@apache.org>.
Bilge edited a comment on issue #13269:
URL: https://github.com/apache/incubator-echarts/issues/13269#issuecomment-692639884
Thanks @narayn92, I was able to get results quite close to the reference image with the properties you provided.
| What I want to achieve | Best I can achieve with eCharts now |
|-|-|
|  |  |
But why aren't they documented? Probably we should keep this issue open until they are documented so other people can find them.
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] narayn92 edited a comment on issue #13269: Style MarkLine label background
Posted by GitBox <gi...@apache.org>.
narayn92 edited a comment on issue #13269:
URL: https://github.com/apache/incubator-echarts/issues/13269#issuecomment-692580788
@Bilge The above problem can be solved using the existing label properties which are not listed in the official documentation.
You can see these properties in the source code. Attached screenshot for your reference.
**Sample chart option:**
```
var option = {
xAxis: {
data: ['A', 'B', 'C', 'D', 'E'],
},
yAxis: {},
series: [{
name: 'line',
type: 'line',
data: [1, 2, 3, 4, 5],
markLine: {
data: [{
name: 'My label',
xAxis: 'D',
label: {
formatter: '{b}',
position: 'insideMiddleTop',
color: '#fff',
textBorderColor: '#000',
textBorderWidth: 2,
fontStyle: 'italic',
fontWeight: 'bold',
fontSize: 50,
fontFamily: 'Helvetica',
// lineHeight: 25,
// width: 200,
// height: 200,
// tag: 'asdasdasdasdasd',
backgroundColor: '#ff0000',
padding: 25,
borderColor: '#000',
borderWidth: 2,
borderRadius: 5,
shadowColor: '#333333',
shadowBlur: 5,
shadowOffsetX: 5,
shadowOffsetY: 5,
textShadowColor: '#0000ff',
textShadowBlur: 5,
textShadowOffsetX: 5,
textShadowOffsetY: 5,
}
}]
}
}]
};
```
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] echarts-bot[bot] commented on issue #13269: Style MarkLine label background
Posted by GitBox <gi...@apache.org>.
echarts-bot[bot] commented on issue #13269:
URL: https://github.com/apache/incubator-echarts/issues/13269#issuecomment-691280261
Hi! We've received your issue and please be patient to get responded. 🎉
The average response time is expected to be within one day for weekdays.
In the meanwhile, please make sure that **you have posted enough image to demo your request**. You may also check out the [API](http://echarts.apache.org/api.html) and [chart option](http://echarts.apache.org/option.html) to get the answer.
If you don't get helped for a long time (over a week) or have an urgent question to ask, you may also send an email to dev@echarts.apache.org. Please attach the issue link if it's a technical questions.
If you are interested in the project, you may also subscribe our [mail list](https://echarts.apache.org/en/maillist.html).
Have a nice day! 🍵
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] mmm2006 edited a comment on issue #13269: Style MarkLine label background
Posted by GitBox <gi...@apache.org>.
mmm2006 edited a comment on issue #13269:
URL: https://github.com/apache/incubator-echarts/issues/13269#issuecomment-724478251
hello, I just want to know whether height and weight is supported in markline. In your upper setting, I just find height and weight, But it don't work in my test. I also want to add html tag and css attributes in my formatter: function(value),just like below,
`
formatter: function (param) {
var text = '';
text += '<div style="display:flex;flex-direction:row;">'+
'<div style="background-color:#03D16D;height:auto;width:10px;margin-right:5px;"></div>'+
'<div style="display:flex;flex-direction:column;">'+
'<span>'+ param[0].value+'</span>'+
'<span>'+ param[0].axisValue+'</span>'
'</div>'
'</div>'
return text;
}
`
But it just show a string. Please tell me how to support html and css in markline. Thanks.
br
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org