slowkow opened a new issue #8146: scatter with multiple series in legend using 
dataset and series.encode.seriesName
URL: https://github.com/apache/incubator-echarts/issues/8146
 
 
   ### One-line summary [问题简述]
   
   `series.encode.seriesName` does not work as expected.
   
   In the example below, the legend should have 4 series, not 1.
   
   ### Version & Environment [版本及环境]
   + ECharts version [ECharts 版本]: 4.0.4
   + Browser version [浏览器类型和版本]: Chrome 65.0.3325.181
   + OS Version [操作系统类型和版本]: macOS 10.13.3
   
   ### Expected behaviour [期望结果]
   
   https://jsfiddle.net/slowkow/avrqy1ua/3/
   
   Legend should have 4 series:
   
   
![data](https://user-images.githubusercontent.com/209714/38698746-19d59fb2-3e64-11e8-91ba-09fb77620fa0.png)
   
   ```html
   <!DOCTYPE html>
   <html>
   <head>
       <meta charset="utf-8">
       <title>ECharts</title>
       <!-- including ECharts file -->
       <script src="echarts.js"></script>
   </head>
   <body>
       <!-- prepare a DOM container with width and height -->
       <div id="main" style="width: 600px;height:400px;"></div>
       <script type="text/javascript">
           // based on prepared DOM, initialize echarts instance
           var myChart = echarts.init(document.getElementById('main'));
   
           var rnaseq = [
             
["T1","T1_all","T2","T2_all","cell_name","cluster","disease","marker"],
             [-13.75,-1.6,-19.57,13.45,"S006_L1Q1_M01","F-4","OA",0],
             [-8.59,0.88,-15.55,14.14,"S006_L1Q1_M03","F-4","OA",0],
             [13.17,-11.68,-12.36,12.78,"S006_L1Q1_M05","F-3","OA",0],
             [-13.78,-1.78,-18.39,13.33,"S006_L1Q1_M07","F-4","OA",0],
             [-10.71,-7.66,10.07,6.37,"S006_L1Q1_M09","F-2","OA",9.72],
             [-14.41,-2.84,-20.9,15.12,"S006_L1Q1_M11","F-4","OA",0],
             [-12.4,-1.35,-17.92,13.4,"S006_L1Q1_M13","F-4","OA",0],
             [-4.4,-7.19,-9.18,5.3,"S006_L1Q1_M15","F-1","OA",0],
             [-13.12,-1.94,-17.79,13.35,"S006_L1Q1_M17","F-4","OA",0]
           ];
           
           // mat is an array of rows
           // x is the offset for the x-axis column
           // y is the offset for the y-axis column
           // by is the offset for the grouping column
           //   0    1        2    3        4           5         6         7 
           // 
["T1","T1_all","T2","T2_all","cell_name","cluster","disease","marker"],
           function mat_to_option(mat, x = 1, y = 3, by = 5) {
             var option = {
               title: {
                 left: 100,
                 text: 'tSNE'
               },
               legend: {
                 data: []
               },
               xAxis: {},
               yAxis: {},
               series: []
             }
             var key_to_index = {}
             var by_index = 0
             for (var i = 0; i < mat.length; i++) {
               var row = mat[i]
               var key = row[by]
               if (!(key in key_to_index)) {
                 key_to_index[key] = by_index
                 by_index += 1
                 option.series.push({
                   name: key,
                   data: [],
                   type: 'scatter'
                 })
                 option.legend.data.push(key)
               }
               var index = key_to_index[key]
               option.series[index].data.push([row[x], row[y], row[4]])
             }
             return option
           }
   
           var rnaseq_option = mat_to_option(rnaseq.slice(1, 10))
   
           myChart.setOption(rnaseq_option);
       </script>
   </body>
   </html>
   ```
   
   ### Observed behavior
   
   https://jsfiddle.net/slowkow/avrqy1ua/2/
   
   Legend has 1 series:
   
   
![dataset](https://user-images.githubusercontent.com/209714/38698757-1fc7e48e-3e64-11e8-81a9-1ea109b94f5e.png)
   
   ```html
   <!DOCTYPE html>
   <html>
   <head>
       <meta charset="utf-8">
       <script src="echarts.js"></script>
   </head>
   <body>
       <div id="main" style="width: 600px;height:400px;"></div>
       <script type="text/javascript">
           var myChart = echarts.init(document.getElementById('main'));
   
           var rnaseq = [
             
["T1","T1_all","T2","T2_all","cell_name","cluster","disease","marker"],
             [-13.75,-1.6,-19.57,13.45,"S006_L1Q1_M01","F-4","OA",0],
             [-8.59,0.88,-15.55,14.14,"S006_L1Q1_M03","F-4","OA",0],
             [13.17,-11.68,-12.36,12.78,"S006_L1Q1_M05","F-3","OA",0],
             [-13.78,-1.78,-18.39,13.33,"S006_L1Q1_M07","F-4","OA",0],
             [-10.71,-7.66,10.07,6.37,"S006_L1Q1_M09","F-2","OA",9.72],
             [-14.41,-2.84,-20.9,15.12,"S006_L1Q1_M11","F-4","OA",0],
             [-12.4,-1.35,-17.92,13.4,"S006_L1Q1_M13","F-4","OA",0],
             [-4.4,-7.19,-9.18,5.3,"S006_L1Q1_M15","F-1","OA",0],
             [-13.12,-1.94,-17.79,13.35,"S006_L1Q1_M17","F-4","OA",0]
           ];
   
           var option = {
             title: {
               left: 100,
               text: 'tSNE'
             },
             legend: {},
             tooltip: {},
             dataset: {
               source: rnaseq
             },
             xAxis: {},
             yAxis: {},
             series: {
               type: 'scatter',
               encode: {
                 x: 'T1_all',
                 y: 'T2_all',
                 // *** seriesName does not work as expected ***
                 seriesName: 'cluster',
                 itemId: 'cell_name',
                 tooltip: ['cell_name', 'cluster', 'disease']
               }
             }
           }
   
           myChart.setOption(option);
       </script>
   </body>
   </html>
   ```

----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on GitHub and use the
URL above to go to the specific comment.
 
For queries about this service, please contact Infrastructure at:
us...@infra.apache.org


With regards,
Apache Git Services

---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscr...@echarts.apache.org
For additional commands, e-mail: dev-h...@echarts.apache.org

Reply via email to