unity / plotly > ランダムに得られた{x,y}をプロット / {日時, y}をプロット

```txt:動作確認
Unity 5.1.3-f1 on MacOS X 10.8.5
```

plotlyにグラフを作成する。

##code

[v0.1 @ github](https://github.com/yasokada/unity-150919-plotlyBase/releases/tag/v0.1)

### MyPlotlyUtil.cs

GetAddString_xy()は引数として{username, APIKey, x, y}を渡すとグラフプロット用stringを返してくれる。

```MyPlotlyUtil.cs
using UnityEngine;
using System.Collections;

namespace NS_MyPlotlyUtil
{
	public static class MyPlotlyUtil {
		public static string GetAddString_xy(string username, string apikey, float xpos, float ypos) {
			string res = 
			"un=" + username + "&" +
			"key=" + apikey + "&" +
			"origin=plot&" +
			"platform=lisp&" +
			"args=[[" + xpos.ToString("0.000") + "]," +
				  "[" + ypos.ToString("0.000") + "]]&" +
			"kwargs={\"filename\": \"plot from api 150919\"," +
//				"\"fileopt\": \"overwrite\"," + 
				"\"fileopt\": \"extend\"," +

//				"\"style\": {" + 
//					"\"type\": \"bar\"" +
//				"}," + 
//				"\"traces\": [1]," + 
				"\"layout\": {" +
					"\"title\": \"experimental data\"" +
				"}," + 
				"\"world_readable\": true" + // set graph to public
			"}";
			return res;
		}
	}
	
}
```

### PostButtonScript.cs

POSTボタンを押した時に、5回ランダムデータをポストする。

```PostButtonScript.cs
using UnityEngine;
using System.Collections;
using UnityEngine.UI; // for Input Field

using NS_MyPlotlyUtil; 

/*
 * v0.1 2015/09/19
 *   - adding random x,y data
 */ 

public class PostButtonScript : MonoBehaviour {

	public InputField IF_username;
	public InputField IF_apikey;
	public Text errText;

	public void PostButtonClick() {
		StartCoroutine ("PostProcess");
	}

	IEnumerator PostProcess() {
		string url = "https://plot.ly/clientresp";

		for (int loop=1; loop<=5; loop++) {
			errText.text = "posting(" + loop.ToString() + "/5)";
			float xpos = Random.Range (0, 100) / 10.0f;
			float ypos = Random.Range (0, 100) / 10.0f;

			string dataStr = MyPlotlyUtil.GetAddString_xy (
				IF_username.text, IF_apikey.text, xpos, ypos);

			byte [] data = System.Text.Encoding.UTF8.GetBytes (dataStr);
		
			WWW www = new WWW (url, data);
			yield return www;

			Debug.Log (www.text);
	
			if (www.text.Contains ("support")) {
				errText.text = "API Key error";
				break;
			} else {
				errText.text = "data added";
			}
			yield return new WaitForSeconds(2.0f);
		}
	}
}
```

## 使用例

準備として plot.ly のサイトにてユーザ登録しておく。

Settings > API settings のページに表示されている API Keyを使う。

プレイモードで実行して、usernameとAPI Keyを入力してPOSTボタンを押すと5回データを追加する (data addedと表示される)。

![Main_unity_-_150919-unity-plotlyBase_-_PC__Mac___Linux_Standalone__Personal_.jpg](https://qiita-image-store.s3.amazonaws.com/0/32870/b4ea8e93-87be-dbf7-daf0-2bcc742aba17.jpeg)


plotlyのサイトにて Organize > Home を選択すると、以下のようにグラフ(plot from api 150919)が作成されている。
右側にあるGrid 187はグラフのデータで非公開になっている。

グラフ https://plot.ly/186/~7of9/


![Plotly.jpg](https://qiita-image-store.s3.amazonaws.com/0/32870/5e281e77-2f02-5719-2519-ecd852e3d8da.jpeg)


なお、API Keyが入力間違していると以下のようにエラーを出すようにしている。

![Main_unity_-_150919-unity-plotlyBase_-_PC__Mac___Linux_Standalone__Personal_.jpg](https://qiita-image-store.s3.amazonaws.com/0/32870/4bf338b2-a098-74b0-e5d6-5d5ca3157dc5.jpeg)


## time seriesデータ

[v0.2 @ github](https://github.com/yasokada/unity-150919-plotlyBase/releases/tag/v0.2)

GetAddString_time_y()を追加した。

横軸にSystem.DateTimeを使用できる。

https://plot.ly/204/~7of9/