-
KathleenJune 28, 2016 at 6:11 pm #6264
So I was told to make a scatterplot but the problem is the only programming language I have ever used is Java. I was wondering if there was a sort of readme to figure out where to start as I looked through the docs but unfortunately do not know what things like DOM or div tags are so that didnt help to much. I kinda just went into the scatter example and started changing stuff in the scatter_test file to make it look like this https://gist.github.com/Sniksder16/e4291ad2e2ac636a7caead64484ecac0 the file I pointed it to is just an csv file with 4 headers and 4 columns of data. I have no clue if this was the best place to start messing with the code or if it is better to just bite the bullet and try to learn how to code it from scratch but that’s why I’m here…
vizulyJune 28, 2016 at 7:01 pm #6265Hi Kathleen,
What you are trying to do, while ambitious, probably isn’t impossible. But there will be a bit of a learning curve as you learn HTML, CSS, and Javascript. All of these are relatively simple programming languages/constructs onto themselves, but it is going to take a little bit to see how they all interoperate. Vizuly, as you may have figured out, is based on D3.js – which is a javascript library. So on top of learning javascript you will probably need to ramp up a little on D3.
If you need to build a scatterplot in javascript, this is probably the quickest way to go – as Vizuly makes it a lot easier. I think you are on the right path, in terms of tweaking and changing things to learn how the code works. The more time you spend with it, the more you will learn.
One other possibility is finding a Vizuly/D3.js consultant to help you build the scatter plot you need and then have them teach you how they did it. It would probably help accelerate your learning curve and avoid common pitfalls/mistakes.
– Tom
vizulyJune 29, 2016 at 1:45 pm #6283Kathleen,
One other thought if you are really finding this a bit overwhelming, is to just start with the data. Take the sample data that comes with vizuly and see if you can get your data structure to match this data, and populate the chart with your own data.
Once you have loaded your own data you can the adjust which columns the chart uses to create it’s display through the x, y, and r (radius) properties as seen here in the test file below.
viz.data(dataSource.data) .width(screenWidth).height(screenHeight) .y(function (d, i) { return Number(d[dataSource.amount]); }) .x(function (d, i) {return d[dataSource.date]; }) .r(function (d, i) { return Number(d[dataSource.amount]);})You may also want to start with one of our free examples like the Radial Progress, which doesn’t load any external data and may be more approachable to learning javascript, html, d3, vizuly .etc.
Good Luck!
– Tom
-
|
You must be logged in to reply to this topic.