Selecting WatchList/Chart Series with a Button

ristola

I have a WatchList Chart with (6) Axis on the chart legend.
Is it possible to create a Button to Select Certain Series instead of manually clicking on the each axis to enable / disable ?

I would like to create a couple buttons to quickly group a few different axis points to quick view

MattFox

I remember asking myself a similar question last year, Stack Overflow is a dev's best friend when it comes to minor/extra functionality to extend what already exists.

I did something to toggle a entire graph rather than using the legends so that it actually disappeared from the serial chart view but could still be turned back on again.

You can rejig this to look through an array of title 'names' then just toggle them with a click of a button.
Prob shouldn't use the $scope for this but I want to believe that since it's only called when the ma-button is clicked all is fine...

// works for a single chart, goes by a name in a graph's title
$scope.toggleChart = function(titleTerm)
{
	try
	{
		var allCharts = AmCharts.charts; //get all charts
		for (var i = 0; i < allCharts.length; i++)  //simply put this loop inside another to iterate through multiple chart names
                {
			if(allCharts[ i].graphs.length>1)
			{			
				for(var graph=0; graph<allCharts[ i ].graphs.length;graph++)
				{
//use string,indexOf() to see if the title name is in the chart.
					if (  allCharts[ i ].graphs[ graph ].hidden && allCharts[ i ].graphs[ graph ].title.indexOf(titleTerm)>-1 ){
							   allCharts[ i ].showGraph( allCharts[ i ].graphs[ graph ] );
							   break;
					}
					if ( allCharts[ i ].graphs[ graph ].title.indexOf(titleTerm)>-1 ){
						allCharts[ i ].hideGraph( allCharts[ i ].graphs[ graph ] );	break;}		
					}
				}
			}
		}
		catch(e){console.log(e);}
	};

Then to use it on the template page:

<!--  swap out 'chartTitle' with ['chat1','char2','etc']  then loop inside controller function-->
<md-button  id="" ng-click="toggleChart('chartTitle')" aria-label="Toggle Chart" >				
				  Toggle Chart
				  <md-icon md-menu-align-target style="margin: auto 3px auto 0;"><i class="material-icons">wb_cloudy</i></md-icon>				
			</md-button>

Hope this gets you started in the right direction!

ristola

Thanks MattFox for the reply,
I guess I was looking for a enable / disable function, but just wasn't finding what i needed.

This approach looks like i maybe able to achieve a similar approach.
I will give it a twirl...

MattFox

Happy to help.
Feel free to ask more questions if you get stuck, some of your code would be good to see too if you do require further assistance.