How to apply SVG and font filters to amcharts4?

问题

I am trying to apply filters to my JS object, where <%=strKey%> is a dynamically scripted object name, so, each iteration, the name changes.

        // dynamically writing JS - key value is the chart name
        var <%=strKey%> = am4core.create("<%=strKey%>", am4charts.GaugeChart);      // has to mach the HTML IDs
        <%=strKey%>.innerRadius = am4core.percent(82);    // innerRadius begins at 82%, leaving white-space inside the gauge

The documentation lists JSON format only. How would I apply this to my implementation?

I'm actually trying to get a shadow to appear under the semi-circular gauge. Suggestions please?

回答1:

You can just use a DropShadowFilter to add a shadow to your chart:

chart.filters.push(new am4core.DropShadowFilter());

You can use blur, dx and dy to customize the shadow:

var shadow = new am4core.DropShadowFilter();
shadow.blur = 3.5;
shadow.dx = 5;
shadow.dy = 7;
chart.filters.push(shadow);

Here is a code pen showing that shadow. To create a custom SVG filter you can follow this official tutorial.

来源：https://stackoverflow.com/questions/55197354/how-to-apply-svg-and-font-filters-to-amcharts4