Hi Developer Community,

Can you please help me? I am playing around with the Visualforce Charting functionality that is in pilot.

I am having some unexpected behavior with the "font" attribute of the "apex:legend" component.

Indeed, in the example below, while I specify that the legend should have a font size of 9px, the chart that is rendered in my browsers has a legend that is bigger than 9px.

I observed the same beavihor in my Mozilla, IE, and Chrome browsers.

Would you have an idea why this is happening? If not, maybe you have a workaround to display my legend in a smaller font?

Thanks in advance,

Matt Remy

<apex:chart id="mychart" height="400" width="600" data="{!data}" legend="true">
              

 <apex:legend position="bottom" font="9px Helvetica"/>
            
                <apex:axis type="Numeric" position="left" fields="data1,data2,data3" title="Y Axis Title" grid="true">
                    <apex:chartLabel font="9px Helvetica, sans-serif"/>
                </apex:axis>


                <apex:axis type="Category" position="bottom" fields="name" title="X Axis Title">
                    <apex:chartLabel rotate="270" font="9px Helvetica, sans-serif"/>
                </apex:axis>
                
                <apex:lineSeries id="lineseries1" title="Line 1 Title" axis="left" xField="name" yField="data3" markerType="circle" markerSize="4" markerFill="#92D400" showInLegend="true">
                    <apex:chartLabel font="9px Helvetica, sans-serif"/>
                </apex:lineSeries>
            </apex:chart>

Hi Developer Community,

Can you please help me? I am playing around with the Visualforce Charting functionality that is in pilot.

I am having some unexpected behavior with the "font" attribute of the "apex:legend" component.

Indeed, in the example below, while I specify that the legend should have a font size of 9px, the chart that is rendered in my browsers has a legend that is bigger than 9px.

I observed the same beavihor in my Mozilla, IE, and Chrome browsers.

Would you have an idea why this is happening? If not, maybe you have a workaround to display my legend in a smaller font?

Thanks in advance,

Matt Remy

<apex:chart id="mychart" height="400" width="600" data="{!data}" legend="true">
              

 <apex:legend position="bottom" font="9px Helvetica"/>
            
                <apex:axis type="Numeric" position="left" fields="data1,data2,data3" title="Y Axis Title" grid="true">
                    <apex:chartLabel font="9px Helvetica, sans-serif"/>
                </apex:axis>


                <apex:axis type="Category" position="bottom" fields="name" title="X Axis Title">
                    <apex:chartLabel rotate="270" font="9px Helvetica, sans-serif"/>
                </apex:axis>
                
                <apex:lineSeries id="lineseries1" title="Line 1 Title" axis="left" xField="name" yField="data3" markerType="circle" markerSize="4" markerFill="#92D400" showInLegend="true">
                    <apex:chartLabel font="9px Helvetica, sans-serif"/>
                </apex:lineSeries>
            </apex:chart>

How we'll use Custom label in apex code in which we'll  take the label name dynamically???