[CLOSED] [#1392] [4.2.0] Mobile.mvc do not support PolarChart?

**hjk1130** · Oct 10, 2016, 9:38 AM

I used Mobile.Mvc like X.PolarChart()
but the Ext.decode(response) been given you're trying to decode an invalid json string:

**fabricio.murta** · Oct 10, 2016, 8:11 PM

Hello @hjk1130!

I don't really see a reason for it not to work in MVC, it must be the way you are writing it in MVC.

But there's the possibility that a given syntax that should work was not properly supported in MVC Razor syntax. Can you provide us a test case showing how you are trying to build the chart? From that we can explore, worst case, at least a work around or another writing line to have it working.

You probably already browsed it, but as far as WebForms is concerned, we have sample pages with them here: Mobile Examples - Polar Charts.

Looking forward for your feedback!

**hjk1130** · Oct 11, 2016, 2:02 AM

my codes :

@{
    var X = Html.X();
}

@(
 X.PolarChart().InnerPadding(10)
    .Store(
        X.Store().ID("StoreZic")
            .ServerProxy(X.AjaxProxy().Url("/api/home/getzicdata"))
            .Model(
                X.Model().Fields(
                    new ModelField("CltZicTyp", ModelFieldType.String),
                    new ModelField("CltZicPer", ModelFieldType.Float)
                )
            )
     )
     .Interactions(
        X.ItemHighlightInteraction(),
        X.RotateInteraction()
     )
     .LegendConfig(X.ChartLegend().Docked(Dock.Right))
     .Series(X.PieSeries()
        .AngleField("CltZicPer").Donut(0)
        .Label(X.ChartLabel().Field("CltZicTyp").FontSize("14").Display(SeriesLabelDisplay.Rotate))
        .HighlightDefaults(X.Sprite().Margin(20))
     )
)

[DirectMethod]
        public ActionResult GetView(string viewName)
        {
            var path = @"~\Views\Home\";
            path = String.Concat(path, viewName, ".cshtml");
            return new Ext.Net.Mobile.MVC.PartialViewResult
            {
                ViewName = path,
                RenderMode = RenderMode.Config
            };
        }

App.direct.GetView(viewName, {
        success: function (response) {
            console.log(response);
            response = Ext.decode(response);
            Ext.net.loadResources(response, function (config) {
                var view = Ext.create(config[0]);
                Ext.Viewport.animateActiveItem(view, {
                    type: "slide",
                    direction: 'left'
                });
            }, this);
        }
        scope: this
    });

finally there is a js error:you're trying to decode an invalid json string.
the response is a invalid json string.

**fabricio.murta** · Oct 11, 2016, 8:59 PM

Hello @hjk1130!

Please provide full example so we can run it in our side.

I've ported the WebForms example to a simple view-only page in MVC and it works fine:


@{
    Layout = null;
    var X = Html.X();

    var n = 5;
    var floor = 20;
    
    List<object> data = new List<object>(n);
    Random random = new Random();
    double p = (random.NextDouble() * 11) + 1;

    for (int i = 0; i < n; i++)
    {
        data.Add(new
        {
            id = i,
            name = (char)('A' + i),
            g0 = Math.Floor(Math.Max(random.NextDouble() * 100, floor)),
            g1 = Math.Floor(Math.Max(random.NextDouble() * 100, floor)),
            g2 = Math.Floor(Math.Max(random.NextDouble() * 100, floor)),
            g3 = Math.Floor(Math.Max(random.NextDouble() * 100, floor)),
            g4 = Math.Floor(Math.Max(random.NextDouble() * 100, floor)),
            g5 = Math.Floor(Math.Max(random.NextDouble() * 100, floor)),
            g6 = Math.Floor(Math.Max(random.NextDouble() * 100, floor)),
        });
    }
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
</head>
<body>
    <div> 
        @Html.X().ResourceManager().ScriptMode(Ext.Net.Mobile.ScriptMode.Debug).SourceFormatting(true)

        @(
            X.PolarChart()
                .InnerPadding(10)
                .FullScreen(true)
                .Store(
                    X.Store().ID("StoreZic")
                        .Data(data)
                        .Fields(
                            new ModelField("id"),
                            new ModelField("g0"),
                            new ModelField("g1"),
                            new ModelField("g2"),
                            new ModelField("g3"),
                            new ModelField("g4"),
                            new ModelField("g5"),
                            new ModelField("g6"),
                            new ModelField("name")
                        )
                 )
                 .Interactions(
                    X.ItemHighlightInteraction(),
                    X.RotateInteraction()
                 )
                 .LegendConfig(X.ChartLegend().Docked(Dock.Right))
                 .Series(X.PieSeries()
                    .AngleField("g1").Donut(30)
                    .Label(
                        X.ChartLabel()
                            .Field("name")
                            .FontSize("14")
                            .Display(SeriesLabelDisplay.Rotate)
                    )
                    .HighlightDefaults(X.Sprite().Margin(20))
                 )
        )
    </div>
</body>
</html>

So, there's something with your model. Additionally, please provide a sample code without layout, much like the one I just provided above. One possibility is a problem with the getzicdata action, it probably is not returning data the way it was meant to. Well, of course, it is possible that it returns correctly and Ext.NET is not handling it correctly. But only way to find out is being able to run the example.

**hjk1130** · Oct 12, 2016, 1:18 AM

yes,I know it runs very well in full example .
But I would like to create dynamic view like your example.
Read 'csthml' by [DirectMethod] GetView.
And create view page by js like this.

     App.direct.GetView(viewName, {
        success: function (response) {
            console.log(response);
            response = Ext.decode(response);
            Ext.net.loadResources(response, function (config) {
                var view = Ext.create(config[0]);
                Ext.Viewport.animateActiveItem(view, {
                    type: "slide",
                    direction: 'left'
                });
            }, this);
        }
        scope: this
    });

it works well in every page,but only in PolarChart View.

**fabricio.murta** · Oct 12, 2016, 11:06 PM

Hello!

Can you draw a simple example out of the approach you are using? I'm not sure how you are calling the direct method at all. Please provide the necessary views, models and controller codes so we can reproduce the error you're seeing in our side. Then we'll be able to provide you a good advice on how to solve the issue.

Thread: [CLOSED] [#1392] [4.2.0] Mobile.mvc do not support PolarChart?

Thread Tools

Search Thread

Display

Hybrid View

[CLOSED] [#1392] [4.2.0] Mobile.mvc do not support PolarChart?

There is not any Chart Examples in http://mvc.mobile.ext.net/

My problem is that PolarChart can not be created through by function "Ext.Net.Mobile.Mvc.PartialViewResult" in Controlers

Similar Threads

[FIXED] [#1272] [3.3.0] PolarChart(with Pie3DSeries) Label, LegendConfig Issue

[CLOSED] Passing PolarChart Id to Tip Render Function

[CLOSED] How Can I modify the lengendconfig font label, in the polarchart ?

[CLOSED] How Can I get a center polarchart inside a panel?

[CLOSED] Center Polarchart in panel

Posting Permissions

Sitemap

Downloads

Resources

Thread: [CLOSED] [#1392] [4.2.0] Mobile.mvc do not support PolarChart?

Hybrid View

[CLOSED] [#1392] [4.2.0] Mobile.mvc do not support PolarChart?

There is not any Chart Examples in http://mvc.mobile.ext.net/

My problem is that PolarChart can not be created through by function "Ext.Net.Mobile.Mvc.PartialViewResult" in Controlers

Similar Threads

Posting Permissions

Sitemap

Downloads

Resources

Stay connected with us