JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://raw.github.com/DmitryBaranovskiy/raphael/master/raphael-min.js"></script>
<script src="https://raw.github.com/DmitryBaranovskiy/g.raphael/master/min/g.raphael-min.js"></script>
<script src="https://raw.github.com/DmitryBaranovskiy/g.raphael/master/min/g.line-min.js"></script>
<div id="holder"></div>

JavaScript

var r = Raphael("holder");
var xtime =  [0,1,2,2,3,4,4,5,6,7,8,9,10,11,12,13,14,15],
    yscore = [0,0,0,6,0,0,6,6,6,6,6,7 ,7 ,7 ,7 ,7 ,1 ];

r.linechart(10, 10, 300, 220, xtime, yscore);


//yscore[3] changes to "6" then add xtime[4] with a value of xtime[3] and