<commit_before><!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
<title>Charting Theme Tester</title>
<style type="text/css">
	@import "../../../dojo/resources/dojo.css";
	@import "../../../dijit/tests/css/dijitTests.css";
	#chartContainer {
		position: relative;
		height: 520px;
	}
	#bars, #lines, #area, #bubbles {
		position: absolute;
		top:0;
		width: 400px;
		height: 260px;
	}
	#lines, #area { left: 400px; }
	#bubbles, #area { top: 260px; }
</style>
<!--
The next line should include Microsoft's Silverligth.js, if you plan to use the silverlight backend
<script type="text/javascript" src="Silverlight.js"></script>
-->
<script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: true"></script>
<script type="text/javascript">
	dojo.require("dojox.charting.Chart2D");

	var themes = [
		"GreySkies",
		"Harmony",
		"Distinctive",
		"Adobebricks",
		"Algae",
		"Bahamation",
		"BlueDusk",
		"CubanShirts",
		"Desert",
		"Dollar",
		"Grasshopper",
		"Grasslands",
		"IndigoNation",
		"Ireland",
		"MiamiNice",
		"Midwest",
		"Minty",
		"PurpleRain",
		"RoyalPurples",
		"SageToLime",
		"Shrooms",
		"Tufte",
		"WatersEdge",
		"Wetland",
		"PlotKit.blue",
		"PlotKit.cyan",
		"PlotKit.green",
		"PlotKit.orange",
		"PlotKit.purple",
		"PlotKit.red"
	];

	//	require all the themes.
	dojo.forEach(themes, function(item){
		dojo.require("dojox.charting.themes."+item);
	});
	var charts = { bars: null, area: null, lines: null, bubbles: null }, current=dojox.charting.themes[themes[0]];

	function update(){
		//	change the theme based on the select change.
		var select = dojo.byId("themeChooser");
		var theme = dojo.getObject("dojox.charting.themes."+select.options[select.selectedIndex].value);
		if(theme){
			current = theme;
			for(var chart in charts){
				charts[chart].setTheme(current);
				charts[chart].render();
			}
		}		
	}

	function init(){
		charts.bars = new dojox.charting.Chart2D("bars");
		charts.bars.setTheme(current);
		charts.bars.addAxis("x", {fixLower: "minor", fixUpper: "minor", natural: true});
		charts.bars.addAxis("y", {vertical: true, fixLower: "major", fixUpper: "major", includeZero: true});
		charts.bars.addPlot("default", {type: "ClusteredColumns", gap: 10});
		charts.bars.addSeries("Series A", [2, 1, 0.5, -1, -2] );
		charts.bars.addSeries("Series B", [-2, -1, -0.5, 1, 2] );
		charts.bars.addSeries("Series C", [1, 0.5, -1, -2, -3] );
		charts.bars.addSeries("Series D", [0.7, 1.5, -1.2, -1.25, 3] );
		charts.bars.render();

		charts.lines = new dojox.charting.Chart2D("lines");
		charts.lines.setTheme(current);
		charts.lines.addPlot("default", {type: "Default", lines: true, markers: true, tension:"X"});
		charts.lines.addAxis("x", {min: 0, max: 6, majorTick: {stroke: "black", length: 3}, minorTick: {stroke: "gray", length: 3}});
		charts.lines.addAxis("y", {vertical: true, min: 0, max: 10, majorTick: {stroke: "black", length: 3}, minorTick: {stroke: "gray", length: 3}});
		charts.lines.addSeries("Series A", [{x: 0.5, y: 5}, {x: 1.5, y: 1.5}, {x: 2, y: 9}, {x: 5, y: 0.3}]);
		charts.lines.addSeries("Series B", [{x: 0.3, y: 8}, {x: 4, y: 6}, {x: 5.5, y: 2}]);
		charts.lines.render();

		charts.bubbles = new dojox.charting.Chart2D("bubbles");
		charts.bubbles.setTheme(current);
		charts.bubbles.addPlot("default", {type: "Bubble", shadows: {dx: 2, dy: 2, dw: 2}});
		charts.bubbles.addAxis("x", {min: 0, max: 6, majorTick: {stroke: "black", length: 3}, minorTick: {stroke: "gray", length: 3}});
		charts.bubbles.addAxis("y", {vertical: true, min: 0, max: 10, majorTick: {stroke: "black", length: 3}, minorTick: {stroke: "gray", length: 3}});
		charts.bubbles.addSeries("Series A", [{x: 0.5, y: 5, size: 1.4}, {x: 1.5, y: 1.5, size:4.5}, {x: 2, y: 9, size:1.5}, {x: 5, y: 0.3, size:0.8}]);
		charts.bubbles.addSeries("Series B", [{x: 0.3, y: 8, size: 2.5}, {x: 4, y: 6, size:1.1}, {x: 5.5, y: 2, size: 3.2}]);
		charts.bubbles.render();
		
		charts.area = new dojox.charting.Chart2D("area");
		charts.area.setTheme(current);
		charts.area.addAxis("x", {fixLower: "major", fixUpper: "major"});
		charts.area.addAxis("y", {vertical: true, fixLower: "major", fixUpper: "major", min: 0});
		charts.area.addPlot("default", {type: "StackedAreas", tension:"X"});
		charts.area.addSeries("Series A", [-2, 1.1, 1.2, 1.3, 1.4, 1.5, -1.6]);
		charts.area.addSeries("Series B", [1, 1.6, 1.3, 1.4, 1.1, 1.5, 1.1]);
		charts.area.addSeries("Series C", [1, 1.1, 1.2, 1.3, 1.4, 1.5, 1.6]);
		charts.area.render();

		var s=dojo.byId("themeChooser");
		dojo.forEach(themes, function(item){
			s.options[s.options.length] = new Option(item, item);
		});
		dojo.connect(s, "onchange", update);
	}
	dojo.addOnLoad(init);
