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/06/05 10:27:50 UTC

[GitHub] [incubator-echarts] plainheart opened a new pull request #12758: fix(axisPointer): some properties of label in axisPointer are not working, fix #12642.

plainheart opened a new pull request #12758:
URL: https://github.com/apache/incubator-echarts/pull/12758


   <!-- Please fill in the following information to help us review your PR more efficiently. -->
   
   ## Brief Information
   
   This pull request is in the type of:
   
   - [x] bug fixing
   - [x] new feature
   - [ ] others
   
   
   
   ### What does this PR do?
   
   - fixes #12642, tweaks #12673  (`lineHeight` does not work)
   - added more supported properties of label (`opacity`, `rotate`, `borderRadius`).
   - added support for rich label.
   - fixes the bug that `{value}` in `formatter` not be replaced entirely.
   - fixes the bug that `formatter` in `axisPointer.label` will affect `formatter` in `tooltip`.
   
   ### Fixed issues
   
   - #12642 
   
   ## Details
   
   ### Before: What was the problem?
   
   - Some properties are invalid, such as `width`, `height`, `textShadowColor`, `textBorderColor`, `textBorderWidth`.
   - Rich label is not supported yet.
   
   ### After: How is it fixed in this PR?
   
   ![image](https://user-images.githubusercontent.com/26999792/83865585-f81f8f80-a758-11ea-83e4-11024444af61.png)
   
   
   
   ## Usage
   
   ### Are there any API changes?
   
   - [x] The API has been changed.
   
   Added `opacity`, `rotate`, `borderRadius`, `rich` properties
   
   
   ### Related test cases or examples to use the new APIs
   
   Please refer to `test/tooltip-axisPointer2.html`.
   
   
   ## Others
   
   ### Merging options
   
   - [x] Please squash the commits into a single one when merge.
   
   ### Other information
   
   A known issue is that it's invalid to set `width` or `height` to a percent string in `rich`.


----------------------------------------------------------------
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] chfw commented on a change in pull request #12758: fix(axisPointer): some properties of label in axisPointer are not working, fix #12642.

Posted by GitBox <gi...@apache.org>.
chfw commented on a change in pull request #12758:
URL: https://github.com/apache/incubator-echarts/pull/12758#discussion_r444728956



##########
File path: src/component/axisPointer/viewHelper.js
##########
@@ -60,62 +59,41 @@ export function buildLabelElOption(
     );
     var labelModel = axisPointerModel.getModel('label');
     var paddings = formatUtil.normalizeCssArray(labelModel.get('padding') || 0);
-
-    var font = labelModel.getFont();
-    var textRect = textContain.getBoundingRect(text, font);
-
     var position = labelPos.position;
-    var width = textRect.width + paddings[1] + paddings[3];
-    var height = textRect.height + paddings[0] + paddings[2];
-
-    // Adjust by align.
-    var align = labelPos.align;
-    align === 'right' && (position[0] -= width);
-    align === 'center' && (position[0] -= width / 2);
-    var verticalAlign = labelPos.verticalAlign;
-    verticalAlign === 'bottom' && (position[1] -= height);
-    verticalAlign === 'middle' && (position[1] -= height / 2);
-
-    // Not overflow ec container
-    confineInContainer(position, width, height, api);
+    var font = labelModel.getFont();
 
     var bgColor = labelModel.get('backgroundColor');
     if (!bgColor || bgColor === 'auto') {
         bgColor = axisModel.get('axisLine.lineStyle.color');
     }
 
     elOption.label = {
-        shape: {x: 0, y: 0, width: width, height: height, r: labelModel.get('borderRadius')},
+        shape: {},
         position: position.slice(),
-        // TODO: rich
-        style: {
-            text: text,
+        style: graphic.setTextStyle({}, labelModel, {
+            text: labelModel.get('show') ? text : null,
+            textBackgroundColor: bgColor,
             textFont: font,
-            textFill: labelModel.getTextColor(),
             textPosition: 'inside',
             textPadding: paddings,
-            fill: bgColor,
-            stroke: labelModel.get('borderColor') || 'transparent',
-            lineWidth: labelModel.get('borderWidth') || 0,
-            shadowBlur: labelModel.get('shadowBlur'),
-            shadowColor: labelModel.get('shadowColor'),
-            shadowOffsetX: labelModel.get('shadowOffsetX'),
-            shadowOffsetY: labelModel.get('shadowOffsetY')
-        },
+            textFill: labelModel.getTextColor(),
+            rotation: labelModel.get('rotate'),
+            opacity: labelModel.get('opacity')
+        }, {isRectText: true}),
         // Lable should be over axisPointer.
         z2: 10
     };
 }
 
 // Do not overflow ec container
