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/05/01 06:49:37 UTC

[GitHub] [incubator-echarts] zhiyuc123 opened a new pull request #12550: feat(dataZoom): custom brush style in toolbox.feature.dataZoom

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


   
   
   <!-- Please fill in the following information to help us review your PR more efficiently. -->
   
   ## Brief Information
   
   This pull request is in the type of:
   
   - [ ] bug fixing
   - [x] new feature
   - [ ] others
   
   
   
   ### What does this PR do?
   
   <!-- USE ONCE SENTENCE TO DESCRIBE WHAT THIS PR DOES. -->
   
   allow user to custom brush style in toolbox.feature.dataZoom
   
   ### Fixed issues
   
   <!--
   - #xxxx: ...
   -->
   
   #8964
   
   ## Details
   
   ### Before: What was the problem?
   
   <!-- DESCRIBE THE BUG OR REQUIREMENT HERE. -->
   
   <!-- ADD SCREENSHOT HERE IF APPLICABLE. -->
   
   框选型数据区域缩放组件不能更改选框颜色,在暗色主题下表现不好
   
   ### After: How is it fixed in this PR?
   
   允许用户通过配置自定义选框样式
   
          toolbox: {
               feature: {
                   dataZoom: {
                       show: true,
                       yAxisIndex: null,
                       brushStyle: {
                           borderWidth: 2,
                           color: 'blue',
                           opacity: 0.1,
                           borderColor: '#596A76',
                        }
                   },
               }
           },
   <!-- THE RESULT AFTER FIXING AND A SIMPLE EXPLANATION ABOUT HOW IT IS FIXED. -->
   
   <!-- ADD SCREENSHOT HERE IF APPLICABLE. -->
   
   
   
   ## Usage
   
   ### Are there any API changes?
   
   - [ ] The API has been changed.
   
   <!-- LIST THE API CHANGES HERE -->
   
   
   
   ### Related test cases or examples to use the new APIs
   
   NA.
   
   
   
   ## Others
   
   ### Merging options
   
   - [ ] Please squash the commits into a single one when merge.
   
   ### Other information
   


----------------------------------------------------------------
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 #12550: feat(dataZoom): custom brush style in toolbox.feature.dataZoom

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



##########
File path: src/component/toolbox/feature/DataZoom.js
##########
@@ -236,16 +240,30 @@ function updateZoomBtnStatus(featureModel, ecModel, view, payload, api) {
             zoomActive
             ? {
                 brushType: 'auto',
-                brushStyle: {
-                    // FIXME user customized?
-                    lineWidth: 0,
-                    fill: 'rgba(0,0,0,0.2)'
-                }
+                brushStyle: mapBrushStyle(featureModel.option.brushStyle)
             }
             : false
         );
 }
 
+function mapBrushStyle(brushStyle) {
+    var properties = [
+        ['fill', 'color'],
+        ['lineWidth', 'borderWidth'],
+        ['stroke', 'borderColor'],
+        ['opacity', 'opacity']
+    ];
+    var style = {};
+    for (var i = 0; i < properties.length; i++) {
+        var propName = properties[i][1];
+        var val = brushStyle[propName];
+        if (val != null) {
+            style[properties[i][0]] = val;
+        }
+    }
+    return style;

Review comment:
       Sorry, I am now aware of 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] pissang merged pull request #12550: feat(dataZoom): custom brush style in toolbox.feature.dataZoom

Posted by GitBox <gi...@apache.org>.
pissang merged pull request #12550:
URL: https://github.com/apache/incubator-echarts/pull/12550


   


----------------------------------------------------------------
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 #12550: feat(dataZoom): custom brush style in toolbox.feature.dataZoom

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


   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] pissang commented on a change in pull request #12550: feat(dataZoom): custom brush style in toolbox.feature.dataZoom

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



##########
File path: src/component/toolbox/feature/DataZoom.js
##########
@@ -236,16 +240,30 @@ function updateZoomBtnStatus(featureModel, ecModel, view, payload, api) {
             zoomActive
             ? {
                 brushType: 'auto',
-                brushStyle: {
-                    // FIXME user customized?
-                    lineWidth: 0,
-                    fill: 'rgba(0,0,0,0.2)'
-                }
+                brushStyle: mapBrushStyle(featureModel.option.brushStyle)
             }

Review comment:
       Model has provided a `getItemStyle` method to map all the style properties.
   
   ```js
   brushStyle: featureModel.getModel('brushStyle').getItemStyle()
   ```
   
   




----------------------------------------------------------------
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 #12550: feat(dataZoom): custom brush style in toolbox.feature.dataZoom

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


   Congratulations! Your PR has been merged. Thanks for your contribution! 👍


----------------------------------------------------------------
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] susiwen8 commented on a change in pull request #12550: feat(dataZoom): custom brush style in toolbox.feature.dataZoom

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



