echarts icon indicating copy to clipboard operation
echarts copied to clipboard

[Bug] boxplots are holding space for multiple series, while each series has a datasetIndex

Open nils-pfeifenberger opened this issue 1 year ago • 1 comments

Version

5.5.0

Link to Minimal Reproduction

https://echarts.apache.org/examples/en/editor.html?code=PYBwLglsB2AEC8sDesCwAoWXYBMCGYeAzgKZgBcsA2httkrXdjhALYnRFSeU2ZN0A5AGUSAD0EAaRgKyCAktADGAVwBGBblJmyReViAA2JWPIAi2_rNh6Dx2ADl9JS9bkBBNWoBOJAG4QBCQ4sML6RiZO7K5uthGwACoAniAu0la6AGIQ9qJgjs4x1oKePv6BYMGw2blkBdHpbjYAMsAA7iTesG0AFhBEANadRboATACsAKSwAI4qeNCQxiMCggCywYHQK0yCAOxTs_OLOWk6qwCqIKldvf1D3jtCAPrAakQAtNCFjbIAur8BERgCpvEoSLxzkw-E05AAzEisPDLQGxACMAAYMbBWBBtqjihjggAWEgADjwcI-ADYAMx7WkfYlqOF4D54MlkkgfcZovD80YY2njDHjMlPXYARQAogAFNHPYQgCBDRTPUa0jEATjRxOeCtp0AA5uq9trdc9aWSeaMJUJhGi7dhBABhGBgbzAQxOuSZNGUGXyxXK1XQdWanV6g3G03mvVWm0-mx-pPjAB0ozRe11tOpWrFDKtowJsmpGepxMzdIx1LRtOJaNGxPGJYEZfGey11Ir9L2ZOJZPpxNbTDLWrJ-dFIonnMx1JHdDJaZrXeFaPXmOJGImC-dDqdAKhdBhsMECKRKKPu0x2Nx-KvQi1SlGJGJ1JIVPHe25xKUSjZeCjHgOAfHslJojg4xwnC4wvrau5yIGCpKiqJBqhqcbPHqew8jGoxmpGlrWrBd5JiItJkWEdhnBkxSZLSAZyshIZoWGGGEdhuEmvhmEJiReJkfRqZpmi4xaoK4ywaM0m0miWpaghsBloKozyWKOoYgyWLFg-2DtrqknUhixK0rSGFiYpY5ZvJowThq45answ66VgexpquwpmV21JmqMPmKeRB67ieTSCBeNGwjYN44gJAWyeMOAkNS4zEh8JDBOMTLaR8GhwkoNJkhicI4Go-HrnsahkUhwaoehEYWqMlp4QRFp8aMpEBcI8EuTYbqLJ63oBZkoyMUGKGhuGmGNYa3EtfGxHtbFPWCMNwnSTWDbSd2ZLjN2aKWRmtJapq3balqxLEns1I6bRpZprtm1kvhewSeVB2OeM9JyZJVr1k9ilLppDJkuu0kTjqTmdd1t10IeMPYCFsThWR0UdcttJKDgcIYnJVJKMSWoYkyHKjB8WpwvJPJwmoJCUmBtI4BMVVMTVE3sRa4zPDh4zNbxC1o_D9rEpR4SXoLzqZMSo3MbVbH1XqnPc7zhFtQLkUrcLinppmqnXTqwqcqpZIHX5515v2labo2B0dluxkTkDvJdu9x2NoTtZGapmkA8u3b0iKtm1i9ZmdZrulw9YEdMAAviWDDwyw7CcNwRCQuLIjiE6CjKOomgwFnVHxOYBei5EPy6SUXi-AEQQhIX9hRBFsT1yYySpFnNQmHk9RN8UpTVxUVSd6EdSNwXJBzBw4JZ34yIqL3uivO8Xzl_DUdAiCYIQtQumI8U57IgvxSo0t4tyESOCkhSVJ0gyTIsgBnLcry_KAUKIpiszY0sXVmHRrNfNEydUdAFPqHovSCX9LAaq41WKTUIv_WMKsFqQLIgANXkLKaUzQHAAHEADSSYly5h8uJN8n1CpHWNstfcu516yD3roA-Yt1Yn3vGfGwF8r6UhpPSRkzJWTsifjyPkAp36inFAFGBP85Z_yagA5BQCaEgOWmAgakDpaszgezKM8ikGtRQUNFRHDBDNGENg5oAAlIhIlzqE00mbXawoWzKKCrvZazCj66DYWRLh5IeG334Q_IRXIRGv0FMKCRX8ZZs3lvqPRPFFGwUosY9WaiIFGM0bA3-CCElzSIkokxKYArSnkAkdwzR3CymEAkNYhCfb-x2kKC2YM6TALceLRhqxPEoyxDFdh6s_HX14XfARj9QkvzEZEz-UiWbZNkbkma-j5qFPVrQ1R7p1GZOgXMmR8CLSIMSQY1Zp5inLUlAkNB7g0G4IwfUnqS4TL2J2rWNEnJRQ3TWaktw9CBBdN2D0gKPiApDICXw--giOQTNEW_aZkjzm7Nlvs3RSyjkrOSe00BmyMnLT9FkvZOj4movyW1VBAUqnyHkNchI1ifbSS9rqHy306SfNPOs8WvzoQeMRIfXpt5T6DJJP4m-4KxkhOfjCiJH94UmOkUiwlhySWGNcVi_qOKilQLlbEuRxLAEYtxd80KCQqWygqWg4Q9yOFLh1pWMSeZZKqXEpi8OwVuXIyBX0tWp5QUitGcEqFErwniJmQi7-8q4mKr1dDL5ZF0mDQNfi8NOrlbHP1RqsiAAJXB0o0EulNbggA6vg2UuDhBmGNcWswaDJSWsioDNSL1BwYjJEyiszqOWupMYC5awLlo-pGUEyFwjJmwuldErROSDl5KjSk2N2L40asTdqxZKb0XRtOYa5uLoHAumaHu2tsIlyYkzIVbMgoXrHRcSY9lTROXHjdbyj1_KBneqFcMwJELxmBqmWO2ZYbl1Tt1Uk9doUb2njjRonZ_7tERuncBsly1mjmulMIMtaDmiygPU0I9BMOzak5P2MUNZ223s7erbtJje0mKfC-N8H4yZkm_EyP8AEgIgTAnCCCUEYJwXHfM5FWEuZcWWQU_iL7QMUU6qXQSDEoMxJg5hTiPMFGpsWuJ2IQkApmIsbSh5vt-zNv7NdMSzZaSdUky69xXaeUsNPFR9WNHXzvk_Ixn8LH2RsdAuBSC0FYIkBA7ELVCmOJCeUyJ1WAq2UWevdJoasmguTr1Ep1dom1MybIqU8plTqm1Kw24Yhl0szUhbcVt50k9jmY6U0f5QgKOsM9ZF0Kjm6MuaY7-f8HngJec4z5nj_m-MEricllTa6vUSZFtRGTS7gsWmG-F_mjWNPRfVhSqlaCaU2N1E2Fl25ZLannDQ5bPyyOnjq3Zhr6nijNecwxtr7nAJdY41x3zvG_3ycS4JpWI3Utjebkd0DsXcXxcRQBpLoWUsRcu1kf7sRjVVLNRamxflGO_TzDmWs1Dr0w4EHehGD7bOhXs6ea79GvxuY6w99j3nuN-YC8UBLCzZvg--5Dyi2PdAtym3JidjOwdffmzaX7dF2erHcOUtBaxZRmFwZKTIeXrCA0bDWXaDjjJmWcljqrbgavOndT2i7ZF4qJWSqldKkEsrbhypSfKxWiolTKlmSqb2ecCemhDhbUPVhdTnWqhd6thrTY-27lnHvBJ090NpvdumrUiVOo5LEpkjrxShlr6wOu5B68owbuKoljcpTShlC3pNco28KsVUq2ZHcDaTYRYPAuxOUXD6sCDQ0Rrc_44SuvaKfuLbok33YmWKlVJqXUmxa4cacg7OOFKTqaH96wLjrA6ebCZ_q8-w3uekr57N5lO2xfrcFTtxX8qTvQ3vd5-qODqmhcc_n86FvuK28M9d1f0bvesh38Qs0eQNy0EOHl7INaslPmPWFuJqLbBVnPqngwstKvuduvjnglFvqboXnvlbnlIfuXg7hVNXqDpfkBtfu_l7p_r1POmHoHhfl3kqoLkQbsKtOSmYNLpYrKJkLKJKHckjhWGiHSLmFdBMCDBrmsnfovjvCYnAYTtnujJvibgXubmgSXpgfbpXjgc7h3nElQVGjfsQT7uAn7qck_iDjNnqBocBloXQSQQoLgrgvILgpcrKDctHnWmmD2GJKZMlJiJ2OOCnnQidqFOIeiJISYkbsgbIbvtlAobblgcoafrKoYUHq_j3p7rsN7qqroeQe3oNlNAkazq3mRPIAWmYM0NKAQkmMSGmP2IxsVp4TqA9FekIdAX8rAY-vrggejJjNjLjB8PjITMTE9GTBTFqFTDTHTHgAzEzKoZkYRIrMJt3jkTQmHDFpNkNFLBkTXhzMzvXmlssegmgoUWsO4BmvsRatKGPvmIxvJEZDjMKM2KHA0VymIc0Vnq0UEe0TjOTF0QTETMSCTP0ZTFBMMXCPTIzOMLgUYc8NMWFrMaHrcVJksbiisc_oShCe7jQUkUIJLGRO4IwbgswawewfIAAQINamKIbCKEZN2LyJAdegsaRlZurP4cfIEerBjFjG8XjJ8b0aTOTH8dTLTICaMcCaCR9siSHqiZRDSWyoDkUgiXERfiKZsWYeiRKaFGYMIA4A4M0LuhmpkA4LKI4bCOmNuJyKZAOOOBjoxjCZZmvCWLHFCPHNYInBwFwDAKnKIaBpnLuNnKoBoJAPnJ6S3KYBYP6aXD3FnP3OULXKECGWPMGdRIkCkF4uiacCPPkDGRXOGTXJUCEMPN3GmenK0B0LcH0IMMMJ6RMNMHMAsEsImc6BsCwAsFnAcBWccNWVnFcDcN0MWQ8FnEvJ8N8A0FeLjsCKCOCLwJyrabdPabII6cnC6WnO6RIJ6YoN6XnGiTYAGcXLGfEHmaFBmYPHXNGavADnGW3DWb6MmbmUebEHuZGTmaPFecUKIJPMoGeTYLPIYPPD2W8H2Q-UwEOZvKOdQOOXHFeDOc6TwG6c3B6RXMubnL6WuXEPYJuRXAGTudeVXBGVmVGXGWhY-SGaeR3BefeQOenDeVhXeamb-asAWZ0J2fcKWRXOWUcFWacFnHWVsI2YcJWScATroO2bRXcCWY8J6b2SvCRZHCOMOVvGOTaSBQnGwE6SnPOVBYuTBTnD6VoFuUhUGShYeeJehWUJmVUKhVRckfhQmYRbUJRfpX3BhUZdmURdZa-RnM-dPJ6e-Z-SJd-WJTWf-SOdvFQMBXaaBQpbORBTrhnKpenLBRpX6bpXGchenCZTZboGRcZXpc5QGQRZ6RRaGZ6WlQ5VZXlRXDRUWfRcJYxVxS2axZ6exQ2Z6U2cxTxc5fxWVUJV-cvP2b5ZJQBQFXSadjZq-XIHbP0ijF4EdIKNSDyDgF2EyNjFSIBEoNaBBAcF4CyCQGiCQEoEKRfnsPqBiCiQ3p1CCbCREIJOMBQQJntZiIdVsbiidT1NrLZClBdKZIxiDLWCbM9WaOriKI2JdDbKpBdNmNuMep9FSZFGOGZM2vWLZE2LmKZIpG5I5GaHWCjppJ5ApDQg9R2v1aFGdqFCNYqc6E2GoM2OMHgGoF0YzIMc2CZOyNBIyDgNSFjH-GoJ9ITDKurIiRGhiPqJCdQUdTQnsBNmdUNHsJdQqnzaJLdcTb6CLVrBmKbMZHWATOJL9CbC9N2BdBbFaBDbCO2IxhqHJFaF2OuNuC7NmA2BWNJHJGpHUYesuNmGZHsJ4Srk5JjmsgrVadVk0bxcUETbQUIOCNmGaIxjSK-D-H5mTFiFTSZk5NTD5EoLyDtQJmSPtbLUHXuNSKLf7VkNSJLXEunTdaKULUUjnYrVtKJJ2AcMac2AdhwspC9F7F2DqE2GKKyk0IbTjNtiZJWKpK7e9IbGbSaXrcRnpkKOaIxmAZQsVp1BXT7drn7UNTYIHWuXIDgLSICX2KZF0ZiGiEyDtKTHgHyFTWTfWMZNSHlEoGBKnQqgqDLaXXddelzZKXCUUmSIXX_A_QLZoVnb6K_U0OmJqEKE5M2jqMAVdA7V3YdBOM2J2A2HWFPtA24O2FuP2CpLBJtGKO9E8ldIOG-IKA2J7Y7ViLqHbVaLyLbFjS_XcQvrJcFfJUnOBa6RFaIFFaFDFauSXAlTpUlRlWGXZfudhduaZfaOZe3DlY5cVaRUI7edI7hRzhPPPC-TPHPM5aJV1RKH5dJZBWnvjivYIGvWNWoBNTWNNbNcSPNR5ktR8CteMGtQiJtdtRMWsdhBnU_XLeuTjWslKf7hdasXgddQdZ4__cmD46eBglgjgiUQ0tZDeB9EKFuPraBhExJXjbEATbEMY0CuNeJOYwlJY9Y4tctTgKtV4E41tXfXEsE5nevd47nYY5kAEzzZhLU6E_UytGk7EJHlYptvFBdBdMZpWG2tjXQ3jtZgyboDkz2nk5NRY1NVY0VDY6U-U-tc49U20x4wqWEyIN03he_f41_YRO0zs5080xlmUkPjlqPg0lJDxG8m-PmOuMdeM0vgY2RDM5RnMwUzNYs8U6MLY_Y44xtVU640E9s1CWKa86dXnasM08cxaKc1C2Xf41VN_r_v_ptgTPhBdFg7qIxig4-fs3-b4Zk4NZ80yXZj81NYU_88syU3Y2Uw4xU6Cy42fi7oSsi4Lc_WsiS17n46ci07KVdZCzy1410xlgAJoyjNBrAOBoKElMDI1mldj4SgHPNEsc78vYAiHL5ngUsBRfOsI0sLNzUMuAurMsvrNgsctqFbMl1nOUQ6viOHNCuIvuOOsou8tCsZbCBSvCBoJStBtKuLjljJR5hiSwTHRmZjM-EZP7yGvLTGvUumP5O0t_PmsLWWtMtrOVPsuxHQYfbct_2dPCAut7iCuhQIuBNgklumG7MXMBRoK7FysHFHH4InENJTjaiZhyRnQagwuL36MPFwu7ApuhSb3b2DiMhKD72H2wTsin05R92X3X233gtgnrj811OUSAPNxVsaaf21sfbbuP1OtDT7vFAFrCAFpWHCDNBZrCDVLyAZrCBYlS6WL6lNBlGlZcEUn1hUKdRXuksJu6BTOrATuxBTuu0zt704wLvH3Lvn1bhvjrt4CbMII_27vAeNOCTHutNYc7sdP4dkSlpmCSjuCUoJB9OK0OL5j2Qii5i8ixu0PxudLL2UvPHqwwc72zvzsDiLsn2U0rsX1od_gbt2uTEHLYcke4ewtNMEciv33EcXu4ogerDShrBmCWLSg0fmBXLftuBlEfVbh5hkM-TGQ0NrIae6sjhBUZD0LGBGgcA4CUAoDADeAQAcAUA2A9CecQAABe7oyIUgsAYAoAlAmosAE5dAYg7gYg_Q7nUIRARgEAYAzQeI28KARA_nbQlAHo88MXJYXVlAgg35nQs88FRAOwYACZZX_4lQRonnSQIwsX2ASQCXSXyAUIXVrQjX3AZXuIOAOAedpXNghgwARomIAAFJTSoNAPgC-QAJRteoikBeckCsOMPWB1epBldqDABiBGDABgASgQBuc2CHdiBbfsiLcfCCUPBEBE4CBTzACJTJfixiBleaNiMdfKWhSlV0XtUBRMXcWtkBR1WdONXg81XLStXA_dnsfWDtcCDjeCAvdMD4CECkBgCKCJTfewAYgMOTlXh7fbyCBECNeVAVXwwXdlcghgCGDefeDPdUsCDY_EBkD4_iCUD7RXhvcfc9dfc_feVaO7hJBlceU1mo9MDo-Y9YCy9YBTkCDk8HdHcndncjj09XdHe3cLAgSPedBECCjceyCC_Ze6SE-CC_cpUCCS96M9PtACVdkMUmJg_VVjtCBQ9kQw-e-GMI9G-0-0nwxK_YDo-m-jUjic-488-E-d3YBh8q9MBq82BU8EA0_neXflcqBM8s8m_s9Y8EBc94-Le8-wCsfWAW-fdNDW-2-vkO-CDS8Shh9YAR-F-K9yW7f1e6_HeTda9Xg6-CDXf6_3dB9EAgNR8C_KDveW8i82D19OgO_6tA9B9kQe8sVe-1mbD1XLR--b8B_XAu_lXjOt-wDo-T9mEx_c9l-E-CExxd-yCp-U_U9u_WBD-M_M_G-X-0HX-l8E-UAtWWAavsL1r6i9Oqf3LAI32b4jgz-F_DvsVx25P8e-w_DXv3yz7q8bunwA3g91d6s8oOdAEAcnwEB18xekA2AMv0QzO82qSPZaBv2apkQfeAUffgwICiB88Bp_EcOjwIHMBi-sfW_pQAboCAk-ZPFAenzACZ9te2fT_vnx4FYA_-cfSgCkyYBECre4An8nbyYDQD1GLfLgc4DK48DZeUcaOAAG4gAA

Steps to Reproduce

see in the shared example, the boxes are not centered. the are holding space for the other series.

Current Behavior

for each boxplot series, the chart holds a space in each grid column.

Expected Behavior

If a datasetIndex is used, I'D expect to use the complete space of the grid column like scatter points are doing it. Also it would be good to use the complete grid for the selected categories in the legend, if not all are selected.

Environment

- OS: Win 11
- Browser: Chrome
- Framework: Vue3

Any additional comments?

No response

nils-pfeifenberger avatar May 08 '24 15:05 nils-pfeifenberger

Current Behavior: for each boxplot series, the chart holds a space in each grid (X-category) column.

yes, correct, space is reserved because boxplots have horizontal width, unlike scatter points. I think you found a good workaround with visualMap in #19911.

helgasoft avatar May 08 '24 18:05 helgasoft