-function confineInContainer(position, width, height, api) {
-    var viewWidth = api.getWidth();
-    var viewHeight = api.getHeight();
-    position[0] = Math.min(position[0] + width, viewWidth) - width;
-    position[1] = Math.min(position[1] + height, viewHeight) - height;
-    position[0] = Math.max(position[0], 0);
-    position[1] = Math.max(position[1], 0);
-}
+// function confineInContainer(position, width, height, api) {
+//     var viewWidth = api.getWidth();
+//     var viewHeight = api.getHeight();
+//     position[0] = Math.min(position[0] + width, viewWidth) - width;
+//     position[1] = Math.min(position[1] + height, viewHeight) - height;
+//     position[0] = Math.max(position[0], 0);
+//     position[1] = Math.max(position[1], 0);
+// }

Review comment:
       If you have the doubt, next developer will have the same. Please choose : delete or uncomment.




----------------------------------------------------------------
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] chfw commented on a change in pull request #12758: fix(axisPointer): some properties of label in axisPointer are not working, fix #12642.

Posted by GitBox <gi...@apache.org>.
chfw commented on a change in pull request #12758:
URL: https://github.com/apache/incubator-echarts/pull/12758#discussion_r444531215



##########
File path: src/component/axisPointer/viewHelper.js
##########
@@ -60,62 +59,41 @@ export function buildLabelElOption(
     );
     var labelModel = axisPointerModel.getModel('label');
     var paddings = formatUtil.normalizeCssArray(labelModel.get('padding') || 0);
-
-    var font = labelModel.getFont();
-    var textRect = textContain.getBoundingRect(text, font);
-
     var position = labelPos.position;
-    var width = textRect.width + paddings[1] + paddings[3];
-    var height = textRect.height + paddings[0] + paddings[2];
-
-    // Adjust by align.
-    var align = labelPos.align;
-    align === 'right' && (position[0] -= width);
-    align === 'center' && (position[0] -= width / 2);
-    var verticalAlign = labelPos.verticalAlign;
-    verticalAlign === 'bottom' && (position[1] -= height);
-    verticalAlign === 'middle' && (position[1] -= height / 2);
-
-    // Not overflow ec container
-    confineInContainer(position, width, height, api);
+    var font = labelModel.getFont();
 
     var bgColor = labelModel.get('backgroundColor');
     if (!bgColor || bgColor === 'auto') {
         bgColor = axisModel.get('axisLine.lineStyle.color');
     }
 
     elOption.label = {
-        shape: {x: 0, y: 0, width: width, height: height, r: labelModel.get('borderRadius')},
+        shape: {},
         position: position.slice(),
-        // TODO: rich
-        style: {
-            text: text,
+        style: graphic.setTextStyle({}, labelModel, {
+            text: labelModel.get('show') ? text : null,
+            textBackgroundColor: bgColor,
             textFont: font,
-            textFill: labelModel.getTextColor(),
             textPosition: 'inside',
             textPadding: paddings,
-            fill: bgColor,
-            stroke: labelModel.get('borderColor') || 'transparent',
-            lineWidth: labelModel.get('borderWidth') || 0,
-            shadowBlur: labelModel.get('shadowBlur'),
-            shadowColor: labelModel.get('shadowColor'),
-            shadowOffsetX: labelModel.get('shadowOffsetX'),
-            shadowOffsetY: labelModel.get('shadowOffsetY')
-        },
+            textFill: labelModel.getTextColor(),
+            rotation: labelModel.get('rotate'),
+            opacity: labelModel.get('opacity')
+        }, {isRectText: true}),
         // Lable should be over axisPointer.
         z2: 10
     };
 }
 
 // Do not overflow ec container
