[incubator-echarts] 04/05: fix: [graphic component] compat legacy style.
This is an automated email from the ASF dual-hosted git repository.
sushuang pushed a commit to branch next
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git
commit ec5bcf444f0338c3fe9ac8b76701e464b93e2c86
Author: 100pah
AuthorDate: Wed Oct 28 03:10:57 2020 +0800
fix: [graphic component] compat legacy style.
---
src/component/graphic.ts | 19 -
test/graphic-cases.html | 202 +++
2 files changed, 219 insertions(+), 2 deletions(-)
diff --git a/src/component/graphic.ts b/src/component/graphic.ts
index 04beade..909976e 100644
--- a/src/component/graphic.ts
+++ b/src/component/graphic.ts
@@ -36,6 +36,7 @@ import ComponentView from '../view/Component';
import ExtensionAPI from '../ExtensionAPI';
import { getECData } from '../util/innerStore';
import { TextStyleProps } from 'zrender/src/graphic/Text';
+import { isEC4CompatibleStyle, convertFromEC4CompatibleStyle } from
'../util/styleCompat';
const TRANSFORM_PROPS = {
@@ -436,8 +437,9 @@ class GraphicComponentView extends ComponentView {
const parentId = modelUtil.convertOptionIdName(elOption.parentId,
null);
const targetElParent = (parentId != null ? elMap.get(parentId) :
rootGroup) as graphicUtil.Group;
+const elType = elOption.type;
const elOptionStyle = (elOption as
GraphicComponentDisplayableOption).style;
-if (elOption.type === 'text' && elOptionStyle) {
+if (elType === 'text' && elOptionStyle) {
// In top/bottom mode, textVerticalAlign should not be used,
which cause
// inaccurately locating.
if (elOption.hv && elOption.hv[1]) {
@@ -448,7 +450,20 @@ class GraphicComponentView extends ComponentView {
}
}
-const textContentOption = (elOption as
GraphicComponentZRPathOption).textContent;
+let textContentOption = (elOption as
GraphicComponentZRPathOption).textContent;
+let textConfig = (elOption as
GraphicComponentZRPathOption).textConfig;
+if (elOptionStyle
+&& isEC4CompatibleStyle(elOptionStyle, elType, !!textConfig,
!!textContentOption)
+) {
+const convertResult =
convertFromEC4CompatibleStyle(elOptionStyle, elType, true);
+if (!textConfig && convertResult.textConfig) {
+textConfig = (elOption as
GraphicComponentZRPathOption).textConfig = convertResult.textConfig;
+}
+if (!textContentOption && convertResult.textContent) {
+textContentOption = convertResult.textContent;
+}
+}
+
// Remove unnecessary props to avoid potential problems.
const elOptionCleaned = getCleanedElOption(elOption);
diff --git a/test/graphic-cases.html b/test/graphic-cases.html
new file mode 100644
index 000..7b4b1c4
--- /dev/null
+++ b/test/graphic-cases.html
@@ -0,0 +1,202 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+require(['echarts'/*, 'map/js/china' */], function (echarts) {
+var option;
+// $.getJSON('./data/nutrients.json', function (data) {});
+
+
+const imageURI =
'data:image/png;base64,iVBORw0KGgoNSUhEUgAAANwAAADcCAYbWs+BBmJLR0QA/wD/AP+gvaeTCXBIWXMAAAsTAAALEwEAmpwYB3RJTUUH4gIUARQAHY8+4wAAApBJREFUeNrt3cFqAjEUhlEjvv8rXzciiiBGk/He5JxdN2U649dY+KmnEwAv2uMXEeGOwERntwAEB4IDBAeCAwQHggPBAYIDwQGCA8GB4ADBgeAAwYHgAMGB4EBwgOCgpkuKq2it/r8Li2hbvGKqP6s/PycnHHv9YvSWEgQHCA4EBwgOBAeCAwQHggMEByXM+QRUE6D3suwuPafDn5MTDg50KXnVPSdxa54y/oYDwQGCA8EBggPBAYIDwYHggBE+X5rY3Y3Tey97Nn2eU+rnlGfaZa6Ft5SA4EBwgOBAcCA4QHAgOEBwIDjg
[...]
+
+
+option = {
+graphic: [{
+type: 'circle',
+x: 100,
+y: 50,
+shape: {
+cx: 0,
+cy: 0,
+r: 50
+},
+style: {
+fill: 'orange'
+},
+textContent: {
+style: {
+text: 'x: 100, y: 50\nposition: bottom',
+fill: 'blue'
+}
+},
+textConfig: {
+position: 'bottom'
+}
+}, {
+type: 'rect',
+x: 200,
+y: 0,
+scaleX: 10,
+scaleY: 20,
+shape: {
+x: 0,
+y: 0,
+width: 5,
+height: 5
+},
+
[incubator-echarts] 04/05: fix: [graphic component] compat legacy style.
This is an automated email from the ASF dual-hosted git repository.
sushuang pushed a commit to branch next
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git
commit ec5bcf444f0338c3fe9ac8b76701e464b93e2c86
Author: 100pah
AuthorDate: Wed Oct 28 03:10:57 2020 +0800
fix: [graphic component] compat legacy style.
---
src/component/graphic.ts | 19 -
test/graphic-cases.html | 202 +++
2 files changed, 219 insertions(+), 2 deletions(-)
diff --git a/src/component/graphic.ts b/src/component/graphic.ts
index 04beade..909976e 100644
--- a/src/component/graphic.ts
+++ b/src/component/graphic.ts
@@ -36,6 +36,7 @@ import ComponentView from '../view/Component';
import ExtensionAPI from '../ExtensionAPI';
import { getECData } from '../util/innerStore';
import { TextStyleProps } from 'zrender/src/graphic/Text';
+import { isEC4CompatibleStyle, convertFromEC4CompatibleStyle } from
'../util/styleCompat';
const TRANSFORM_PROPS = {
@@ -436,8 +437,9 @@ class GraphicComponentView extends ComponentView {
const parentId = modelUtil.convertOptionIdName(elOption.parentId,
null);
const targetElParent = (parentId != null ? elMap.get(parentId) :
rootGroup) as graphicUtil.Group;
+const elType = elOption.type;
const elOptionStyle = (elOption as
GraphicComponentDisplayableOption).style;
-if (elOption.type === 'text' && elOptionStyle) {
+if (elType === 'text' && elOptionStyle) {
// In top/bottom mode, textVerticalAlign should not be used,
which cause
// inaccurately locating.
if (elOption.hv && elOption.hv[1]) {
@@ -448,7 +450,20 @@ class GraphicComponentView extends ComponentView {
}
}
-const textContentOption = (elOption as
GraphicComponentZRPathOption).textContent;
+let textContentOption = (elOption as
GraphicComponentZRPathOption).textContent;
+let textConfig = (elOption as
GraphicComponentZRPathOption).textConfig;
+if (elOptionStyle
+&& isEC4CompatibleStyle(elOptionStyle, elType, !!textConfig,
!!textContentOption)
+) {
+const convertResult =
convertFromEC4CompatibleStyle(elOptionStyle, elType, true);
+if (!textConfig && convertResult.textConfig) {
+textConfig = (elOption as
GraphicComponentZRPathOption).textConfig = convertResult.textConfig;
+}
+if (!textContentOption && convertResult.textContent) {
+textContentOption = convertResult.textContent;
+}
+}
+
// Remove unnecessary props to avoid potential problems.
const elOptionCleaned = getCleanedElOption(elOption);
diff --git a/test/graphic-cases.html b/test/graphic-cases.html
new file mode 100644
index 000..7b4b1c4
--- /dev/null
+++ b/test/graphic-cases.html
@@ -0,0 +1,202 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+require(['echarts'/*, 'map/js/china' */], function (echarts) {
+var option;
+// $.getJSON('./data/nutrients.json', function (data) {});
+
+
+const imageURI =
'data:image/png;base64,iVBORw0KGgoNSUhEUgAAANwAAADcCAYbWs+BBmJLR0QA/wD/AP+gvaeTCXBIWXMAAAsTAAALEwEAmpwYB3RJTUUH4gIUARQAHY8+4wAAApBJREFUeNrt3cFqAjEUhlEjvv8rXzciiiBGk/He5JxdN2U649dY+KmnEwAv2uMXEeGOwERntwAEB4IDBAeCAwQHggPBAYIDwQGCA8GB4ADBgeAAwYHgAMGB4EBwgOCgpkuKq2it/r8Li2hbvGKqP6s/PycnHHv9YvSWEgQHCA4EBwgOBAeCAwQHggMEByXM+QRUE6D3suwuPafDn5MTDg50KXnVPSdxa54y/oYDwQGCA8EBggPBAYIDwYHggBE+X5rY3Y3Tey97Nn2eU+rnlGfaZa6Ft5SA4EBwgOBAcCA4QHAgOEBwIDjg
[...]
+
+
+option = {
+graphic: [{
+type: 'circle',
+x: 100,
+y: 50,
+shape: {
+cx: 0,
+cy: 0,
+r: 50
+},
+style: {
+fill: 'orange'
+},
+textContent: {
+style: {
+text: 'x: 100, y: 50\nposition: bottom',
+fill: 'blue'
+}
+},
+textConfig: {
+position: 'bottom'
+}
+}, {
+type: 'rect',
+x: 200,
+y: 0,
+scaleX: 10,
+scaleY: 20,
+shape: {
+x: 0,
+y: 0,
+width: 5,
+height: 5
+},
+
