Stuck on an issue?
Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
Line does not render in Safari.
See original GitHub issueOne-line summary [问题简述]
Line does not render in Safari, only axes. Line renders correctly in Chrome and Firefox.
Version & Environment [版本及环境]
- ECharts version [ECharts 版本]: 3.4.0
- Browser version [浏览器类型和版本]: Safari Version 10.0.2 (12602.3.12.0.1)
- OS Version [操作系统类型和版本]: macOS X 10.12.2 (16C67)
Expected behaviour [期望结果]
Line should be rendered.
ECharts option [ECharts配置项]
option = {
"legend":{
"textStyle":{
"fontFamily":"Ubuntu, sans"
},
"data":[
".value.blood_pressure_sys",
".value.blood_pressure_dias"
]
},
"yAxis":[
{
"axisLabel":{
"textStyle":{
"fontFamily":"Ubuntu, sans"
}
},
"type":"value"
},
{
"axisLabel":{
"textStyle":{
"fontFamily":"Ubuntu, sans"
}
},
"type":"value"
}
],
"xAxis":{
"axisLabel":{
"textStyle":{
"fontFamily":"Ubuntu, sans"
},
"rotate":0
},
"interval":0,
"type":"time"
},
"series":[
{
"name":".value.blood_pressure_sys",
"yAxisIndex":0,
"data":[
{
"symbolSize":0,
"value":[
"2016-05-27 16:58:30.0",
100
],
"name":"2016-05-27 16:58:30.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 18:06:48.0",
100
],
"name":"2016-05-27 18:06:48.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 18:12:20.0",
100
],
"name":"2016-05-27 18:12:20.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 18:28:05.0",
100
],
"name":"2016-05-27 18:28:05.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 18:29:39.0",
101
],
"name":"2016-05-27 18:29:39.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 18:33:28.0",
100
],
"name":"2016-05-27 18:33:28.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 18:33:40.0",
101
],
"name":"2016-05-27 18:33:40.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 18:45:38.0",
100
],
"name":"2016-05-27 18:45:38.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 18:46:27.0",
130
],
"name":"2016-05-27 18:46:27.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 18:50:57.0",
105
],
"name":"2016-05-27 18:50:57.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 18:55:41.0",
110
],
"name":"2016-05-27 18:55:41.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:07:57.0",
100
],
"name":"2016-05-27 19:07:57.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:07:58.0",
100
],
"name":"2016-05-27 19:07:58.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:08:02.0",
130
],
"name":"2016-05-27 19:08:02.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:08:04.0",
105
],
"name":"2016-05-27 19:08:04.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:08:06.0",
110
],
"name":"2016-05-27 19:08:06.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:13:52.0",
100
],
"name":"2016-05-27 19:13:52.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:14:20.0",
100
],
"name":"2016-05-27 19:14:20.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:14:21.0",
100
],
"name":"2016-05-27 19:14:21.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:14:25.0",
130
],
"name":"2016-05-27 19:14:25.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:14:27.0",
105
],
"name":"2016-05-27 19:14:27.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:14:29.0",
110
],
"name":"2016-05-27 19:14:29.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:15:07.0",
100
],
"name":"2016-05-27 19:15:07.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:16:03.0",
100
],
"name":"2016-05-27 19:16:03.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:16:04.0",
100
],
"name":"2016-05-27 19:16:04.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:16:08.0",
130
],
"name":"2016-05-27 19:16:08.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:16:10.0",
105
],
"name":"2016-05-27 19:16:10.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:16:12.0",
110
],
"name":"2016-05-27 19:16:12.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:18:52.0",
100
],
"name":"2016-05-27 19:18:52.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:18:53.0",
100
],
"name":"2016-05-27 19:18:53.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:18:57.0",
130
],
"name":"2016-05-27 19:18:57.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:19:01.0",
105
],
"name":"2016-05-27 19:19:01.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:19:06.0",
110
],
"name":"2016-05-27 19:19:06.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:21:23.0",
100
],
"name":"2016-05-27 19:21:23.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:23:28.0",
100
],
"name":"2016-05-27 19:23:28.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:26:14.0",
100
],
"name":"2016-05-27 19:26:14.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:29:44.0",
100
],
"name":"2016-05-27 19:29:44.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:30:49.0",
130
],
"name":"2016-05-27 19:30:49.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:31:22.0",
105
],
"name":"2016-05-27 19:31:22.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:31:59.0",
110
],
"name":"2016-05-27 19:31:59.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:37:42.0",
105
],
"name":"2016-05-27 19:37:42.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:37:58.0",
110
],
"name":"2016-05-27 19:37:58.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:38:20.0",
130
],
"name":"2016-05-27 19:38:20.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:38:55.0",
110
],
"name":"2016-05-27 19:38:55.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:39:11.0",
110
],
"name":"2016-05-27 19:39:11.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:39:40.0",
110
],
"name":"2016-05-27 19:39:40.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:41:25.0",
110
],
"name":"2016-05-27 19:41:25.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:41:41.0",
130
],
"name":"2016-05-27 19:41:41.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:41:52.0",
110
],
"name":"2016-05-27 19:41:52.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:44:26.0",
130
],
"name":"2016-05-27 19:44:26.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:44:45.0",
110
],
"name":"2016-05-27 19:44:45.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:45:55.0",
130
],
"name":"2016-05-27 19:45:55.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:46:04.0",
110
],
"name":"2016-05-27 19:46:04.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:48:13.0",
130
],
"name":"2016-05-27 19:48:13.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:48:19.0",
110
],
"name":"2016-05-27 19:48:19.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:57:34.0",
105
],
"name":"2016-05-27 19:57:34.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 20:04:44.0",
110
],
"name":"2016-05-27 20:04:44.0"
}
],
"type":"line"
},
{
"name":".value.blood_pressure_dias",
"yAxisIndex":1,
"data":[
{
"symbolSize":0,
"value":[
"2016-05-27 16:58:30.0",
70
],
"name":"2016-05-27 16:58:30.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 18:06:48.0",
70
],
"name":"2016-05-27 18:06:48.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 18:12:20.0",
70
],
"name":"2016-05-27 18:12:20.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 18:28:05.0",
70
],
"name":"2016-05-27 18:28:05.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 18:29:39.0",
72
],
"name":"2016-05-27 18:29:39.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 18:33:28.0",
70
],
"name":"2016-05-27 18:33:28.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 18:33:40.0",
72
],
"name":"2016-05-27 18:33:40.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 18:45:38.0",
70
],
"name":"2016-05-27 18:45:38.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 18:46:27.0",
85
],
"name":"2016-05-27 18:46:27.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 18:50:57.0",
65
],
"name":"2016-05-27 18:50:57.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 18:55:41.0",
65
],
"name":"2016-05-27 18:55:41.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:07:57.0",
70
],
"name":"2016-05-27 19:07:57.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:07:58.0",
70
],
"name":"2016-05-27 19:07:58.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:08:02.0",
85
],
"name":"2016-05-27 19:08:02.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:08:04.0",
65
],
"name":"2016-05-27 19:08:04.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:08:06.0",
65
],
"name":"2016-05-27 19:08:06.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:13:52.0",
70
],
"name":"2016-05-27 19:13:52.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:14:20.0",
70
],
"name":"2016-05-27 19:14:20.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:14:21.0",
70
],
"name":"2016-05-27 19:14:21.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:14:25.0",
85
],
"name":"2016-05-27 19:14:25.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:14:27.0",
65
],
"name":"2016-05-27 19:14:27.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:14:29.0",
65
],
"name":"2016-05-27 19:14:29.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:15:07.0",
70
],
"name":"2016-05-27 19:15:07.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:16:03.0",
70
],
"name":"2016-05-27 19:16:03.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:16:04.0",
70
],
"name":"2016-05-27 19:16:04.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:16:08.0",
85
],
"name":"2016-05-27 19:16:08.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:16:10.0",
65
],
"name":"2016-05-27 19:16:10.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:16:12.0",
65
],
"name":"2016-05-27 19:16:12.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:18:52.0",
70
],
"name":"2016-05-27 19:18:52.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:18:53.0",
70
],
"name":"2016-05-27 19:18:53.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:18:57.0",
85
],
"name":"2016-05-27 19:18:57.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:19:01.0",
65
],
"name":"2016-05-27 19:19:01.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:19:06.0",
65
],
"name":"2016-05-27 19:19:06.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:21:23.0",
70
],
"name":"2016-05-27 19:21:23.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:23:28.0",
70
],
"name":"2016-05-27 19:23:28.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:26:14.0",
70
],
"name":"2016-05-27 19:26:14.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:29:44.0",
70
],
"name":"2016-05-27 19:29:44.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:30:49.0",
85
],
"name":"2016-05-27 19:30:49.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:31:22.0",
65
],
"name":"2016-05-27 19:31:22.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:31:59.0",
65
],
"name":"2016-05-27 19:31:59.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:37:42.0",
65
],
"name":"2016-05-27 19:37:42.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:37:58.0",
65
],
"name":"2016-05-27 19:37:58.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:38:20.0",
85
],
"name":"2016-05-27 19:38:20.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:38:55.0",
65
],
"name":"2016-05-27 19:38:55.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:39:11.0",
65
],
"name":"2016-05-27 19:39:11.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:39:40.0",
65
],
"name":"2016-05-27 19:39:40.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:41:25.0",
65
],
"name":"2016-05-27 19:41:25.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:41:41.0",
85
],
"name":"2016-05-27 19:41:41.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:41:52.0",
65
],
"name":"2016-05-27 19:41:52.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:44:26.0",
85
],
"name":"2016-05-27 19:44:26.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:44:45.0",
65
],
"name":"2016-05-27 19:44:45.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:45:55.0",
85
],
"name":"2016-05-27 19:45:55.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:46:04.0",
65
],
"name":"2016-05-27 19:46:04.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:48:13.0",
85
],
"name":"2016-05-27 19:48:13.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:48:19.0",
65
],
"name":"2016-05-27 19:48:19.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 19:57:34.0",
65
],
"name":"2016-05-27 19:57:34.0"
},
{
"symbolSize":0,
"value":[
"2016-05-27 20:04:44.0",
65
],
"name":"2016-05-27 20:04:44.0"
}
],
"type":"line"
}
],
"color":[
"#93a9a6",
"#cda71f",
"#eb6f76",
"#66b35b",
"#bd97e2",
"#5b5925",
"#884a6f",
"#51b3f6",
"#cca067",
"#398465",
"#3c607a",
"#81463c",
"#b65f33",
"#9aae31",
"#ce8b9e",
"#6c6356",
"#95a779",
"#44aecb",
"#e987c2",
"#8a7ea0",
"#3d6c2f",
"#40b994",
"#87984a",
"#c1a088",
"#9b6e2d",
"#428c8d",
"#b8766a",
"#eb8666",
"#df883e",
"#bb6273",
"#c994bf",
"#929de0",
"#7ba5cb",
"#ae9093",
"#66557b",
"#936370",
"#3c6d64",
"#84693f",
"#c19744",
"#e77aa1",
"#5d555f",
"#4078a2",
"#3fafaf",
"#698b99",
"#486a4c",
"#7ea48b",
"#b57e57",
"#8c72aa",
"#609050",
"#56b379",
"#489f8b",
"#714d4a",
"#9a8867",
"#93b66b",
"#7da93f",
"#877424",
"#c75d56",
"#b774ac",
"#7b7a3e",
"#73581c",
"#398ea3",
"#964734",
"#df8d89",
"#af97cc",
"#96951f",
"#a37791",
"#7c4d2e",
"#78865f",
"#216b74",
"#935524",
"#6fafb6",
"#75ab76",
"#a48b50",
"#d28dd0",
"#be9aaf",
"#ad8d22",
"#d89576",
"#964860",
"#9b9a61",
"#4daadb",
"#a9628d",
"#98943b",
"#486366",
"#6d7e2b",
"#cf9a2f",
"#827a8b",
"#876a69",
"#495f23",
"#677f45",
"#805845",
"#a2544d",
"#8c5157",
"#6b6c9e",
"#236443",
"#919b82",
"#cc8e55",
"#3e8555",
"#a08a7a",
"#767870",
"#6d9643",
"#87658f",
"#3bb069",
"#6a5d42",
"#586249",
"#1f7769",
"#6daf8e",
"#8fa7be",
"#b7a82c",
"#a09da0",
"#7d8aa6",
"#78a3e0",
"#719186",
"#765771",
"#a37ea7",
"#8e8cbc",
"#a76840",
"#49934b",
"#a27c62",
"#3da27b",
"#a9ac53",
"#6685b4",
"#5f728a",
"#cb6b4a",
"#9f8dd3",
"#b7a66e",
"#a998b3",
"#85a362",
"#595146"
],
"tooltip":{
"trigger":"axis"
}
}
Other comments [其他信息]
Screenshot with Safari:
Screenshot with Firefox:
canvas.context method calls in Safari:
https://jsfiddle.net/f149fbpf/
canvas.context method calls in Firefox:
ECharts versions tested
Does not work in ECharts 3.3.2 Does not work in ECharts 3.4.0
Issue Analytics
- State:
- Created 7 years ago
- Reactions:1
- Comments:5 (1 by maintainers)
Top Results From Across the Web
Line does not render in Safari. · Issue #4980 · apache/echarts
One-line summary [问题简述]. Line does not render in Safari, only axes. Line renders correctly in Chrome and Firefox.
Read more >Safari not rendering javascript or css on… - Apple Community
I've rebooted the iMac into recovery and used Safari there, and the page works, but logged in, it stops rendering the page correctly...
Read more >Safari Browser Does Not Render Div Used as Vertical Line
While this works in Chrome it doesn't render at all in Safari. If you place content into the div it will render the...
Read more >Safari is not rendering correctly line-height [#322545] - Drupal
Safari Version 3.1.2 on Mac OS X Leopard, does not seem to render line-height correctly? Anyone tested with Safari? Firefox and IE7 are...
Read more >The text is rendering in two lines even when there is enough ...
The issue is observed only in safari with few custom fonts(Lato-Regular, Lato-Light, etc.) but not with the default system fonts(Helvetica).
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Hi @beckyconning , thanks for the detailed feedback, i think maybe the problem is in the status management of zrender. We will fix it in the next version.
Hey @pissang. Was this ever fixed? We recently had a similar issue where a line chart doesn’t render the line on Safari (Version 13.0.1) when data points have the same value (ie flat line):
The line renders fine when data points have different values:
We fixed this by setting the
animationoption totrue, but I suppose that there should be no rendering problem with animations disabled. Any update?