-function confineInContainer(position, width, height, api) {
-    var viewWidth = api.getWidth();
-    var viewHeight = api.getHeight();
-    position[0] = Math.min(position[0] + width, viewWidth) - width;
-    position[1] = Math.min(position[1] + height, viewHeight) - height;
-    position[0] = Math.max(position[0], 0);
-    position[1] = Math.max(position[1], 0);
-}
+// function confineInContainer(position, width, height, api) {
+//     var viewWidth = api.getWidth();
+//     var viewHeight = api.getHeight();
+//     position[0] = Math.min(position[0] + width, viewWidth) - width;
+//     position[1] = Math.min(position[1] + height, viewHeight) - height;
+//     position[0] = Math.max(position[0], 0);
+//     position[1] = Math.max(position[1], 0);
+// }

Review comment:
       Personally, I would delete dead code. That's why we use git for keep dead codes.




----------------------------------------------------------------
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] plainheart commented on pull request #12758: fix(axisPointer): some properties of label in axisPointer are not working, fix #12642.

Posted by GitBox <gi...@apache.org>.
plainheart commented on pull request #12758:
URL: https://github.com/apache/incubator-echarts/pull/12758#issuecomment-668387902


   Do it in 5.0.


----------------------------------------------------------------
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] plainheart commented on a change in pull request #12758: fix(axisPointer): some properties of label in axisPointer are not working, fix #12642.

Posted by GitBox <gi...@apache.org>.
plainheart commented on a change in pull request #12758:
URL: https://github.com/apache/incubator-echarts/pull/12758#discussion_r444578576



##########
File path: src/component/axisPointer/viewHelper.js
##########
@@ -60,62 +59,41 @@ export function buildLabelElOption(
     );
     var labelModel = axisPointerModel.getModel('label');
     var paddings = formatUtil.normalizeCssArray(labelModel.get('padding') || 0);
-
-    var font = labelModel.getFont();
-    var textRect = textContain.getBoundingRect(text, font);
-
     var position = labelPos.position;
-    var width = textRect.width + paddings[1] + paddings[3];
-    var height = textRect.height + paddings[0] + paddings[2];
-
-    // Adjust by align.
-    var align = labelPos.align;
-    align === 'right' && (position[0] -= width);
-    align === 'center' && (position[0] -= width / 2);
-    var verticalAlign = labelPos.verticalAlign;
-    verticalAlign === 'bottom' && (position[1] -= height);
-    verticalAlign === 'middle' && (position[1] -= height / 2);
-
-    // Not overflow ec container
-    confineInContainer(position, width, height, api);
+    var font = labelModel.getFont();
 
     var bgColor = labelModel.get('backgroundColor');
     if (!bgColor || bgColor === 'auto') {
         bgColor = axisModel.get('axisLine.lineStyle.color');
     }
 
     elOption.label = {
-        shape: {x: 0, y: 0, width: width, height: height, r: labelModel.get('borderRadius')},
+        shape: {},
         position: position.slice(),
-        // TODO: rich
-        style: {
-            text: text,
+        style: graphic.setTextStyle({}, labelModel, {
+            text: labelModel.get('show') ? text : null,
+            textBackgroundColor: bgColor,
             textFont: font,
-            textFill: labelModel.getTextColor(),
             textPosition: 'inside',
             textPadding: paddings,
-            fill: bgColor,
-            stroke: labelModel.get('borderColor') || 'transparent',
-            lineWidth: labelModel.get('borderWidth') || 0,
-            shadowBlur: labelModel.get('shadowBlur'),
-            shadowColor: labelModel.get('shadowColor'),
-            shadowOffsetX: labelModel.get('shadowOffsetX'),
-            shadowOffsetY: labelModel.get('shadowOffsetY')
-        },
+            textFill: labelModel.getTextColor(),
+            rotation: labelModel.get('rotate'),
+            opacity: labelModel.get('opacity')
+        }, {isRectText: true}),
         // Lable should be over axisPointer.
         z2: 10
     };
 }
 
 // Do not overflow ec container
