Why is my jQuery .map not working here to combine my arrays?

I have the following code,

<script>

        $.ajax({
        url: 'http://dev.markitondemand.com/MODApis/Api/v2/InteractiveChart/jsonp?parameters={"Normalized":false,"NumberOfDays":1095,"DataPeriod":"Day","Elements":[{"Symbol":"AAPL","Type":"price","Params":["ohlc"]}]}',
        dataType: 'jsonp',
        success: function(data) {

       var x_axis = (JSON.stringify(data.Elements[0].DataSeries.close.values, null, '\t'));
       var y_axis = (JSON.stringify(data.Dates, null, '\t'));

       var r = [];

       r = $.map(y_axis, function(n, i) {
            return [[n, x_axis[i]]]; 
       });

       $('#container').html(r);       

   }
 });
</script>

Variables x_axis and y_axisare two single dimensional arrays and I am trying to combine them in to a single multi dimensional array using jQuery's .map function.

What am I doing wrong here?

Here's a link to what I've got so far - http://jsbin.com/wuxocivato/edit?html,output

Answers 1

  • Because map do not work as expected with strings... But you created strings with JSON.stringify. So it works:

    $.ajax({
            url: 'http://dev.markitondemand.com/MODApis/Api/v2/InteractiveChart/jsonp?parameters={"Normalized":false,"NumberOfDays":1095,"DataPeriod":"Day","Elements":[{"Symbol":"AAPL","Type":"price","Params":["ohlc"]}]}',
            dataType: 'jsonp',
            success: function(data) {
    
           var x_axis = data.Elements[0].DataSeries.close.values;
           var y_axis = data.Dates;
    
           var r = [];
    
           r = $.map(y_axis, function(n, i) {
                return [[n, x_axis[i]]]; 
           });
           console.log(r);   
    
           $('#container').html(r);       
    
       }
     });
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <div id="container"></div>


Related Articles