You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by su...@apache.org on 2019/10/31 16:41:56 UTC
[incubator-echarts] branch fix/ios13-z-bug created (now 5013605)
This is an automated email from the ASF dual-hosted git repository.
sushuang pushed a change to branch fix/ios13-z-bug
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git.
at 5013605 fix: add test case for ios13 z order bug. The bug is fixed in: https://github.com/ecomfe/zrender/pull/522 IOS13 safari probably has a compositing bug (z order of the canvas and the consequent dom does not act as expected) when some of the parent dom has `-webkit-overflow-scrolling: touch;` and the webpage is longer than one screen and the canvas is not at the top part of the page. Check `https://bugs.webkit.org/show_bug.cgi?id=203681` for more details.
This branch includes the following new commits:
new 5013605 fix: add test case for ios13 z order bug. The bug is fixed in: https://github.com/ecomfe/zrender/pull/522 IOS13 safari probably has a compositing bug (z order of the canvas and the consequent dom does not act as expected) when some of the parent dom has `-webkit-overflow-scrolling: touch;` and the webpage is longer than one screen and the canvas is not at the top part of the page. Check `https://bugs.webkit.org/show_bug.cgi?id=203681` for more details.
The 1 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails. The revisions
listed as "add" were already present in the repository and have only
been added to this reference.
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[incubator-echarts] 01/01: fix: add test case for ios13 z order
bug. The bug is fixed in: https://github.com/ecomfe/zrender/pull/522 IOS13
safari probably has a compositing bug (z order of the canvas and the
consequent dom does not act as expected) when some of the parent dom has
`-webkit-overflow-scrolling: touch;
` and the webpage is longer than one screen and the canvas is not at the top
part of the page. Check `https://bugs.webkit.org/show_bug.cgi?id=203681`
for more details.
Posted by su...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
sushuang pushed a commit to branch fix/ios13-z-bug
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git
commit 5013605b2feae4f932327666552d17c36f217dec
Author: SHUANG SU <su...@gmail.com>
AuthorDate: Fri Nov 1 00:41:19 2019 +0800
fix: add test case for ios13 z order bug.
The bug is fixed in: https://github.com/ecomfe/zrender/pull/522
IOS13 safari probably has a compositing bug (z order of the canvas and the consequent
dom does not act as expected) when some of the parent dom has
`-webkit-overflow-scrolling: touch;` and the webpage is longer than one screen and
the canvas is not at the top part of the page.
Check `https://bugs.webkit.org/show_bug.cgi?id=203681` for more details.
---
test/-cases.js | 1 +
test/ios13-z-bug.html | 353 ++++++++++++++++++++++++++++++++++++++++++++++++++
2 files changed, 354 insertions(+)
diff --git a/test/-cases.js b/test/-cases.js
index c36293f..676b67f 100644
--- a/test/-cases.js
+++ b/test/-cases.js
@@ -33,6 +33,7 @@
'touch-test.html',
'touch-candlestick.html',
'tooltip-touch.html',
+ 'ios13-z-bug.html',
'bar.html',
'line.html',
'geoLine.html',
diff --git a/test/ios13-z-bug.html b/test/ios13-z-bug.html
new file mode 100644
index 0000000..358ea04
--- /dev/null
+++ b/test/ios13-z-bug.html
@@ -0,0 +1,353 @@
+<!DOCTYPE html>
+<!--
+Licensed to the Apache Software Foundation (ASF) under one
+or more contributor license agreements. See the NOTICE file
+distributed with this work for additional information
+regarding copyright ownership. The ASF licenses this file
+to you under the Apache License, Version 2.0 (the
+"License"); you may not use this file except in compliance
+with the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing,
+software distributed under the License is distributed on an
+"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+KIND, either express or implied. See the License for the
+specific language governing permissions and limitations
+under the License.
+-->
+<html lang="en">
+<head>
+ <meta charset="utf-8">
+ <title>css</title>
+ <meta http-equiv="X-UA-Compatible" content="IE=Edge">
+ <meta name="viewport" content="width=device-width,minimum-scale=1,maximum-scale=1,user-scalable=no">
+
+ <style>
+ #main {
+ position: absolute;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ overflow-y: scroll;
+ -webkit-overflow-scrolling: touch;
+ }
+ </style>
+</head>
+<body>
+
+ <div id="app" >
+ <div id="main">
+
+ <div>
+ Check that the tooltip should not below the chart on the<br>
+ <strong>Safari of IOS13</strong>.<br>
+ (See <a href="https://bugs.webkit.org/show_bug.cgi?id=203681" target="_blank">Webkit Bug Trace</a>)<br>
+ The bug can be reproduced by:<br>
+ (1) `-webkit-overflow-scrolling: touch;` is used<br>
+ (2) The webpage is over one screen<br>
+ (3) The chart (or only canvas) is not at the top part.<br>
+ </div>
+
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+
+
+ <div data-v-2d2d8774="" data-v-224ed8cc="" class="app-details c-bg-color-gray">
+ <div data-v-2d2d8774="">
+ <div data-v-75831cfc="" data-v-2d2d8774="" class="trend c-bg-color-white c-gap-inner-left c-gap-inner-right c-gap-inner-bottom">
+ <div data-v-75831cfc="" class="ve-line" style="
+ width: auto;
+ position: relative;
+ height: 247.5px;
+ ">
+ <div class="" id="aaa" style="height: 247.5px;">
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <!--
+ <div class="" _echarts_instance_="ec_1234567" style="
+ width: auto;
+ position: relative;
+ -webkit-tap-highlight-color: transparent;
+ user-select: none;
+ height: 247.5px;
+ ">
+ <div style="
+ position: relative;
+ /* overflow: hidden; */
+ width: 355px;
+ height: 248px;
+ padding: 0px;
+ margin: 0px;
+ border-width: 0px;
+ cursor: default;
+ ">
+ <canvas id="bbb" data-zr-dom-id="zr_0" width="1065" height="744" style="
+ position: absolute;
+ /* position: static; */
+ left: 0px;
+ top: 0px;
+ width: 355px;
+ height: 248px;
+ user-select: none;
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+ padding: 0px;
+ margin: 0px;
+ border-width: 0px;
+ "></canvas>
+ <div style="position: absolute !important; visibility: hidden !important; padding: 0px !important; margin: 0px !important; border-width: 0px !important; width: 0px !important; height: 0px !important; left: 0px !important; top: 0px !important; right: auto !important; bottom: auto !important;"></div>
+ <div style="position: absolute !important; visibility: hidden !important; padding: 0px !important; margin: 0px !important; border-width: 0px !important; width: 0px !important; height: 0px !important; right: 0px !important; top: 0px !important; left: auto !important; bottom: auto !important;"></div>
+ <div style="position: absolute !important; visibility: hidden !important; padding: 0px !important; margin: 0px !important; border-width: 0px !important; width: 0px !important; height: 0px !important; left: 0px !important; bottom: 0px !important; right: auto !important; top: auto !important;"></div>
+ <div style="position: absolute !important; visibility: hidden !important; padding: 0px !important; margin: 0px !important; border-width: 0px !important; width: 0px !important; height: 0px !important; right: 0px !important; bottom: 0px !important; left: auto !important; top: auto !important;"></div>
+ </div>
+ <div style="
+ position: absolute;
+ display: block;
+ border-style: solid; white-space: nowrap;
+ transition: left 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s, top 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s;
+ background-color: rgba(50, 50, 50, 0.7);
+ border-width: 0px;
+ border-color: rgb(51, 51, 51);
+ border-radius: 4px;
+ color: rgb(255, 255, 255);
+ font: 14px/21px sans-serif;
+ padding: 5px; left: 82.925px;
+ top: 27.7102px;
+ z-index: 99999;
+ pointer-events: none;
+ ">2019/09/18 星期三 <br> DAU (日) : 123.6<br>日环比：-9.9%<br>年同比：-6.6%</div>
+ </div> -->
+
+
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+ aaa<br>
+
+ </div>
+ </div>
+
+
+ <script src="../dist/echarts.js?_v_=123"></script>
+
+ <script>
+ var option = {
+ "legend": {
+ "left": "right",
+ "top": "2%"
+ },
+ "xAxis": [{
+ "type": "category",
+ "nameLocation": "middle",
+ "nameGap": 22,
+ "name": "",
+ "axisTick": {
+ "show": true,
+ "lineStyle": {
+ "color": "#eee"
+ }
+ },
+ "show": true,
+ "splitNumber": 30,
+ "axisLabel": {
+ "interval": "auto"
+ }
+ }],
+ "series": [{
+ "type": "line",
+ "data": [
+ ["2016/10/000000", "15.00"],
+ ["2016/10/000000", "15.00"],
+ ["2016/10/000000", "15.00"],
+ ["2016/10/000000", "15.00"],
+ ["2016/11/000000", "15.00"],
+ ["2016/11/000000", "15.00"],
+ ["2016/11/000000", "15.00"],
+ ["2016/11/000000", "15.00"],
+ ["2016/12/000000", "15.00"],
+ ["2016/12/000000", "15.00"],
+ ["2016/12/000000", "15.00"],
+ ["2016/12/000000", "15.00"],
+ ["2017/01/000000", "15.00"],
+ ["2017/01/000000", "15.00"],
+ ["2017/01/000000", "15.00"],
+ ["2017/01/000000", "15.00"],
+ ["2017/01/000000", "15.00"],
+ ["2017/02/000000", "15.00"],
+ ["2017/02/000000", "15.00"],
+ ["2017/02/000000", "15.00"],
+ ["2017/02/000000", "15.00"],
+ ["2017/03/000000", "15.00"],
+ ["2017/03/000000", "15.00"],
+ ["2017/03/000000", "15.00"],
+ ["2017/03/000000", "15.00"],
+ ["2017/04/000000", "15.00"],
+ ["2017/04/000000", "15.00"],
+ ["2017/04/000000", "15.00"],
+ ["2017/04/000000", "15.00"],
+ ["2017/05/000000", "15.00"],
+ ["2017/05/000000", "15.00"],
+ ["2017/05/000000", "15.00"],
+ ["2017/05/000000", "15.00"],
+ ["2017/05/000000", "15.00"],
+ ["2017/06/000000", "15.00"],
+ ["2017/06/000000", "15.00"],
+ ["2018/02/000000", "15.00"],
+ ["2018/02/000000", "15.00"],
+ ["2018/02/000000", "15.00"],
+ ["2018/02/000000", "15.00"],
+ ["2018/03/000000", "15.00"],
+ ["2018/03/000000", "15.00"],
+ ["2018/03/000000", "15.00"],
+ ["2018/03/000000", "15.00"],
+ ["2018/04/000000", "15.00"],
+ ["2018/04/000000", "15.00"],
+ ["2018/04/000000", "15.00"],
+ ["2018/04/000000", "15.00"],
+ ["2018/04/000000", "15.00"],
+ ["2018/05/000000", "15.00"],
+ ["2018/05/000000", "15.00"],
+ ["2018/05/000000", "15.00"],
+ ["2018/05/000000", "15.00"],
+ ["2018/06/000000", "15.00"],
+ ["2018/06/000000", "15.00"],
+ ["2018/06/000000", "15.00"],
+ ["2018/06/000000", "15.00"],
+ ["2018/07/000000", "15.00"],
+ ["2018/07/000000", "15.00"],
+ ["2018/07/000000", "15.00"],
+ ["2018/07/000000", "15.00"],
+ ["2018/07/000000", "15.00"],
+ ["2018/08/000000", "15.00"],
+ ["2018/08/000000", "15.00"],
+ ["2018/08/000000", "15.00"],
+ ["2018/08/000000", "15.00"],
+ ["2018/09/000000", "15.00"],
+ ["2018/09/000000", "15.00"],
+ ["2018/09/000000", "15.00"],
+ ["2018/09/000000", "15.00"],
+ ["2018/10/000000", "15.00"],
+ ["2018/10/000000", "15.00"],
+ ["2018/10/000000", "15.00"],
+ ["2018/10/000000", "15.00"],
+ ["2018/10/000000", "15.00"],
+ ["2018/11/000000", "15.00"],
+ ["2018/11/000000", "2.00"],
+ ["2018/11/000000", "2.00"],
+ ["2018/11/000000", "2.00"],
+ ["2018/12/000000", "2.00"],
+ ["2018/12/000000", "2.00"],
+ ["2018/12/000000", "7.00"],
+ ["2018/12/000000", "7.00"],
+ ["2018/12/000000", "7.00"],
+ ["2019/01/000000", "7.00"],
+ ["2019/01/000000", "7.00"],
+ ["2019/01/000000", "2.00"],
+ ["2019/01/000000", "2.00"],
+ ["2019/02/000000", "2.00"],
+ ["2019/02/000000", "2.00"],
+ ["2019/02/000000", "2.00"],
+ ["2019/02/000000", "3.00"],
+ ["2019/03/000000", "12.00"],
+ ["2019/03/000000", "12.00"],
+ ["2019/03/000000", "12.00"],
+ ["2019/03/000000", "12.00"],
+ ["2019/04/000000", "12.00"],
+ ["2019/04/000000", "12.00"],
+ ["2019/04/000000", "12.00"],
+ ["2019/04/000000", "12.00"],
+ ["2019/04/000000", "12.00"],
+ ["2019/05/000000", "12.00"],
+ ["2019/05/000000", "3.00"],
+ ["2019/05/000000", "3.00"],
+ ["2019/05/000000", "2.00"],
+ ["2019/06/000000", "2.00"],
+ ["2019/06/000000", "62.00"],
+ ["2019/06/000000", "62.00"],
+ ["2019/06/000000", "62.00"],
+ ["2019/07/000000", "62.00"],
+ ["2019/07/000000", "63.00"],
+ ["2019/07/000000", "63.00"],
+ ["2019/07/000000", "63.00"],
+ ["2019/07/000000", "63.00"],
+ ["2019/08/000000", "63.00"],
+ ["2019/08/000000", "62.00"],
+ ["2019/08/000000", "63.00"],
+ ["2019/08/000000", "63.00"],
+ ["2019/09/000000", "63.00"],
+ ["2019/09/000000", "63.00"],
+ ["2019/09/000000", "3.00"],
+ ["2019/09/000000", "2.00"],
+ ["2019/09/000000", "2.00"],
+ ["2019/10/000000", "2.00"],
+ ["2019/10/000000", "3.00"]
+ ],
+ "showSymbol": false
+ }],
+ "yAxis": {
+ "scale": true,
+ "axisLabel": {
+ "margin": -10,
+ "verticalAlign": "bottom"
+ },
+ "axisTick": {
+ "show": false
+ },
+ "offset": -5
+ },
+ "tooltip": {
+ "trigger": "axis"
+ },
+ "color": ["#549ef4"],
+ "grid": [{
+ "x": "2%",
+ "y": "20%",
+ "width": "96%",
+ "height": "78%"
+ }],
+ "dataZoom": [{
+ "type": "inside",
+ "start": 80,
+ "end": 100
+ }]
+ };
+
+ var chart = echarts.init(document.getElementById('aaa'));
+ chart.setOption(option);
+
+ </script>
+
+
+</body>
+</html>
+
+
+
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org