-function confineInContainer(position, width, height, api) {
-    var viewWidth = api.getWidth();
-    var viewHeight = api.getHeight();
-    position[0] = Math.min(position[0] + width, viewWidth) - width;
-    position[1] = Math.min(position[1] + height, viewHeight) - height;
-    position[0] = Math.max(position[0], 0);
-    position[1] = Math.max(position[1], 0);
-}
+// function confineInContainer(position, width, height, api) {
+//     var viewWidth = api.getWidth();
+//     var viewHeight = api.getHeight();
+//     position[0] = Math.min(position[0] + width, viewWidth) - width;
+//     position[1] = Math.min(position[1] + height, viewHeight) - height;
+//     position[0] = Math.max(position[0], 0);
+//     position[1] = Math.max(position[1], 0);
+// }

Review comment:
       Thank you for pointing out. I'm still not sure if this confining logic should be reserved, so keep this function here. :D




----------------------------------------------------------------
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] plainheart commented on a change in pull request #12758: fix(axisPointer): some properties of label in axisPointer are not working, fix #12642.

Posted by GitBox <gi...@apache.org>.
plainheart commented on a change in pull request #12758:
URL: https://github.com/apache/incubator-echarts/pull/12758#discussion_r444742872



##########
File path: src/component/axisPointer/viewHelper.js
##########
@@ -60,62 +59,41 @@ export function buildLabelElOption(
     );
     var labelModel = axisPointerModel.getModel('label');
     var paddings = formatUtil.normalizeCssArray(labelModel.get('padding') || 0);
-
-    var font = labelModel.getFont();
-    var textRect = textContain.getBoundingRect(text, font);
-
     var position = labelPos.position;
-    var width = textRect.width + paddings[1] + paddings[3];
-    var height = textRect.height + paddings[0] + paddings[2];
-
-    // Adjust by align.
-    var align = labelPos.align;
-    align === 'right' && (position[0] -= width);
-    align === 'center' && (position[0] -= width / 2);
-    var verticalAlign = labelPos.verticalAlign;
-    verticalAlign === 'bottom' && (position[1] -= height);
-    verticalAlign === 'middle' && (position[1] -= height / 2);
-
-    // Not overflow ec container
-    confineInContainer(position, width, height, api);
+    var font = labelModel.getFont();
 
     var bgColor = labelModel.get('backgroundColor');
     if (!bgColor || bgColor === 'auto') {
         bgColor = axisModel.get('axisLine.lineStyle.color');
     }
 
     elOption.label = {
-        shape: {x: 0, y: 0, width: width, height: height, r: labelModel.get('borderRadius')},
+        shape: {},
         position: position.slice(),
-        // TODO: rich
-        style: {
-            text: text,
+        style: graphic.setTextStyle({}, labelModel, {
+            text: labelModel.get('show') ? text : null,
+            textBackgroundColor: bgColor,
             textFont: font,
-            textFill: labelModel.getTextColor(),
             textPosition: 'inside',
             textPadding: paddings,
-            fill: bgColor,
-            stroke: labelModel.get('borderColor') || 'transparent',
-            lineWidth: labelModel.get('borderWidth') || 0,
-            shadowBlur: labelModel.get('shadowBlur'),
-            shadowColor: labelModel.get('shadowColor'),
-            shadowOffsetX: labelModel.get('shadowOffsetX'),
-            shadowOffsetY: labelModel.get('shadowOffsetY')
-        },
+            textFill: labelModel.getTextColor(),
+            rotation: labelModel.get('rotate'),
+            opacity: labelModel.get('opacity')
+        }, {isRectText: true}),
         // Lable should be over axisPointer.
         z2: 10
     };
 }
 
 // Do not overflow ec container
-function confineInContainer(position, width, height, api) {
-    var viewWidth = api.getWidth();
-    var viewHeight = api.getHeight();
-    position[0] = Math.min(position[0] + width, viewWidth) - width;
-    position[1] = Math.min(position[1] + height, viewHeight) - height;
-    position[0] = Math.max(position[0], 0);
-    position[1] = Math.max(position[1], 0);
-}
+// function confineInContainer(position, width, height, api) {
+//     var viewWidth = api.getWidth();
+//     var viewHeight = api.getHeight();
+//     position[0] = Math.min(position[0] + width, viewWidth) - width;
+//     position[1] = Math.min(position[1] + height, viewHeight) - height;
+//     position[0] = Math.max(position[0], 0);
+//     position[1] = Math.max(position[1], 0);
+// }