</script>
</head>
<body>
	<h1>DojoX Charting Theme Tester</h1>
	<p>Choose a theme from the list below; the charts will be rendered using it.</p>
	<p>Available themes: <select id="themeChooser"></select></p>
	<div id="chartContainer">
		<div id="bars"></div>
		<div id="area"></div>
		<div id="lines"></div>
		<div id="bubbles"></div>
	</div>
</body>
</html><commit_msg>charting: refactored the theme tester, simplified the setup, added pie charts, !strict, refs #10938.<commit_after><!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
<title>Charting Theme Tester</title>
<style type="text/css">
	@import "../../../dojo/resources/dojo.css";
	@import "../../../dijit/tests/css/dijitTests.css";
	#chartContainer {
		position: relative;
		height: 420px;
	}
	.chart {
		position: absolute;
		top:    0;
		left:   0;
		width:  300px;
		height: 200px;
	}
	#lines, #area {
		left: 320px;
	}
	#bubbles, #area, #pieLin {
		top: 220px;
	}
	#pieLin, #pieFan {
		left:  640px;
		width: 200px;
	}
</style>
<script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: true"></script>
<script type="text/javascript">
	dojo.require("dojox.charting.Chart2D");

	var charts = {};

	function update(){
		//	change the theme based on the select change.
		var select = dojo.byId("themeChooser"), name = select.options[select.selectedIndex].value;
		dojo.require("dojox.charting.themes." + name);
		var theme = dojo.getObject("dojox.charting.themes." + name);
		if(theme){
			for(var name in charts){
				charts[name].setTheme(theme).render();
			}
		}
	}

	function init(){
		charts.bars = new dojox.charting.Chart2D("bars").
			addAxis("x", {fixLower: "minor", fixUpper: "minor", natural: true}).
			addAxis("y", {vertical: true, fixLower: "major", fixUpper: "major", includeZero: true}).
			addPlot("default", {type: "ClusteredColumns", gap: 5}).
			addSeries("Series A", [0.53, 0.51]).
			addSeries("Series B", [0.84, 0.79]).
			addSeries("Series C", [0.68, 0.95]).
			addSeries("Series D", [0.77, 0.66]);

		charts.lines = new dojox.charting.Chart2D("lines").
			addAxis("x", {min: 0, max: 6, fixLower: "minor", fixUpper: "minor", natural: true}).
			addAxis("y", {vertical: true, fixLower: "major", fixUpper: "major", includeZero: true, max: 1}).
			addPlot("default", {type: "Default", lines: true, markers: true, tension: "X"}).
			addSeries("Series A", [{x: 0.5, y: 0.2}, {x: 1.5, y: 0.4}, {x: 2.0, y: 0.1}, {x: 5.0, y: 0.9}]).
			addSeries("Series B", [{x: 0.3, y: 0.6}, {x: 3.0, y: 0.5}, {x: 4.0, y: 0.9}, {x: 5.5, y: 0.7}]).
			addSeries("Series C", [{x: 0.8, y: 0.8}, {x: 3.4, y: 0.2}, {x: 5.3, y: 0.3}]).
			addSeries("Series D", [{x: 0.6, y: 0.9}, {x: 2.6, y: 0.6}, {x: 5.0, y: 0.1}]);

		charts.pieFan = new dojox.charting.Chart2D("pieFan").
			addPlot("default", {type: "Pie", radius: 60, labelOffset: -20, radGrad: dojox.gfx.renderer == "vml" ? "fan" : "native"}).
			addSeries("Series A", [0.35, 0.25, 0.42, 0.53, 0.69]);

		charts.bubbles = new dojox.charting.Chart2D("bubbles").
			addAxis("x", {min: 0, max: 6, fixLower: "minor", fixUpper: "minor", natural: true}).
			addAxis("y", {vertical: true, fixLower: "major", fixUpper: "major", includeZero: true}).
			addPlot("default", {type: "Bubble"}).
			addSeries("Series A", [{x: 0.5, y: 5.0, size: 1.4}, {x: 1.5, y: 1.5, size: 4.5}, {x: 2.0, y: 9.0, size: 1.5}, {x: 5.0, y: 0.3, size: 0.8}]).
			addSeries("Series B", [{x: 0.3, y: 8.0, size: 2.5}, {x: 4.0, y: 6.0, size: 2.1}, {x: 5.5, y: 2.0, size: 3.2}]).
			addSeries("Series C", [{x: 2.0, y: 5.5, size: 2.5}, {x: 3.5, y: 2.5, size: 3.5}, {x: 5.2, y: 7.0, size: 3.0}]).
			addSeries("Series D", [{x: 3.2, y: 8.0, size: 2.0}]);

		charts.area = new dojox.charting.Chart2D("area").
			addAxis("x", {fixLower: "major", fixUpper: "major"}).
			addAxis("y", {vertical: true, fixLower: "major", fixUpper: "major", min: 0}).
			addPlot("default", {type: "StackedAreas", tension: "X"}).
			addSeries("Series A", [-2, 1.1, 1.2, 1.3, 1.4, 1.5, -1.6]).
			addSeries("Series B", [1, 1.6, 1.3, 1.4, 1.1, 1.5, 1.1]).
			addSeries("Series C", [1, 1.1, 1.2, 1.3, 1.4, 1.5, 1.6]);

		charts.pieLin = new dojox.charting.Chart2D("pieLin").
			addPlot("default", {type: "Pie", radius: 60, labelOffset: -20, radGrad: "linear"}).
			addSeries("Series A", [0.35, 0.25, 0.42, 0.53, 0.69]);

		update();

		dojo.connect(dojo.byId("themeChooser"), "onchange", update);
	}
	dojo.addOnLoad(init);
