Javascript FileContentResult未在视图中显示图像

Javascript FileContentResult未在视图中显示图像,javascript,jquery,asp.net-mvc,asp.net-mvc-4,Javascript,Jquery,Asp.net Mvc,Asp.net Mvc 4,我有一个控制器,当调用它时,它会创建一个filecontentresult,但是当我尝试将它设置为图像源时,图像不会显示。我曾经使用firebug进行调试,看到一些东西返回到视图中,但它似乎认为它是无效的 控制器 [HttpPost] public ActionResult BespokeAnalysis(MemberModel model) { if (ModelState.IsValid) { var CostVa

我有一个控制器,当调用它时,它会创建一个filecontentresult,但是当我尝试将它设置为图像源时,图像不会显示。我曾经使用firebug进行调试,看到一些东西返回到视图中,但它似乎认为它是无效的

控制器

  [HttpPost]
    public ActionResult BespokeAnalysis(MemberModel model)
    {

        if (ModelState.IsValid)
        {
            var CostVariations = CostVariationRepository.GetAll();
            if (model.SelectedYears != null && model.SelectedTypes != null && model.SelectedCostTypes != null)
            {
                var variations = CostVariations.Where(m => model.SelectedYears.Contains(m.Year));
                variationresults = variations.Where(m => model.SelectedTypes.Contains(m.CategoryId)).ToList();
                selectedtypes = model.SelectedCostTypes.ToList();

            }
        }

return Json(new { chartUrl = Url.Action("CreateChart", "Member", new { chartType = SeriesChartType.Column, selectedtypes = selectedtypes, variationresults = variationresults }) });
    }
剧本:

  $(function () {
        $('form').submit(function () {

                $.ajax({
                    url: this.action,
                    type: this.method,
                    data: $(this).serialize(),
                    success: function (result) { 

                      $('#result').html(
                            $('<img/>', {
                                src: result.chartUrl,
                                alt: 'this is a super chart'
                            })
                        );

                    }
                });
                return false;

        });
    });
$(函数(){
$('form')。提交(函数(){
$.ajax({
url:this.action,
类型:this.method,
数据:$(this).serialize(),
成功:函数(结果){
$('#result').html(
$('
观点:


@使用(Html.BeginForm())
{
挑选
@CheckBoxListFor(model=>model.SelectedSectors,新的MultiSelectList(model.Sectors,“Id”,“Name”,model.SelectedSectors))
}
方法返回ActionResult

    public ActionResult CreateChart(SeriesChartType chartType)
    {
        Chart chart = new Chart();
        chart.Width = 700;
        chart.Height = 400;
        chart.BackColor = Color.FromArgb(211, 223, 240);
        chart.BorderlineDashStyle = ChartDashStyle.Solid;
        chart.BackSecondaryColor = Color.White;
        chart.BackGradientStyle = GradientStyle.TopBottom;
        chart.BorderlineWidth = 1;
        chart.Palette = ChartColorPalette.BrightPastel;
        chart.BorderlineColor = Color.FromArgb(26, 59, 105);
        chart.RenderType = RenderType.BinaryStreaming;
        chart.BorderSkin.SkinStyle = BorderSkinStyle.Emboss;
        chart.AntiAliasing = AntiAliasingStyles.All;
        chart.TextAntiAliasingQuality = TextAntiAliasingQuality.Normal;



        foreach (var type in selectedtypes)
        {
            switch (type)
            {
                case 1:
                    foreach (var result in variationresults)
                    {
                        Dictionary<string, double> retVal = new Dictionary<string, double>();
                        retVal.Add("Stuff1", Math.Round(result.Stuff1, 3, MidpointRounding.ToEven));
                        chart.Series.Add(CreateSeries(retVal, result.Description + type, Color.Lavender, chartType));
                    }
                    break;
                case 2:
                    foreach (var result in variationresults)
                    {
                        Dictionary<string, double> retVal = new Dictionary<string, double>();
                        retVal.Add("Stuff2", Math.Round(result.Stuff2, 3, MidpointRounding.ToEven));
                        chart.Series.Add(CreateSeries(retVal, result.Description + type, Color.Aqua, chartType));
                    }
                    break;
                case 3:
                    foreach (var result in variationresults)
                    {
                        Dictionary<string, double> retVal = new Dictionary<string, double>();
                        retVal.Add("Stuff3", Math.Round(result.Stuff3, 3, MidpointRounding.ToEven));
                        chart.Series.Add(CreateSeries(retVal, result.Description + type, Color.Azure, chartType));
                    }
                    break;
                case 4:
                    foreach (var result in variationresults)
                    {
                        Dictionary<string, double> retVal = new Dictionary<string, double>();
                        retVal.Add("Stuff4", Math.Round(result.Stuff4, 3, MidpointRounding.ToEven));
                        chart.Series.Add(CreateSeries(retVal, result.Description + type, Color.Bisque, chartType));
                    }
                    break;
                    default:
                    foreach (var result in variationresults)
                    {
                        Dictionary<string, double> retVal = new Dictionary<string, double>();
                        retVal.Add("Crew Other", Math.Round(result.Crew_Other, 3, MidpointRounding.ToEven));
                        chart.Series.Add(CreateSeries(retVal, result.Description + type, Color.Lavender, chartType));
                    }
                    break;
            }


        }

        chart.ChartAreas.Add(CreateChartArea());

        using (var ms = new MemoryStream())
       {
           chart.SaveImage(ms, ChartImageFormat.Png);
           ms.Seek(0, SeekOrigin.Begin);

           return File(ms.ToArray(), "image/png", "Variations.png");
       }                      
    }
public ActionResult CreateChart(serieChartType chartType)
{
图表=新图表();
图表宽度=700;
图表高度=400;
chart.BackColor=Color.FromArgb(211223240);
chart.BorderlineDashStyle=ChartDashStyle.Solid;
chart.BackSecondaryColor=Color.White;
chart.BackGradientStyle=GradientStyle.TopBottom;
chart.BorderlineWidth=1;
chart.palete=ChartColorPalette.BrightPastel;
chart.BorderlineColor=Color.FromArgb(26,59,105);
chart.RenderType=RenderType.BinaryStreaming;
chart.BorderSkin.SkinStyle=BorderSkinStyle.Emboss;
chart.antialasing=antialasingstyles.All;
chart.TextAntiAliasingQuality=TextAntiAliasingQuality.Normal;
foreach(选定类型中的变量类型)
{
开关(类型)
{
案例1:
foreach(变量结果中的var结果)
{
Dictionary retVal=新字典();
retVal.Add(“Stuff1”,Math.Round(result.Stuff1,3,middpointrounding.ToEven));
chart.Series.Add(CreateSeries(retVal,result.Description+type,Color.Lavender,chartType));
}
打破
案例2:
foreach(变量结果中的var结果)
{
Dictionary retVal=新字典();
retVal.Add(“Stuff2”,Math.Round(result.Stuff2,3,middpointrounding.ToEven));
chart.Series.Add(CreateSeries(retVal,result.Description+type,Color.Aqua,chartType));
}
打破
案例3:
foreach(变量结果中的var结果)
{
Dictionary retVal=新字典();
retVal.Add(“Stuff3”,Math.Round(result.Stuff3,3,middpointrounding.ToEven));
chart.Series.Add(CreateSeries(retVal,result.Description+type,Color.Azure,chartType));
}
打破
案例4:
foreach(变量结果中的var结果)
{
Dictionary retVal=新字典();
retVal.Add(“Stuff4”,Math.Round(result.Stuff4,3,middpointrounding.ToEven));
chart.Series.Add(CreateSeries(retVal,result.Description+type,Color.Bisque,chartType));
}
打破
违约:
foreach(变量结果中的var结果)
{
Dictionary retVal=新字典();
retVal.Add(“Crew-Other”,Math.Round(result.Crew_-Other,3,middpointrounding.ToEven));
chart.Series.Add(CreateSeries(retVal,result.Description+type,Color.Lavender,chartType));
}
打破
}
}
添加(CreateChartArea());
使用(var ms=new MemoryStream())
{
SaveImage(ms,chartmageformat.Png);
Seek女士(0,SeekOrigin.Begin);
返回文件(ms.ToArray(),“image/png”,“Variations.png”);
}                      
}

任何帮助都将不胜感激。

您的问题中有太多不必要的杂音。我将尝试简化问题,并举例说明如何使用此图表类

首先,我将编写一个定制的ActionResult,将图表呈现给响应,而不是使用一些难看的MemoryStream(在将其传递给
FileResult
类之前,您正在处理这些内存流,也不会在开始时移动它们):

接下来我们可以有一个控制器:

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View();
    }

    [HttpPost]
    public ActionResult GetChartUrl()
    {
        return Json(new { chartUrl = Url.Action("Chart") });
    }

    [OutputCache(Duration = 0, Location = OutputCacheLocation.None)]
    public ActionResult Chart()
    {
        var chart = BuildChart();
        return new ChartResult(chart);
    }

    private Chart BuildChart()
    {
        Chart chart = new Chart();
        chart.Width = 700;
        chart.Height = 400;

        var series = new Series("Some stuff")
        {
            ChartType = SeriesChartType.Line,
            ChartArea = "MyArea"
        };
        for (int i = 0; i < 100; i++)
        {
            series.Points.AddXY(i, 3 * i);
        }
        chart.Series.Add(series);
        chart.ChartAreas.Add("MyArea");
        return chart;
    }
}
公共类HomeController:控制器
{
公共行动结果索引()
{
返回视图();
}
[HttpPost]
公共操作结果GetChartUrl()
{
返回Json(新的{chartUrl=Url.Action(“Chart”)});
}
[OutputCache(持续时间=0,位置=OutputCacheLocation.None)]
公共行动结果表()
{
var chart=BuildChart();
返回新的ChartResult(图表);
}
私有图表BuildChart()
{
图表=新图表();
图表宽度=700;
图表高度=400;
var系列=新系列(“一些东西”)
{
ChartType=SerieChartType.Line,
ChartArea=“MyArea”
};
对于(int i=0;i<100;i++)
{
系列点AddXY(i,3*i);
}
图表.系列.添加(系列);
图表。图表区域。添加(“MyArea”);
收益表;
}
}
public class ChartResult : ActionResult
{
    private readonly Chart chart;
    public ChartResult(Chart chart)
    {
        this.chart = chart;
    }

    public override void ExecuteResult(ControllerContext context)
    {
        var httpContext = context.RequestContext.HttpContext;
        var response = httpContext.Response;
        response.ContentType = "image/png";
        chart.SaveImage(response.OutputStream, ChartImageFormat.Png);
    }
}
public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View();
    }

    [HttpPost]
    public ActionResult GetChartUrl()
    {
        return Json(new { chartUrl = Url.Action("Chart") });
    }

    [OutputCache(Duration = 0, Location = OutputCacheLocation.None)]
    public ActionResult Chart()
    {
        var chart = BuildChart();
        return new ChartResult(chart);
    }

    private Chart BuildChart()
    {
        Chart chart = new Chart();
        chart.Width = 700;
        chart.Height = 400;

        var series = new Series("Some stuff")
        {
            ChartType = SeriesChartType.Line,
            ChartArea = "MyArea"
        };
        for (int i = 0; i < 100; i++)
        {
            series.Points.AddXY(i, 3 * i);
        }
        chart.Series.Add(series);
        chart.ChartAreas.Add("MyArea");
        return chart;
    }
}
@using (Html.BeginForm("GetChartUrl", null))
{
    <button type="submit">Submit this form using AJAX and show chart dynamically</button>
}

<script type="text/javascript">
    $('form').submit(function () {
        $.ajax({
            url: this.action,
            type: this.method,
            data: $(this).serialize(),
            success: function (result) {
                $('#image').html(
                    $('<img/>', {
                        src: result.chartUrl,
                        alt: 'this is a super chart'
                    })
                );
            }
        });
        return false;
    });
</script>

<div id="image"></div>