Home Forums Chart Support Adjust the priority of the data points displayed in the scatter plot

Adjust the priority of the data points displayed in the scatter plot

Viewing 3 posts - 1 through 3 (of 3 total)
  • #42147

    For example, there are two pieces of data in the scatter diagram, there will be two legends, and the same points overlap in the two pieces of data. Now I want to implement hover to legend to improve the level of highlighting of the whole data

    #42167

    @weijian-zhu2,

    With the help of itemouseover and itemmouseout event handler of legend, you can highlight the dataseries of the respective hovered legend. Please take a look at this code-snippet below for the same.

    
    itemmouseover: function(e){
      for(var i=0; i<e.chart.data.length; i++) {
    
        if(i != e.dataSeriesIndex)
          e.chart.options.data[i].fillOpacity = 0;
      }
      e.chart.render();
    },
    itemmouseout: function(e){
      for(var i=0; i<e.chart.data.length; i++) {
        if(i != e.dataSeriesIndex)
          e.chart.options.data[i].fillOpacity = null;
      }
      e.chart.render();
    }

    Also, check out this JSFiddle for complete working code.

    Decrease opacity of other dataseries on hovering legend

    —-
    Manoj Mohan
    Team CanvasJS

    #42218

    Thanks

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.