Syncfusion Blazor BarChart with LineChart

问题描述

我正在使用 Syncfusion Blazor 条形图。我得到了以下要求,即使用线条对条形图进行杵状指。有没有办法做到这一点?有线索吗?

enter image description here

解决方法

我们想让您知道,我们可以使用图表组件中的列系列和线系列来实现您的要求(基于屏幕截图)。我们还准备了一个样本供您参考。请在下面找到示例链接、代码片段和屏幕截图。

示例链接: https://www.syncfusion.com/downloads/support/directtrac/general/ze/ColumnLineSeries1543449603.zip

代码片段:

<SfChart Title="Hyaat Place Cedar Park 17-4-006" >
    <ChartEvents OnAxisLabelRender="AxisLabelRender"></ChartEvents>
    <ChartPrimaryXAxis ValueType="Syncfusion.Blazor.Charts.ValueType.Category" Interval="1">
        <ChartAxisLabelStyle Color="transparent"></ChartAxisLabelStyle>
        <ChartAxisLineStyle Width="0"></ChartAxisLineStyle>
        <ChartAxisMajorTickLines Width="0"></ChartAxisMajorTickLines>
        <ChartAxisMajorGridLines Width="0"></ChartAxisMajorGridLines>
    </ChartPrimaryXAxis>
    <ChartPrimaryYAxis >
        <ChartAxisLineStyle Width="0"></ChartAxisLineStyle>
        <ChartAxisMajorTickLines Width="0"></ChartAxisMajorTickLines>
    </ChartPrimaryYAxis>
    <ChartSeriesCollection>
        <ChartSeries DataSource="@ChartPoints" Fill="#3864c6" XName="Country" YName="GoldMedal" Type="ChartSeriesType.Column">
        </ChartSeries>
        <ChartSeries DataSource="@ChartPoints"  Fill="#85dba0" XName="Country" YName="SilverMedal" Type="ChartSeriesType.Column">
        </ChartSeries>
        <ChartSeries DataSource="@ChartPoints" Fill="#837fca" Width="3" XName="Country" YName="BronzeMedal" Type="ChartSeriesType.Line">
            <ChartMarker Visible="true" Width="5" Height="5" Fill="#837fca">
            </ChartMarker>
        </ChartSeries>
    </ChartSeriesCollection>
    <ChartTooltipSettings Enable="true"></ChartTooltipSettings>
</SfChart>

// add your additional code here

public void AxisLabelRender(AxisLabelRenderEventArgs args)
    {
        if (args.Axis.Name == "PrimaryYAxis")
        {
            args.Text = "$"+ Convert.ToDouble(args.Text).ToString("N0");
        }
    }

屏幕截图: enter image description here

如果您需要任何进一步的帮助,请告诉我们。

问候, 斯里哈里M

相关问答

错误1:Request method ‘DELETE‘ not supported 错误还原:...
错误1:启动docker镜像时报错:Error response from daemon:...
错误1:private field ‘xxx‘ is never assigned 按Alt...
报错如下,通过源不能下载,最后警告pip需升级版本 Requirem...