Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Chart does not redraw after adding a new series #255

Open
hnabih opened this issue Aug 26, 2018 · 0 comments
Open

Chart does not redraw after adding a new series #255

hnabih opened this issue Aug 26, 2018 · 0 comments

Comments

@hnabih
Copy link

hnabih commented Aug 26, 2018

First, thank you for developing this library, very useful.
My project is MVC 5, I am using the following to generate a chart with multiple series:
HTML:

<button data-bind="click: addItem">Add</button>
<button data-bind="click: removeItem">Remove</button>
 <div data-bind="kendoChart2: { title: { text: 'Graph Sample' }, 
series: seriesConfig,tooltip: {visible: true,template: '#= series.name #: #= value #'} , seriesDefaults: {
                        type: 'line',style: 'smooth'}}"> </div>

JavaScript:

var MainViewModel = function () {
        var self = this;
        this.Systolic = ko.observableArray([]);
        this.Diastolic = ko.observableArray([]);
        this.HeartRate= ko.observableArray([]);
        $.ajax({
            type: "GET",
            url: '/Charts/GetChart',
            contentType: "application/json; charset=utf-8",
            async: false,
            cache: false,
            dataType: "json",
            success: function (result) {
                //Diastolic
                if (result && result.Systolic.length > 0) {
                    for (var i = 0; i < result.Systolic.length; i++) {
                        self.Systolic.push(result.Systolic[i].Systolic);
                    }
                };
               ....
            },
            error: function (err) {
                    alert(err.status + " : " + err.statusText);
             }});

    this.seriesConfig = ko.observableArray([
                {name: "Systolic", data: this.Systolic()},
                {name: "Diastolic",data: this.Diastolic()}]);
    this.addItem = function() {
    this.seriesConfig.push({ name: "Heart Rate", data: this.HeartRate() });
                };
     this.removeItem = function() {
     this.seriesConfig.remove({ name: "Diastolic", data: this.Diastolic() });
        };
        }.bind(this);
      ko.kendo.bindingFactory.createBinding(
{
    name: "kendoChart",
    bindingName: "kendoChart2",
    watch: {
      data: function(value) {
          ko.kendo.setDataSource(this, value);
      },
      series: function(value) {
           this._sourceSeries = value;
           this.refresh();
           this.redraw();}            
    }
});
        window.viewModel = new MainViewModel();
        ko.applyBindings(window.viewModel);

The chart works great, however can't add or remove series?

Note: the addItem works, I get the value of the new series:

series: function (value) {
        alert(value[2].name);
        this.seriesConfig = value;
        this.refresh();
        this.redraw();
      } 

also tried load all series then use the following hide a series:

$("#kendoChart").getKendoChart().options.series[1].visible = false;
$("#kendoChart").getKendoChart().redraw();

Does not work, I think the chart name does not register.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant