ccchart v1.10.4をリリースしました

ccchartの記事を最近書いてなかったので、v1.10.4リリースと git （これね＾＾つ https://github.com/toshirot/ccchart
） を生まれて初めて使い始めた記念に書いておきます。

今回のリリースでは、WebSocket 利用時の動的 xLines オブジェクトで最高値highまたは最小値lowをキープする xLines.keep プロパティを追加しました。

ようするに、リアルタイムチャートを描画時の xLines で、変化する値ではなく最高値や最小値を表示できるようになります。

config コード例

1行目のデータに追随し、オレンジ色で最高値をキープするケース
"xLines": {"useRow": 1, "color": "orange", "keep": "high"}

Syntax
keep: "high" | "low" | (default)"no"
*WebSocktによるリアルタイムチャート描画時のみ動作します

サンプル
http://ccchart.org/test/xLine/keep1.htm

var chartCfg10 = {
  config: {
    "title" : "xLines: [{\"val\": 70, \"keep\": \"high\"}] ",
    "subtitle" : "Highest 最高値をキープする",
    "useMarker": "css-ring",
    "markerWidth": 20,
    "minY": 0,
    "maxY": 100,
    "xLines": [
          {"useRow": 2, "color": "orange", "keep": "high", "xOffset": -24}
        ]
  },

  "data": [
    ["時間"],
    ["test data1"],
    ["test data2"]
  ]
};

ccchart
  .init('hoge10', chartCfg10)
  .ws('ws://ccchart.com:8016')
  .on('message', ccchart.wscase.oneColAtATime);

git
https://github.com/toshirot/ccchart

ccchart v1.10.4 コード
http://ccchart.com/js/ccchart-v1.10.4.js

ccchart.com
http://ccchart.com/

update
http://ccchart.com/update.htm

  {
    ver: "1.10.4",
    date: "2015.08.09",
    status: "release",
    updates: [
          ["1. add xLines.keep property keep: high | low | (default)no http://ccchart.org/test/xLine/keep1.htm  http://ngw.jp/~tato/wp/?page_id=3501"]
    ]
  }

参考：ws://ccchart.com:8016で動いているサーバー側サンプルコード

var WsServer = require('ws').Server;

var tid;
var ws = new WsServer({
    host: 'ccchart.com',
    port: 8016
});

//start
broadCast();

function broadCast() {
    tid = setInterval(function() {
        var dataAry = mkData();
        ws.clients.forEach(function(client) {
            if (client.readyState === 1)
                client.send(JSON.stringify(dataAry));
        });
    }, 200);
}

function mkData() {
    var data = [
        ["Year"],
        ["s2"],
        ["s3"]
    ];
    var now = new Date();
    var H = now.getHours();
    var M = now.getMinutes();
    var S = now.getSeconds();
    H = (H < 10) ? '0' + H : H;
    M = (M < 10) ? '0' + M : M;
    S = (S < 10) ? '0' + S : S;

    data[0] = H + ':' + M + ':' + S;
    data[1] = Math.floor(Math.random(10) * 96);
    data[2] = 32 + Math.floor(Math.random(10) * 18);

    return data;
}

//on connection　これはハートビート用なのでいらなければ無くてもOK
// ccchart はデフォルトでは60秒に一度"Heartbeat"という文字列を
// サーバーへ送り、その返信である"Heartbeat"文字列を受信しています
ws.on('connection', function(socket) {

    console.log(
        'conned: ' + ws.clients.length, (new Date),
        socket.upgradeReq.socket.remoteAddress
    );

    socket.on('message', function(msg) {
        var msg = JSON.stringify(msg);
        if (msg === 'Heartbeat') {
            if (socket.readyState === 1) {
                socket.send(msg);
                console.log(msg);
            }
        }
    });
});