[dygraphs.git] / tests / color-cycle.html

<!DOCTYPE html>
<html>
  <head>
    <title>color cycles</title>
    <!--
    For production (minified) code, use:
    <script type="text/javascript" src="dygraph-combined.js"></script>
    -->
    <script type="text/javascript" src="../dist/dygraph.js"></script>

  </head>
  <body>
    <p>Different color cycles</p>

    <div id="blah"></div>
    <p><b>Colors: </b>
    <button type=button id=0 onClick="change(this)"> first set</button>
    <button type=button id=1 onClick="change(this)"> second set</button>
    <button type=button id=2 onClick="change(this)"> undefined</button>
    </p>

    <script type="text/javascript">
      var colorSets = [
        ['#284785', '#EE1111', '#8AE234'],
        ['#444444', '#888888', '#DDDDDD'],
        null
      ]
      chart = new Dygraph(document.getElementById("blah"),
                          "X,a,b,c\n" +
                          "10,12345,23456,34567\n" +
                          "11,12345,20123,31345\n",
                          {
                            width: 640,
                            height: 480,
                            colors: colorSets[0]
                          });

      function change(el) {
        chart.updateOptions({colors: colorSets[el.id]});
      }
    </script>
  </body>
</html>
Commit	Line	Data
b5daaaf0 RK	1	<!DOCTYPE html>
	2	<html>
	3	<head>
b5daaaf0	4	<title>color cycles</title>
b5daaaf0 RK	5	<!--
	6	For production (minified) code, use:
	7	<script type="text/javascript" src="dygraph-combined.js"></script>
	8	-->
fbd6834a	9	<script type="text/javascript" src="../dist/dygraph.js"></script>
b5daaaf0 RK	10
	11	</head>
	12	<body>
	13	<p>Different color cycles</p>
	14
	15	<div id="blah"></div>
	16	<p><b>Colors: </b>
	17	<button type=button id=0 onClick="change(this)"> first set</button>
	18	<button type=button id=1 onClick="change(this)"> second set</button>
	19	<button type=button id=2 onClick="change(this)"> undefined</button>
	20	</p>
	21
	22	<script type="text/javascript">
	23	var colorSets = [
	24	['#284785', '#EE1111', '#8AE234'],
	25	['#444444', '#888888', '#DDDDDD'],
	26	null
	27	]
	28	chart = new Dygraph(document.getElementById("blah"),
	29	"X,a,b,c\n" +
	30	"10,12345,23456,34567\n" +
	31	"11,12345,20123,31345\n",
	32	{
	33	width: 640,
	34	height: 480,
	35	colors: colorSets[0]
	36	});
	37
	38	function change(el) {
	39	chart.updateOptions({colors: colorSets[el.id]});
	40	}
	41	</script>
	42	</body>
	43	</html>