Review comment:
       Thanks for suggestion. I have doubt since this is just an attempt to fix the issue, which was mentioned in #12642.
   These commented temporarily codes will be removed or uncommented after being improved according to CRs of contributors and committers.




----------------------------------------------------------------
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] plainheart commented on a change in pull request #12758: fix(axisPointer): some properties of label in axisPointer are not working, fix #12642.

Posted by GitBox <gi...@apache.org>.
plainheart commented on a change in pull request #12758:
URL: https://github.com/apache/incubator-echarts/pull/12758#discussion_r444742872



##########
File path: src/component/axisPointer/viewHelper.js
##########
@@ -60,62 +59,41 @@ export function buildLabelElOption(
     );
     var labelModel = axisPointerModel.getModel('label');
     var paddings = formatUtil.normalizeCssArray(labelModel.get('padding') || 0);
-
-    var font = labelModel.getFont();
-    var textRect = textContain.getBoundingRect(text, font);
-
     var position = labelPos.position;
-    var width = textRect.width + paddings[1] + paddings[3];
-    var height = textRect.height + paddings[0] + paddings[2];
-
-    // Adjust by align.
-    var align = labelPos.align;
-    align === 'right' && (position[0] -= width);
-    align === 'center' && (position[0] -= width / 2);
-    var verticalAlign = labelPos.verticalAlign;
-    verticalAlign === 'bottom' && (position[1] -= height);
-    verticalAlign === 'middle' && (position[1] -= height / 2);
-
-    // Not overflow ec container
-    confineInContainer(position, width, height, api);
+    var font = labelModel.getFont();
 
     var bgColor = labelModel.get('backgroundColor');
     if (!bgColor || bgColor === 'auto') {
         bgColor = axisModel.get('axisLine.lineStyle.color');
     }
 
     elOption.label = {
-        shape: {x: 0, y: 0, width: width, height: height, r: labelModel.get('borderRadius')},
+        shape: {},
         position: position.slice(),
-        // TODO: rich
-        style: {
-            text: text,
+        style: graphic.setTextStyle({}, labelModel, {
+            text: labelModel.get('show') ? text : null,
+            textBackgroundColor: bgColor,
             textFont: font,
-            textFill: labelModel.getTextColor(),
             textPosition: 'inside',
             textPadding: paddings,
-            fill: bgColor,
-            stroke: labelModel.get('borderColor') || 'transparent',
-            lineWidth: labelModel.get('borderWidth') || 0,
-            shadowBlur: labelModel.get('shadowBlur'),
-            shadowColor: labelModel.get('shadowColor'),
-            shadowOffsetX: labelModel.get('shadowOffsetX'),
-            shadowOffsetY: labelModel.get('shadowOffsetY')
-        },
+            textFill: labelModel.getTextColor(),
+            rotation: labelModel.get('rotate'),
+            opacity: labelModel.get('opacity')
+        }, {isRectText: true}),
         // Lable should be over axisPointer.
         z2: 10
     };
 }
 
 // Do not overflow ec container
-function confineInContainer(position, width, height, api) {
-    var viewWidth = api.getWidth();
-    var viewHeight = api.getHeight();
-    position[0] = Math.min(position[0] + width, viewWidth) - width;
-    position[1] = Math.min(position[1] + height, viewHeight) - height;
-    position[0] = Math.max(position[0], 0);
-    position[1] = Math.max(position[1], 0);
-}
+// function confineInContainer(position, width, height, api) {
+//     var viewWidth = api.getWidth();
+//     var viewHeight = api.getHeight();
+//     position[0] = Math.min(position[0] + width, viewWidth) - width;
+//     position[1] = Math.min(position[1] + height, viewHeight) - height;
+//     position[0] = Math.max(position[0], 0);
+//     position[1] = Math.max(position[1], 0);
+// }

