[LRUG] [Help request] Programmatically inserting user data into js chart

[Jesse Waites]

Hi everyone,

I spun up a new Rails app to experiment with the D3 charting library and
hit a minor snag. I've never done anything like the before so I want to
make sure I do it the "best" way possible and not some hacky way, which I
could certainly come up with, ha.

Here's the situation:

I have a new Rails app with 1 model, view, and controller called "Favorites"
A user would add favorite colors, favorite movie, and favorite numbers, in
3 different form fields, each as a string.

In the controller, I remap the numbers string into  a proper array with
integers.

@data = @favorite.numbers.split(",").map { |s| s.to_i }

At this point, lets say @data is now an array of [5,4,3,2,1] - We know the
length of this array and the contents.

On the show page, in the view, I have a variable called dataset that the
hardcoded
D3 chart is working off of. Here is a jsfiddle of the exact chart I am
trying to get to work with user data.

http://jsfiddle.net/enigmarm/3HL4a/13/


var dataset = [
{ key: 0, value: 5 },
{ key: 1, value: 10 },
{ key: 2, value: 13 },
{ key: 3, value: 19 },
{ key: 4, value: 21 },
{ key: 5, value: 25 },
{ key: 6, value: 22 },
{ key: 7, value: 18 },
{ key: 8, value: 15 },
{ key: 9, value: 13 },
{ key: 10, value: 11 },
{ key: 11, value: 12 },
{ key: 12, value: 15 },
{ key: 13, value: 20 },
{ key: 14, value: 18 },
{ key: 15, value: 17 },
{ key: 16, value: 16 },
{ key: 17, value: 18 },
{ key: 18, value: 23 },
{ key: 19, value: 25 } ];

So I need to iterate over my array, put the index into the "key" position,
and put the value into the "value" section. If the array had 2 elements, I
need to do it twice. 5 elements, 5 times.

I wrote a stupid method called "make jsonish" that isnt working:

def make_jsonish(array)
      array.each_with_index do |num, i|
        puts "{ key: #{i}, value: #{num}},"
      end
    end

I don't think the "puts" thing will work anyway. I'm a bit stumped as to
how to best do this so I would appreciate any help.

Here is a gist of the view:

https://gist.github.com/piratebroadcast/19b2ca6617343d8812d2a40325f76bc7

Controller gist:

https://gist.github.com/piratebroadcast/ce802346d75e667fface711f8dfc17e0


Anyone have any suggestions as to how I should move forward with this?
Seems like a simple thing but I can't quite sort it out by myself.


Thank you!!!





-- 
Jesse Waites
JesseWaites.com
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.lrug.org/pipermail/chat-lrug.org/attachments/20160608/03190995/attachment.html>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: Screen Shot 2016-06-07 at 11.05.41 AM.png
Type: image/png
Size: 213554 bytes
Desc: not available
URL: <http://lists.lrug.org/pipermail/chat-lrug.org/attachments/20160608/03190995/attachment.png>