Hi Lazar below is the complete markup:

@*infragistic script files*@

<script type="text/javascript" src="@Url.Content("~/Scripts/Ig/infragistics.loader.js")"></script>

@(Html.Infragistics().Loader()
.ScriptPath(Url.Content("~/Scripts/Ig"))
.CssPath(Url.Content("~/Content/Ig"))
.Render()
)

<script type="text/javascript">
              $(document).ready(function () {
                          $("#spectralChart").igDataChart("option", "brushes", ["#7FFFD4", "#0000FF", "#FF7F24"]);

                 });
</script>

@(Html.Infragistics().DataChart(Model.SpectralChannelData.AsQueryable())
            .ID("spectralChart")
            .Axes((axes) =>
            {
                        axes.NumericX("xAxis").Stroke("Black").StrokeThickness(4).MajorStroke("Whitesmoke");
                        axes.NumericY("yAxis").Stroke("Black").StrokeThickness(4).MajorStroke("Whitesmoke");
             })
            .Series(series =>
            {
                      series.ScatterLine("scatterSeries" + key.ToString(), Model.GroupedSpectralData[key].AsQueryable())
                      .XAxis("xAxis").YAxis("yAxis")

                        .XMemberPath(data => data.SpectralPoint)
                        .YMemberPath(data => data.Wavelength)

             })
              .DataBind()
               .Render()
  )

Please correct me if I am missing on anything.

Hi, sanjaysutar

Your your JS script block executes before any Ignite UI scripts related to data chart are loaded. You have to put your script after the MVC helper code that generates your chart. This way the code generated by the helper will execute and create the chart and then the code that updates the brushes option will execute. For that purpose you also need to modify the code a like the following:

Also, there is actually a Brushes() method in the MVC helper and in your case it will be easier to use that instead of JS code which sets the brushes option. Use the method like this:

Cheers, Lazar

Can I dynamically change the color of single series without using hard coded color in brush: "xxxx" attribute ? have a look 

markerTemplate: {
measure: function (measureInfo) {
....;

}

render: function (renderInfo) {
var ctx = renderInfo.context,
radius;

var data = renderInfo.data;
if (data.item() != null) {
//name = data.item().PlannedOrdrQty.toString();
availCap = data.item().PlannedOrdrQty;
if (availCap > requiredCap) {

//WANT TO SET COLOR OVER HERE
}
else {

//WANT TO SET COLOR OVER HERE
}

.....;
}

},

Thanks Lazar, that works like a charm.