Review comment:
       Thank for suggestion. I have doubt since this is just an attempt to fix the issue, which was mentioned in #12642.
   These commented temporarily codes will be removed or uncommented after being improved according to CRs of contributors and commiters.

##########
File path: src/component/axisPointer/viewHelper.js
##########
@@ -60,62 +59,41 @@ export function buildLabelElOption(
     );
     var labelModel = axisPointerModel.getModel('label');
     var paddings = formatUtil.normalizeCssArray(labelModel.get('padding') || 0);
-
-    var font = labelModel.getFont();
-    var textRect = textContain.getBoundingRect(text, font);
-
     var position = labelPos.position;
-    var width = textRect.width + paddings[1] + paddings[3];
-    var height = textRect.height + paddings[0] + paddings[2];
-
-    // Adjust by align.
-    var align = labelPos.align;
-    align === 'right' && (position[0] -= width);
-    align === 'center' && (position[0] -= width / 2);
-    var verticalAlign = labelPos.verticalAlign;
-    verticalAlign === 'bottom' && (position[1] -= height);
-    verticalAlign === 'middle' && (position[1] -= height / 2);
-
-    // Not overflow ec container
-    confineInContainer(position, width, height, api);
+    var font = labelModel.getFont();
 
     var bgColor = labelModel.get('backgroundColor');
     if (!bgColor || bgColor === 'auto') {
         bgColor = axisModel.get('axisLine.lineStyle.color');
     }
 
     elOption.label = {
-        shape: {x: 0, y: 0, width: width, height: height, r: labelModel.get('borderRadius')},
+        shape: {},
         position: position.slice(),
-        // TODO: rich
-        style: {
-            text: text,
+        style: graphic.setTextStyle({}, labelModel, {
+            text: labelModel.get('show') ? text : null,
+            textBackgroundColor: bgColor,
             textFont: font,
-            textFill: labelModel.getTextColor(),
             textPosition: 'inside',
             textPadding: paddings,
-            fill: bgColor,
-            stroke: labelModel.get('borderColor') || 'transparent',
-            lineWidth: labelModel.get('borderWidth') || 0,
-            shadowBlur: labelModel.get('shadowBlur'),
-            shadowColor: labelModel.get('shadowColor'),
-            shadowOffsetX: labelModel.get('shadowOffsetX'),
-            shadowOffsetY: labelModel.get('shadowOffsetY')
-        },
+            textFill: labelModel.getTextColor(),
+            rotation: labelModel.get('rotate'),
+            opacity: labelModel.get('opacity')
+        }, {isRectText: true}),
         // Lable should be over axisPointer.
         z2: 10
     };
 }
 
 // Do not overflow ec container
-function confineInContainer(position, width, height, api) {
-    var viewWidth = api.getWidth();
-    var viewHeight = api.getHeight();
-    position[0] = Math.min(position[0] + width, viewWidth) - width;
-    position[1] = Math.min(position[1] + height, viewHeight) - height;
-    position[0] = Math.max(position[0], 0);
-    position[1] = Math.max(position[1], 0);
-}
+// function confineInContainer(position, width, height, api) {
+//     var viewWidth = api.getWidth();
+//     var viewHeight = api.getHeight();
+//     position[0] = Math.min(position[0] + width, viewWidth) - width;
+//     position[1] = Math.min(position[1] + height, viewHeight) - height;
+//     position[0] = Math.max(position[0], 0);
+//     position[1] = Math.max(position[1], 0);
+// }

Review comment:
       Thanks for suggestion. I have doubt since this is just an attempt to fix the issue, which was mentioned in #12642.
   These commented temporarily codes will be removed or uncommented after being improved according to CRs of contributors and commiters.




----------------------------------------------------------------
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] plainheart closed pull request #12758: fix(axisPointer): some properties of label in axisPointer are not working, fix #12642.

Posted by GitBox <gi...@apache.org>.
plainheart closed pull request #12758:
URL: https://github.com/apache/incubator-echarts/pull/12758


   


----------------------------------------------------------------
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 pull request #12758: fix(axisPointer): some properties of label in axisPointer are not working, fix #12642.