##########
File path: src/component/toolbox/feature/DataZoom.js
##########
@@ -236,16 +240,30 @@ function updateZoomBtnStatus(featureModel, ecModel, view, payload, api) {
             zoomActive
             ? {
                 brushType: 'auto',
-                brushStyle: {
-                    // FIXME user customized?
-                    lineWidth: 0,
-                    fill: 'rgba(0,0,0,0.2)'
-                }
+                brushStyle: mapBrushStyle(featureModel.option.brushStyle)
             }
             : false
         );
 }
 
+function mapBrushStyle(brushStyle) {
+    var properties = [
+        ['fill', 'color'],
+        ['lineWidth', 'borderWidth'],
+        ['stroke', 'borderColor'],
+        ['opacity', 'opacity']
+    ];
+    var style = {};
+    for (var i = 0; i < properties.length; i++) {
+        var propName = properties[i][1];
+        var val = brushStyle[propName];
+        if (val != null) {
+            style[properties[i][0]] = val;
+        }
+    }
+    return style;

Review comment:
       @chfw ECharts do not allow ES6 and ES5 syntax.

##########
File path: src/component/toolbox/feature/DataZoom.js
##########
@@ -236,16 +240,30 @@ function updateZoomBtnStatus(featureModel, ecModel, view, payload, api) {
             zoomActive
             ? {
                 brushType: 'auto',
-                brushStyle: {
-                    // FIXME user customized?
-                    lineWidth: 0,
-                    fill: 'rgba(0,0,0,0.2)'
-                }
+                brushStyle: mapBrushStyle(featureModel.option.brushStyle)
             }
             : false
         );
 }
 
+function mapBrushStyle(brushStyle) {
+    var properties = [
+        ['fill', 'color'],
+        ['lineWidth', 'borderWidth'],
+        ['stroke', 'borderColor'],
+        ['opacity', 'opacity']
+    ];
+    var style = {};
+    for (var i = 0; i < properties.length; i++) {
+        var propName = properties[i][1];
+        var val = brushStyle[propName];
+        if (val != null) {
+            style[properties[i][0]] = val;
+        }
+    }
+    return style;

Review comment:
       @chfw ECharts do not allow ES6 and ES5 syntax.
   https://echarts.apache.org/zh/coding-standard.html#compatibility




----------------------------------------------------------------
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 #12550: feat(dataZoom): custom brush style in toolbox.feature.dataZoom

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



##########
File path: src/component/toolbox/feature/DataZoom.js
##########
@@ -236,16 +240,30 @@ function updateZoomBtnStatus(featureModel, ecModel, view, payload, api) {
             zoomActive
             ? {
                 brushType: 'auto',
-                brushStyle: {
-                    // FIXME user customized?
-                    lineWidth: 0,
-                    fill: 'rgba(0,0,0,0.2)'
-                }
+                brushStyle: mapBrushStyle(featureModel.option.brushStyle)
             }
             : false
         );
 }
 
+function mapBrushStyle(brushStyle) {
+    var properties = [
+        ['fill', 'color'],
+        ['lineWidth', 'borderWidth'],
+        ['stroke', 'borderColor'],
+        ['opacity', 'opacity']
+    ];
+    var style = {};
+    for (var i = 0; i < properties.length; i++) {
+        var propName = properties[i][1];
+        var val = brushStyle[propName];
+        if (val != null) {
+            style[properties[i][0]] = val;
+        }
+    }
+    return style;

Review comment:
       firstly, you may consider es6 for..in syntax to simplify the for loop
   
   secondly, you may consider es6 for..of syntax to shrink your for loop(reduce the number of variables and lines)
   
   lastly, you can try out forEach to completely rewrite the function, i.e.:
   
   ```
   [
        ['fill', 'color'],
        ['lineWidth', 'borderWidth'],
        ['stroke', 'borderColor'],
        ['opacity', 'opacity']
    ].forEach((item) =>{ console.log(item)})
   ```




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