</script>
</head>
<body>
	<h1>DojoX Charting Theme Tester</h1>
	<p>Choose a theme from the list below, a theme will be loaded dynamically, and the charts will be rendered using it.</p>
	<p><label for="themeChooser">Available themes:&nbsp;</label>
		<select id="themeChooser">
			<optgroup label="Gradients">
				<option value="Julie" selected="selected">Julie</option>
				<option value="ThreeD">ThreeD</option>
				<option value="Chris">Chris</option>
				<option value="PrimaryColors">PrimaryColors</option>
			</optgroup>
			<optgroup label="Classic">
		<option value="Adobebricks">Adobebricks</option>
				<option value="Algae">Algae</option>
				<option value="Bahamation">Bahamation</option>
				<option value="BlueDusk">BlueDusk</option>
				<option value="CubanShirts">CubanShirts</option>
				<option value="Desert">Desert</option>
				<option value="Distinctive">Distinctive</option>
				<option value="Dollar">Dollar</option>
				<option value="Grasshopper">Grasshopper</option>
				<option value="Grasslands">Grasslands</option>
				<option value="GreySkies">GreySkies</option>
				<option value="Harmony">Harmony</option>
				<option value="IndigoNation">IndigoNation</option>
				<option value="Ireland">Ireland</option>
				<option value="MiamiNice">MiamiNice</option>
				<option value="Midwest">Midwest</option>
				<option value="Minty">Minty</option>
				<option value="PurpleRain">PurpleRain</option>
				<option value="RoyalPurples">RoyalPurples</option>
				<option value="SageToLime">SageToLime</option>
				<option value="Shrooms">Shrooms</option>
				<option value="Tufte">Tufte</option>
				<option value="WatersEdge">WatersEdge</option>
				<option value="Wetland">Wetland</option>
			</optgroup>
			<optgroup label="PlotKit">
				<option value="PlotKit.blue">PlotKit.blue</option>
				<option value="PlotKit.cyan">PlotKit.cyan</option>
				<option value="PlotKit.green">PlotKit.green</option>
				<option value="PlotKit.orange">PlotKit.orange</option>
				<option value="PlotKit.purple">PlotKit.purple</option>
				<option value="PlotKit.red">PlotKit.red</option>
			</optgroup>
		</select>
	</p>
	<div id="chartContainer">
		<div class="chart" id="bars"></div>
		<div class="chart" id="lines"></div>
		<div class="chart" id="pieFan"></div>
		<div class="chart" id="bubbles"></div>
		<div class="chart" id="area"></div>
		<div class="chart" id="pieLin"></div>
	</div>
</body>
</html>
{'fraction_non_alphanumeric': 0.22179487179487178, 'fraction_numerical': 0.037606837606837605, 'mean_word_length': 4.240035826242723, 'pattern_counts': {'":': 0, '<': 156, '<?xml version=': 0, '>': 156, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '624489', 'n_tokens_mistral': 5339, 'n_tokens_neox': 4605, 'n_words': 1040}