JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://code.htmlhifive.com/h5.css">
<script src="https://code.htmlhifive.com/ejs-h5mod.js"></script>
<script src="https://hifive.github.io/hifive-res/fw/current/h5.dev.js"></script>
<link rel="stylesheet" href="https://hifive.github.io/hifive-ui-library/hifive-ui-library/WebContent/components/chart/src/chart.css">
<script src="https://hifive.github.io/hifive-ui-library/hifive-ui-library/WebContent/components/chart/src/graphic-renderer.js"></script>
<script src="https://hifive.github.io/hifive-ui-library/hifive-ui-library/WebContent/components/chart/src/chart.js"></script>
<div id="chart" ></div>

JavaScript

(function() {
	var pageController = {
		__name: 'ui.chart.pageController',
		_chartController: h5.ui.components.chart.ChartController, // チャートライブラリ
		__meta: {
			_chartController: {
				rootElement: '#chart'
			}
		},

		__ready: function(context) {
			var series = [
      	this._createNewSeries('blue'),
        this._createNewSeries('red'),
        this._createNewSeries('green')
      ];
      
			this._chartController.draw({
				chartSetting: {
					width: 600,
					height: 480
				},
				axes: {
					xaxis: {
						off: true
					},
					yaxis: { // y軸
						lineNum: 6, // y軸の補助線の数(上部は含む)
						fontSize: '12pt', // ラベルのフォントサイズ
						autoScale: function(min, max) { // オートスケールの定義
							return {
								rangeMax: Math.ceil(max / 500) * 500,
								rangeMin: 260
							};
						},
					}
				},
				seriesDefault: { // すべての系列のデフォルト設定
					dispDataSize: 100,
				},
				series: series
			// 系列データ
			});
		},

		_createNewSeries: function(color) {
			var data = createChartDummyData(400, 100); // ダミーデータを生成
			// 系列定義
			return {
				name: 'series_'+color,
				type: 'line',
				data: data,
				propNames: {
					y: 'val'
				},
				color: color
			};
		}
	};

	h5.core.expose(pageController);

  /**
	 * ダミーデータ生成関数
	 */
	function createChartDummyData(median, vibration) {
		var ret = [];
		for (var i = 0; i < 100; i++) {
			ret.push({
				val: median + (Math.random() - 0.5) * vibration * 2
			});
		}
		return ret;
	}

})();

$(function() {
	h5.core.controller('body', ui.chart.pageController);
})