Results 1 to 2 of 2

Thread: Slider with Chart control

  1. #1
    Sencha User
    Join Date
    Oct 2015
    Posts
    15

    Default Slider with Chart control

    Is there any way we can have slider with chart(i.e bar chart or line chart)?. While changing the slider(assuming multi Slider with min and max) the graph has to be changed.

    For Example https://developers.google.com/chart/...llery/controls
    Last edited by 2mailpks; 7 Nov 2016 at 4:32 AM. Reason: Adding Reference Example

  2. #2
    Sencha User
    Join Date
    Sep 2014
    Location
    Central Europe
    Posts
    795
    Answers
    103

    Default

    Hi

    What you need is to just change the data in your store and your chart will be render the changes.

    Here are the code snippets:
    Code:
    xtype: 'panel',border: true,
    items: [{
        // this is select field for selecting the store data field
        xtype: 'selectfield',
        reference: 'dataSelectField',
        itemId: 'dataSelectFieldId',
        label: 'Select data',
        displayField: 'category',
        store: 'ChartStore', //the store which is used in Chart
        listeners: {
            change: 'onDataSelectFieldIdChange'
        }
    }, {
        // this is the slider 
        xtype: 'sliderfield',
        reference: 'dataSliderRef',
        label: 'Value',
        liveUpdate: true,
        maxValue: 800,
        listeners: {
            change: 'onSliderfieldChange'
        }
    }
    
    // Here are the controller functions:
    
    onDataSelectFieldIdChange: function(selectfield, newValue, oldValue, eOpts) {
        var slider= this.lookupReference('dataSliderRef');
        slider.setValue(newValue.get('numeric'));
    },
    
    
    onSliderfieldChange: function(me, newValue, oldValue, eOpts) {
        var actualModel = this.lookupReference('dataSelectField').getSelection();
        actualModel.set('numeric',newValue);
    },
    ]
    In action: http://recordit.co/3ly1iF1GcG
    Of course there is multiple ways how to do it.

Similar Threads

  1. GXT 3.0 slider control issue.
    By bluemartini in forum Sencha GXT Bugs
    Replies: 2
    Last Post: 12 Feb 2016, 3:05 AM
  2. I need a mouseup even in slider control
    By silk in forum Ext 3.x: Help & Discussion
    Replies: 1
    Last Post: 9 Feb 2011, 3:14 PM
  3. Slider to control scroll bar
    By av.personals in forum Ext GWT: Discussion
    Replies: 5
    Last Post: 6 Dec 2010, 5:41 AM
  4. slider control for paging?
    By pex in forum Community Discussion
    Replies: 1
    Last Post: 13 Nov 2006, 5:23 AM

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •