apache / echarts

Apache ECharts is a powerful, interactive charting and data visualization library for browser
https://echarts.apache.org
Apache License 2.0
60.8k stars 19.62k forks source link

[Bug] The scatter brushselect can not select the real point in my data #20281

Open honghh2018 opened 3 months ago

honghh2018 commented 3 months ago

Version

5.5.1

Link to Minimal Reproduction

The scatter brushselect can not select the real point in my data

Steps to Reproduce

the part of data lying below: just few part, total data were6230 element to plot the point data= [{'barcode': 'AM3G459_AAACCCAAGCTAGTTC-1', 'value': [-3.36280719833069, 2.09605242976504], 'cluster': '0'}, {'barcode': 'AM3G459_AAACCCAAGTGTACAA-1', 'value': [-7.34648434714966, 4.56429269084292], 'cluster': '3'}, {'barcode': 'AM3G459_AAACCCACACGTATAC-1', 'value': [11.0504473011047, 8.39798333415347], 'cluster': '1'}, {'barcode': 'AM3G459_AAACCCAGTTGCTCGG-1', 'value': [5.58813078804321, -8.26093695393247], 'cluster': '2'}, {'barcode': 'AM3G459_AAACCCATCAGCGCAC-1', 'value': [1.76149137420959, -10.1491482042376], 'cluster': '2'}, {'barcode': 'AM3G459_AAACCCATCGAAGAAT-1', 'value': [-7.73223464088135, 2.06008937129336], 'cluster': '0'}, {'barcode': 'AM3G459_AAACCCATCGACGACC-1', 'value': [-4.64676968650513, 1.09112717875796], 'cluster': '0'}, {'barcode': 'AM3G459_AAACGAACACCGTGAC-1', 'value': [-0.555693640276721, -9.34472105732602], 'cluster': '7'}, {'barcode': 'AM3G459_AAACGAACATTCTCCG-1', 'value': [-3.97246400909119, 3.65766265162784], 'cluster': '0'}, {'barcode': 'AM3G459_AAACGAAGTCAAAGTA-1', 'value': [4.37680132789917, -8.41930268040341], 'cluster': '2'}, {'barcode': 'AM3G459_AAACGAAGTGCTGCAC-1', 'value': [-5.65322796897583, 1.37838306197482], 'cluster': '0'}, {'barcode': 'AM3G459_AAACGAAGTGGAGGTT-1', 'value': [2.18352587623901, 2.33132650622684], 'cluster': '6'}, {'barcode': 'AM3G459_AAACGAATCGAGAAGC-1', 'value': [-4.29687444762879, 0.607369921296415], 'cluster': '0'}, {'barcode': 'AM3G459_AAACGCTAGGAACTCG-1', 'value': [5.21068318291015, -7.39023277989072], 'cluster': '2'}, {'barcode': 'AM3G459_AAACGCTAGTTGTAGA-1', 'value': [-8.55371729926758, 5.47560956248599], 'cluster': '3'}, {'barcode': 'AM3G459_AAACGCTCACAGTCAT-1', 'value': [-7.98257271842652, 6.11170174846011], 'cluster': '3'}, {'barcode': 'AM3G459_AAACGCTCAGGCAATG-1', 'value': [2.19769080086059, -11.871784427077], 'cluster': '4'}, {'barcode': 'AM3G459_AAACGCTGTAATACCC-1', 'value': [-8.80815760688477, 2.81853439578372], 'cluster': '3'}, {'barcode': 'AM3G459_AAACGCTGTATGTCCA-1', 'value': [4.76075489921875, -7.48057673206967], 'cluster': '2'}, {'barcode': 'AM3G459_AAACGCTTCCAATCTT-1', 'value': [5.78152544899292, -7.44980261555356], 'cluster': '2'}, {'barcode': 'AM3G459_AAACGCTTCTCCCAAC-1', 'value': [3.27873213692016, -7.53331825962705], 'cluster': '2'}, {'barcode': 'AM3G459_AAAGAACAGCAGCGAT-1', 'value': [-7.34721724586182, 1.444168946832], 'cluster': '0'}, {'barcode': 'AM3G459_AAAGAACCACTAACGT-1', 'value': [2.37559707565613, -10.9989864610736], 'cluster': '4'}, {'barcode': 'AM3G459_AAAGAACCAGGGCTTC-1', 'value': [1.1285179416687, -9.54598353138608], 'cluster': '7'}, {'barcode': 'AM3G459_AAAGAACCATGACAAA-1', 'value': [-9.18898884849243, 5.6612007833417], 'cluster': '3'}, {'barcode': 'AM3G459_AAAGAACGTCAAACGG-1', 'value': [-4.90950338439636, 0.934373519509611], 'cluster': '0'}, {'barcode': 'AM3G459_AAAGAACGTCTACAGT-1', 'value': [11.5606735507996, 7.85284020671207], 'cluster': '1'}, {'barcode': 'AM3G459_AAAGAACGTGATACCT-1', 'value': [4.41828425331421, -6.92524931660337], 'cluster': '2'}, {'barcode': 'AM3G459_AAAGAACGTGTGTCGC-1', 'value': [11.2464712421448, 7.52613332042056], 'cluster': '1'}, {'barcode': 'AM3G459_AAAGAACGTTCTATCT-1', 'value': [-13.8532926280945, -1.3763198041026], 'cluster': '8'}, {'barcode': 'AM3G459_AAAGAACTCGTCTACC-1', 'value': [-2.95524994926148, 1.7412915445264], 'cluster': '0'}, {'barcode': 'AM3G459_AAAGGATAGAAGTCAT-1', 'value': [-5.34420840339356, 3.85477664241153], 'cluster': '0'}, {'barcode': 'AM3G459_AAAGGATAGGATAATC-1', 'value': [-13.8770229061096, -0.950998582750979], 'cluster': '8'}, {'barcode': 'AM3G459_AAAGGATCAACCGCTG-1', 'value': [-8.05470149116211, -2.66955826512021], 'cluster': '5'}, {'barcode': 'AM3G459_AAAGGATCAAGAGGTC-1', 'value': [-6.45639912681275, 6.2943499303754], 'cluster': '3'}, {'barcode': 'AM3G459_AAAGGATGTCGTGGAA-1', 'value': [-6.75476519660645, 3.04575564631778], 'cluster': '0'}, {'barcode': 'AM3G459_AAAGGATGTCTATGAC-1', 'value': [4.26344426079101, -7.33629296055478], 'cluster': '2'}, {'barcode': 'AM3G459_AAAGGGCAGACCAACG-1', 'value': [11.8476217548401, 6.45139910945254], 'cluster': '1'}, {'barcode': 'AM3G459_AAAGGGCAGAGAACCC-1', 'value': [10.5388639728577, 4.62680079707461], 'cluster': '1'}, {'barcode': 'AM3G459_AAAGGGCAGCGGTATG-1', 'value': [-6.84493224219971, 1.83505203494388], 'cluster': '0'}, {'barcode': 'AM3G459_AAAGGGCAGCTGGCCT-1', 'value': [5.67221434517212, -10.5518085741107], 'cluster': '2'}, {'barcode': 'AM3G459_AAAGGGCAGGCCTTCG-1', 'value': [3.15471442146606, -9.12364790669126], 'cluster': '2'}, {'barcode': 'AM3G459_AAAGGGCCAAGTTGGG-1', 'value': [-8.51764504508667, 5.54405619868594], 'cluster': '3'}, {'barcode': 'AM3G459_AAAGGGCCACTGGACC-1', 'value': [-8.19296471671753, 2.36071088084537], 'cluster': '0'}, {'barcode': 'AM3G459_AAAGGGCCAGGCAATG-1', 'value': [-5.60898606376343, 3.00496008166629], 'cluster': '0'}, {'barcode': 'AM3G459_AAAGGGCCATAAGCGG-1', 'value': [2.14862854881592, -11.9608642839496], 'cluster': '4'}, {'barcode': 'AM3G459_AAAGGGCGTTAGCGGA-1', 'value': [2.59986837311096, -10.2040493272845], 'cluster': '2'}, {'barcode': 'AM3G459_AAAGGGCTCAGCTAGT-1', 'value': [2.77904923363037, -9.07666609516782], 'cluster': '2'}, {'barcode': 'AM3G459_AAAGGGCTCCCGTAAA-1', 'value': [-1.47583959893875, 2.43076803454715], 'cluster': '6'}, {'barcode': 'AM3G459_AAAGGGCTCGGTCTGG-1', 'value': [-8.34911934928589, 3.42731954821902], 'cluster': '3'}, {'barcode': 'AM3G459_AAAGGTAAGTGAATAC-1', 'value': [-7.22999398307495, 3.00107958087283], 'cluster': '0'}, {'barcode': 'AM3G459_AAAGGTACACATGGTT-1', 'value': [-1.9979321201294, 2.62031318911868], 'cluster': '6'}, {'barcode': 'AM3G459_AAAGGTACACGACCTG-1', 'value': [9.3235863010437, 9.46299721965152], 'cluster': '1'}, {'barcode': 'AM3G459_AAAGGTATCTTCGTGC-1', 'value': [11.4996374408752, 8.47722413310367], 'cluster': '1'}, {'barcode': 'AM3G459_AAAGGTATCTTGCGCT-1', 'value': [5.06119521065063, -17.348232486159], 'cluster': '10'}, {'barcode': 'AM3G459_AAAGTCCAGACTAGAT-1', 'value': [2.03383310242004, -7.14671013584775], 'cluster': '2'}, {'barcode': 'AM3G459_AAAGTCCAGGCCATAG-1', 'value': [10.6723392765076, 6.52332761058169], 'cluster': '1'}, {'barcode': 'AM3G459_AAAGTCCCAAATACGA-1', 'value': [2.95174487037964, -7.14089176884336], 'cluster': '2'}, {'barcode': 'AM3G459_AAAGTCCCATCCGAGC-1', 'value': [9.9019611637146, -1.66983804932279], 'cluster': '2'}, {'barcode': 'AM3G459_AAAGTCCGTAACACGG-1', 'value': [-4.45559660987549, 0.66620638140994], 'cluster': '0'}, {'barcode': 'AM3G459_AAAGTCCTCACCTGTC-1', 'value': [-13.3347388942688, -1.00808999767942], 'cluster': '8'}, {'barcode': 'AM3G459_AAAGTGAAGATAGCAT-1', 'value': [4.77215321464844, -7.07169649830503], 'cluster': '2'}, {'barcode': 'AM3G459_AAAGTGAAGATGCTGG-1', 'value': [-8.96796052055054, 2.44692780742007], 'cluster': '3'}, {'barcode': 'AM3G459_AAAGTGACAGCAGACA-1', 'value': [-1.8586572249382, 1.79941942462283], 'cluster': '0'}, {'barcode': 'AM3G459_AAAGTGAGTACGCGTC-1', 'value': [-6.4079434116333, 4.02528121241885], 'cluster': '0'}, {'barcode': 'AM3G459_AAATGGAAGAGTGAAG-1', 'value': [-6.80223338203125, 2.02047135600406], 'cluster': '0'}, {'barcode': 'AM3G459_AAATGGAAGCAACAAT-1', 'value': [2.55406744880981, -8.07501766911191], 'cluster': '2'}, {'barcode': 'AM3G459_AAATGGACAGAGGACT-1', 'value': [-4.76452009277039, 1.44335677394229], 'cluster': '0'}, {'barcode': 'AM3G459_AAATGGAGTCTGCCTT-1', 'value': [9.84675772590942, -1.97597048512143], 'cluster': '9'}, {'barcode': 'AM3G459_AAATGGAGTTAAGGAT-1', 'value': [4.76192124290771, -6.70563433399838], 'cluster': '2'}, {'barcode': 'AM3G459_AAATGGAGTTCTCTAT-1', 'value': [-7.94582192496949, 5.33747079142886], 'cluster': '3'}, {'barcode': 'AM3G459_AAATGGATCTCAACGA-1', 'value': [-7.9001890857666, 1.66309263476687], 'cluster': '0'}, {'barcode': 'AM3G459_AACAAAGAGGAACGTC-1', 'value': [1.42260892792053, -12.3595430635516], 'cluster': '4'}, {'barcode': 'AM3G459_AACAAAGCACTATCGA-1', 'value': [2.09525258941955, -11.7930671953265], 'cluster': '4'}, {'barcode': 'AM3G459_AACAAAGCAGCGTGCT-1', 'value': [-5.33353678779297, 2.5702903486188], 'cluster': '0'}, {'barcode': 'AM3G459_AACAAAGTCAGGGTAG-1', 'value': [-4.43465368346863, 0.823192379563627], 'cluster': '0'}, {'barcode': 'AM3G459_AACAAAGTCTCGGTCT-1', 'value': [-8.78144900397949, 5.68176533946353], 'cluster': '3'}, {'barcode': 'AM3G459_AACAACCAGCTCGACC-1', 'value': [-4.92843954162293, 3.78990533122378], 'cluster': '0'}, {'barcode': 'AM3G459_AACAACCAGGATACGC-1', 'value': [3.59138377113647, -8.91912672749204], 'cluster': '2'}, {'barcode': 'AM3G459_AACAACCCAATCACGT-1', 'value': [5.46627695961304, -6.3918244623248], 'cluster': '2'}, {'barcode': 'AM3G459_AACAACCCAGTTCTAG-1', 'value': [-7.64032809333496, 1.95632889041263], 'cluster': '0'}, {'barcode': 'AM3G459_AACAACCGTCGAATTC-1', 'value': [-4.3758331973999, 2.65280678042727], 'cluster': '0'}, {'barcode': 'AM3G459_AACAACCTCACCTCTG-1', 'value': [10.2015217105896, 4.19718005427676], 'cluster': '1'}, {'barcode': 'AM3G459_AACAACCTCCAGGACC-1', 'value': [10.2886551181824, 7.37321593531924], 'cluster': '1'}, {'barcode': 'AM3G459_AACAAGAAGATACATG-1', 'value': [2.36071808739013, -12.4054233812396], 'cluster': '4'}, {'barcode': 'AM3G459_AACAAGAAGCGACTGA-1', 'value': [-6.03564469413452, 1.36417927512485], 'cluster': '0'}, {'barcode': 'AM3G459_AACAAGAAGGCCATAG-1', 'value': [1.62899716301269, -10.1474754594867], 'cluster': '2'}, {'barcode': 'AM3G459_AACAAGACAGCAGTTT-1', 'value': [-5.22007624702149, 1.94419672259646], 'cluster': '0'}, {'barcode': 'AM3G459_AACAAGACAGGGTTGA-1', 'value': [11.3473890583069, 6.68982102641421], 'cluster': '1'}, {'barcode': 'AM3G459_AACAAGACATGCAGCC-1', 'value': [-4.3551155765503, 1.30432584056216], 'cluster': '0'}, {'barcode': 'AM3G459_AACAAGAGTACGCGTC-1', 'value': [-5.21442381934815, 5.42325761088687], 'cluster': '3'}, {'barcode': 'AM3G459_AACAAGAGTCGTTGCG-1', 'value': [11.5112121860535, 7.97839810618716], 'cluster': '1'}, {'barcode': 'AM3G459_AACACACGTAACACCT-1', 'value': [4.88371308250732, -6.77812693348569], 'cluster': '2'}, {'barcode': 'AM3G459_AACACACGTACTGGGA-1', 'value': [-6.23377673225098, 4.88329770335513], 'cluster': '3'}, {'barcode': 'AM3G459_AACACACGTCGAATTC-1', 'value': [-8.17522589759522, 6.64190366038638], 'cluster': '3'}, {'barcode': 'AM3G459_AACACACGTGTCCTAA-1', 'value': [2.36139829559631, -11.1330101274554], 'cluster': '4'}, {'barcode': 'AM3G459_AACAGGGAGCAGTACG-1', 'value': [-9.17092721061402, 6.13290002116519], 'cluster': '3'}, {'barcode': 'AM3G459_AACAGGGAGGTCCGAA-1', 'value': [10.7684629718811, 8.76220586070376], 'cluster': '1'}, {'barcode': 'AM3G459_AACAGGGAGTAAAGCT-1', 'value': [5.31627257271118, -6.90102789631528], 'cluster': '2'}, {'barcode': 'AM3G459_AACAGGGAGTGTAGAT-1', 'value': [-6.959558649823, 2.31750323542911], 'cluster': '0'}, {'barcode': 'AM3G459_AACAGGGCATCTAACG-1', 'value': [-8.53629033164673, 6.08243968257266], 'cluster': '3'}, {'barcode': 'AM3G459_AACAGGGGTCACTTCC-1', 'value': [-6.94348399238282, 2.6160736299451], 'cluster': '0'}, {'barcode': 'AM3G459_AACAGGGGTGATTCAC-1', 'value': [-9.28702847556763, 4.86792018184024], 'cluster': '3'}, {'barcode': 'AM3G459_AACAGGGTCTGAGGCC-1', 'value': [11.1243942539246, 9.35078217753726], 'cluster': '1'}, {'barcode': 'AM3G459_AACCAACAGAGAGTTT-1', 'value': [10.660034016803, 8.02798440226871], 'cluster': '1'}, {'barcode': 'AM3G459_AACCAACAGCCTATCA-1', 'value': [0.181277827456663, -9.17381308308286], 'cluster': '7'}, {'barcode': 'AM3G459_AACCAACAGCGGACAT-1', 'value': [1.55633576317138, 2.67207362422305], 'cluster': '6'}]

option && myChart.setOption(option);

myChart.on('brushselected', function (params) {
    var selectedItems = [];
    var mainSeries = params.batch[0].selected[0];
    console.log("mainSeries-->",mainSeries)

    for (var i = 0; i < mainSeries.dataIndex.length; i++) {
        var rawIndex = mainSeries.dataIndex[i];

        selectedItems.push(data[rawIndex]['barcode']);

    }
    selectCell.value = selectedItems
    console.log("selectCell.value-->",selectCell.value.length)

});

I know that i select point is larger than 3000,but the selectCell.value.length just 1204 length

image the select plot like above plot

why this happen, was it bug ? Best, hanhuihong

Current Behavior

hope to solve this issue

Expected Behavior

hope to solve this issue and get the real select data

Environment

- OS:
- Browser: chrome 127.0.6533.120
- Framework:

Any additional comments?

No response

helgasoft commented 3 months ago

If you have lots of data, use codepen.io to present a working Minimal Reproduction. brushselected works fine with large selections - Demo