Adityakashyap1011 opened a new pull request, #21363:
URL: https://github.com/apache/echarts/pull/21363
<!-- 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
- [ ] new feature
- [ ] others
### What does this PR do?
<!-- USE ONE SENTENCE TO DESCRIBE WHAT THIS PR DOES. -->
Fix brush selection to properly support multiple selections and correct
inBrush opacity rendering by updating default brush configuration and language
settings.
### Fixed issues
<!--
- #xxxx: ...
-->
- #xxxx: Brush selection is 'single' even when setting brushMode: 'multiple'
- #11649: inBrush.opacity not working properly
## Details
### Before: What was the problem?
<!-- DESCRIBE THE BUG OR REQUIREMENT HERE. -->
When using the brush feature with `brushMode: 'multiple'`, drawing a second
selection box would clear the previous one. Additionally, the `inBrush.opacity`
setting was not being applied correctly, resulting in selected points not
displaying with the expected opacity level.
**Steps to Reproduce:**
1. Click on 'box' selection in the toolbox
2. Draw first selection box
3. Draw second selection box (previous box is cleared)
4. Expected: Previous selection should remain visible
5. Actual: Previous selection is cleared
**Issue with opacity:**
- Selected points should have opacity: 1 (fully visible)
- Unselected points should have opacity: 0.3 (semi-transparent)
- Both were not rendering correctly
### After: How does it behave after the fixing?
<!-- THE RESULT AFTER FIXING AND A SIMPLE EXPLANATION ABOUT HOW IT IS FIXED.
-->
After applying these changes, the brush feature now correctly:
1. **Maintains multiple selections:** Users can draw multiple selection
boxes and all previous selections remain visible
2. **Proper opacity rendering:** Selected points display with full opacity
(1.0) while unselected points are semi-transparent (0.3)
3. **Correct brush mode:** `brushMode: 'multiple'` is now the default,
allowing concurrent selections
4. **Visual clarity:** Selection boxes have visible borders for better UX
**Changes Made:**
- Modified `src/i18n/langEN.ts` to set proper default brush configuration:
- `brushMode: 'multiple'` - enables multiple concurrent selections
- `removeOnClick: false` - prevents clearing previous selections
- `brushStyle.opacity: 0.3` - semi-transparent selection box
- `inBrush.opacity: 1` - fully visible selected points
- `outOfBrush.opacity: 0.3` - semi-transparent unselected points
- Added border styling for better visibility
- Users can now use the brush feature more intuitively with the "keep" and
"clear" buttons in the toolbox to manage multiple selections
## Document Info
One of the following should be checked.
- [ ] This PR doesn't relate to document changes
- [x] The document should be updated later
- [ ] The document changes have been made in apache/echarts-doc#xxx
Note: Documentation should be updated to reflect the new default brushMode
behavior and opacity settings.
## Misc
### Security Checking
- [ ] This PR uses security-sensitive Web APIs.
<!-- PLEASE CHECK IT AGAINST:
<https://github.com/apache/echarts/wiki/Security-Checklist-for-Code-Contributors>
-->
### ZRender Changes
- [ ] This PR depends on ZRender changes (ecomfe/zrender#xxx).
### Related test cases or examples to use the new APIs
Test file created at:
`c:\Users\ADITYA\OneDrive\Desktop\echarts\test\brush-feature-test.html`
**To run the test:**
1. Build the project: `npm run build`
2. Open test file in browser: `test/brush-feature-test.html`
3. Verify:
- brushMode is set to 'multiple' ✓
- removeOnClick is false ✓
- Multiple selections persist ✓
- Opacity values are correct ✓
### Merging options
- [x] Please squash the commits into a single one when merging.
### Other information
This fix addresses the reported issue where brushMode: 'multiple' was not
operating as intended. The default configuration has been updated to properly
support multiple brush selections while maintaining visual clarity through
proper opacity settings.
I am also attaching a video solution
https://github.com/user-attachments/assets/09a4eb4c-dbfd-473b-8890-fd7a1cc6ec92
--
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.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
