<ViewData>
      <FieldRef Name="MatterRagStatus" />
    </ViewData>

<ViewFields>
    <FieldRef Name="MatterIndicator" />
</ViewFields>

<Field ID="{A5AE3A8A-E42A-4A87-9D7F-09E104FED180}"
     Name="MatterIndicator"
     StaticName="MatterIndicator"
     DisplayName="Indicator"
     Description="The column calculate matter status"
     Type="Text"
     ShowInEditForm="FALSE"
     ShowInNewForm="FALSE"
     ShowInListSettings="FALSE"
     Overwrite="TRUE"
     JSLink="~site/Scripts/MatterIndicator.js"
     Group="Evershed Site Columns">
<Default>•</Default>

(function () {
var hiddenFiledContext = {};
hiddenFiledContext.Templates = {};
hiddenFiledContext.Templates.Fields = {
    "MatterIndicator": {
        "View": IndicatorOverrideFun,
        "DisplayForm": IndicatorOverrideFun,
        "EditForm": IndicatorOverrideFun,
        "NewForm": IndicatorOverrideFun
        },
};
SPClientTemplates.TemplateManager.RegisterTemplateOverrides(hiddenFiledContext);})();
function IndicatorOverrideFun(ctx) {
try {
    if (ctx.CurrentItem.MatterRagStatus == "1-Red")
        return "<span style='font-size: 300%; line-height: 10%;color: #FF0000;'>•</span>";
    else if (ctx.CurrentItem.MatterRagStatus == "2-Amber")
        return "<span style='font-size: 300%; line-height: 10%;color: #FFBF00;'>•</span>";
    else
        return "<span style='font-size: 300%; line-height: 10%;color: #00FF00;'>•</span>";
} catch (e) {
    console.log(e);
    return "";
}
}