Search code examples
javascriptdom-eventsmapsmschart

Mouseover preview for bar instead of datapoint in StackedColumn chart


I have a StackedColumn chart which I'd like to add a mouseover preview. Currently I'm looping through the points of a series to add the the functionality to do this.

This makes each series in the column will do a mouseover/mouseout. I'd like it to do a single mouseover/mouseout for the column. Suggestions?


Solution

  • Ok, not a popular question.

    I stumbled across the CustomizeMapAreas event. In there I looped through the e.MapAreaItems and adjusted the size of the areas so that there was just one area for the entire column. Then I removed the areas I didn't need anymore. It's probably not the most efficient way to do it, but here it is...

    protected void FixStackedColumnAreas(object sender, CustomizeMapAreasEventArgs e)
    {
        Dictionary<float, MapArea> newAreas = new Dictionary<float, MapArea>();
    
        //loop through all areas and collect the Min and Max Y values for each X 
        foreach (MapArea area in e.MapAreaItems)
        {
            if (!newAreas.ContainsKey(area.Coordinates[0]))
            {
                newAreas.Add(area.Coordinates[0], area);
            }
            else
            {
                //get the lowest and highest Y for this X column area
                newAreas[area.Coordinates[0]].Coordinates[1] = Math.Min(newAreas[area.Coordinates[0]].Coordinates[1], area.Coordinates[1]);
                newAreas[area.Coordinates[0]].Coordinates[3] = Math.Max(newAreas[area.Coordinates[0]].Coordinates[3], area.Coordinates[3]);
            }
        }
    
        //clear out existing areas
        e.MapAreaItems.Clear();
    
        //put in our new areas that define the whole column area instead of the individual pieces of the column
        foreach (MapArea area in newAreas.Values)
        {
            e.MapAreaItems.Add(area);
        }
    }