Results 1 to 3 of 3

Thread: Scatter chart not drawing

    Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Sencha User
    Join Date
    Jan 2012
    Posts
    30

    Default Scatter chart not drawing

    I can not draw a scatter chart with Sencha Touch Charts. I saw the points during 1 second but after they are erased.


    Here are a part of the code I use :

    Code:
    (function () {
            var Chart, ScatterChart,
                    __hasProp = Object.prototype.hasOwnProperty,
                    __extends = function (child, parent) {
                        for (var key in parent) {
                            if (__hasProp.call(parent, key)) child[key] = parent[key];
                        }
                        function ctor() {
                            this.constructor = child;
                        }
        
                        ctor.prototype = parent.prototype;
                        child.prototype = new ctor;
                        child.__super__ = parent.prototype;
                        return child;
                    };
        
            Chart = (function () {
        
                function Chart(parsedResultString, secondAxis, sizeEncoding, colorEncoding) {
                    this.secondAxis = secondAxis != null ? secondAxis : null;
                    this.sizeEncoding = sizeEncoding != null ? sizeEncoding : null;
                    this.colorEncoding = colorEncoding != null ? colorEncoding : null;
                    this.parsedResult = JSON.parse(parsedResultString);
                    this.data = [];
                    this.store = [];
                    this.fields = [];
                    this.fieldsSizeEncoding = [];
                    this.fieldsColorEncoding = [];
                    this.series = [];
                    this.axes = [];
                    this.chart = null;
                    this.column = this.parsedResult.columnCategoryKey;
                }
        
                Chart.prototype.createStore = function () {
                    return this.store = new Ext.data.JsonStore({
                        fields:this.fields.concat(this.column),
                        data:this.data
                    });
                };
        
                Chart.prototype.createChart = function () {
        
                    this.chart = new Ext.chart.Chart({
                        cls:'chart',
                        store:this.store,
                        animate:true,
                        legend:{
                            position:'right'
                        },
                        axes:this.axes,
                        series:this.series
                    });
                    return new Ext.chart.Panel({
                        fullscreen:true,
                        items:this.chart
                    });
                };
        
                return Chart;
        
            })();
        
            ScatterChart = (function (_super) {
        
                __extends(ScatterChart, _super);
        
                function ScatterChart(parsedResult, secondAxis, sizeEncoding, colorEncoding) {
                    if (secondAxis == null) secondAxis = null;
                    if (sizeEncoding == null) sizeEncoding = null;
                    if (colorEncoding == null) colorEncoding = null;
                    ScatterChart.__super__.constructor.call(this, parsedResult, secondAxis, sizeEncoding, colorEncoding);
                    this.convertData();
                    this.createStore();
                    this.createSeries();
                    this.createAxes();
                    this.createChart();
                }
        
                ScatterChart.prototype.createSeries = function () {
                    var index, serie, value, _len, _ref, _results;
                    _ref = this.fields;
                    _results = [];
                    for (index = 0, _len = _ref.length; index < _len; index++) {
                        value = _ref[index];
                        serie = {
                            type:'scatter',
                            axis:'bottom',
                            xField:this.column,
                            yField:value,
                            markerConfig:{}
                        };
                        this.series.push(serie);
                    }
                };
        
                ScatterChart.prototype.createAxes = function () {
                    this.axes.push({
                        type:'Numeric',
                        position:'left',
                        fields:this.fields,
                        title:'Test'
                    });
                    return this.axes.push({
                        type:'Category',
                        position:'bottom',
                        fields:[this.column],
                        title:this.column
                    });
                };
        
                return ScatterChart;
        
            })(Chart);
        
        }).call(this);
    And here are my yField, xField and data :

    fsLZ0.jpg

    If you have an idea on why it does not work, it would help me a lot !

  2. #2
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,448
    Answers
    3997

    Default

    I would create an extension to Ext.chart.Chart using Ext.extend instead of doing everything you are doing.
    Mitchell Simoens @LikelyMitch

    Check out my GitHub:
    https://github.com/mitchellsimoens

    Posts are my own, not any current, past or future employer's.

  3. #3
    Sencha User
    Join Date
    Jan 2012
    Posts
    30

    Default

    I found why I did not work. If was a bug inside touch charts and I fixed it. How can I do to report it ?

Posting Permissions

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