Posted by GitBox <gi...@apache.org>.
echarts-bot[bot] commented on pull request #12758:
URL: https://github.com/apache/incubator-echarts/pull/12758#issuecomment-639394063


   Thanks for your contribution!
   The community will review it ASAP. In the meanwhile, please checkout [the coding standard](https://echarts.apache.org/en/coding-standard.html) and Wiki about [How to make a pull request](https://github.com/apache/incubator-echarts/wiki/How-to-make-a-pull-request).


----------------------------------------------------------------
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] chfw commented on a change in pull request #12758: fix(axisPointer): some properties of label in axisPointer are not working, fix #12642.

Posted by GitBox <gi...@apache.org>.
chfw commented on a change in pull request #12758:
URL: https://github.com/apache/incubator-echarts/pull/12758#discussion_r444531215



##########
File path: src/component/axisPointer/viewHelper.js
##########
@@ -60,62 +59,41 @@ export function buildLabelElOption(
     );
     var labelModel = axisPointerModel.getModel('label');
     var paddings = formatUtil.normalizeCssArray(labelModel.get('padding') || 0);
-
-    var font = labelModel.getFont();
-    var textRect = textContain.getBoundingRect(text, font);
-
     var position = labelPos.position;
-    var width = textRect.width + paddings[1] + paddings[3];
-    var height = textRect.height + paddings[0] + paddings[2];
-
-    // Adjust by align.
-    var align = labelPos.align;
-    align === 'right' && (position[0] -= width);
-    align === 'center' && (position[0] -= width / 2);
-    var verticalAlign = labelPos.verticalAlign;
-    verticalAlign === 'bottom' && (position[1] -= height);
-    verticalAlign === 'middle' && (position[1] -= height / 2);
-
-    // Not overflow ec container
-    confineInContainer(position, width, height, api);
+    var font = labelModel.getFont();
 
     var bgColor = labelModel.get('backgroundColor');
     if (!bgColor || bgColor === 'auto') {
         bgColor = axisModel.get('axisLine.lineStyle.color');
     }
 
     elOption.label = {
-        shape: {x: 0, y: 0, width: width, height: height, r: labelModel.get('borderRadius')},
+        shape: {},
         position: position.slice(),
-        // TODO: rich
-        style: {
-            text: text,
+        style: graphic.setTextStyle({}, labelModel, {
+            text: labelModel.get('show') ? text : null,
+            textBackgroundColor: bgColor,
             textFont: font,
-            textFill: labelModel.getTextColor(),
             textPosition: 'inside',
             textPadding: paddings,
-            fill: bgColor,
-            stroke: labelModel.get('borderColor') || 'transparent',
-            lineWidth: labelModel.get('borderWidth') || 0,
-            shadowBlur: labelModel.get('shadowBlur'),
-            shadowColor: labelModel.get('shadowColor'),
-            shadowOffsetX: labelModel.get('shadowOffsetX'),
-            shadowOffsetY: labelModel.get('shadowOffsetY')
-        },
+            textFill: labelModel.getTextColor(),
+            rotation: labelModel.get('rotate'),
+            opacity: labelModel.get('opacity')
+        }, {isRectText: true}),
         // Lable should be over axisPointer.
         z2: 10
     };
 }
 
 // Do not overflow ec container
-function confineInContainer(position, width, height, api) {
-    var viewWidth = api.getWidth();
-    var viewHeight = api.getHeight();
-    position[0] = Math.min(position[0] + width, viewWidth) - width;
-    position[1] = Math.min(position[1] + height, viewHeight) - height;
-    position[0] = Math.max(position[0], 0);
-    position[1] = Math.max(position[1], 0);
-}
+// function confineInContainer(position, width, height, api) {
+//     var viewWidth = api.getWidth();
+//     var viewHeight = api.getHeight();
+//     position[0] = Math.min(position[0] + width, viewWidth) - width;
+//     position[1] = Math.min(position[1] + height, viewHeight) - height;
+//     position[0] = Math.max(position[0], 0);
+//     position[1] = Math.max(position[1], 0);
+// }

Review comment:
       Personally, I would delete dead code. That's why we use git for dead codes.




----------------------------------------------------------------
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