バウンディング・ボックス
バウンディング・ボックスのレッスンに戻る
<script language="JavaScript1.2">
<!--
	/*
	* Other parts required but not shown here:
	* In the HTML file, the radio buttons in the form below the SVG image each
	* have the following attribute:
	*
	*  onclick="hilite_elem('grid_fill')"
	*
	* Where 'grid_fill' is replaced by the name of the SVG element that should
	* be highlighted whenever that radio button is click on.
	* For the "No Highlights" radio button the 'grid_fill' is replaced by ''.
	*/
	/*
	* This function highlights various elements of the SVG picture.
	* It is called when the user clicks on any of the radio buttons in
	* the form below.
	* The highlighting is done by changing the opacity of the elements.
	* The highlighted element's opacity is set to 1.0 while all other
	* elements' opacities are set to 0.1.
	* To remove all highlighting, call the function with an empty string
	* for element_name. This returns all elements' opacities to their
	* original settings.
	*/
	function hilite_elem (element_name)
	{
		var svgobj;
		var svgstyle;
		var svgdoc = document.SVG02c.getSVGDocument();
		// For each element, get the element's style object, then set
		// its opacity based on whether no elements are highlighted
		// (original setting), some other element is highlighted
		// (de-emphasize), or this element is highlighted (emphasize).
		// gradient_star
		svgobj = svgdoc.getElementById('gradient_star');
		svgstyle = svgobj.getStyle();
		if (!element_name)
		{
			// Reset to normal.
			svgstyle.setProperty("fill-opacity", "1.0");
		}
		else if (element_name != 'gradient_star')
		{
			// De-emphasize this element.
			svgstyle.setProperty("fill-opacity", "0.1");
		}
		else
		{
			// Emphasize this element.
			svgstyle.setProperty("fill-opacity", "1.0");
		}
		// grid_fill
		svgobj = svgdoc.getElementById('grid_fill');
		svgstyle = svgobj.getStyle();
		if (!element_name)
		{
			// Reset to normal.
			svgstyle.setProperty("fill-opacity", "0.3");
		}
		else if (element_name != 'grid_fill')
		{
			// De-emphasize this element.
			svgstyle.setProperty("fill-opacity", "0.1");
		}
		else
		{
			// Emphasize this element.
			svgstyle.setProperty("fill-opacity", "1.0");
		}
		// round_corners
		svgobj = svgdoc.getElementById('round_corners');
		svgstyle = svgobj.getStyle();
		if (!element_name)
		{
			// Reset to normal.
			svgstyle.setProperty("stroke-opacity", "0.5");
			svgstyle.setProperty("fill-opacity", "1.0");
		}
		else if (element_name != 'round_corners')
		{
			// De-emphasize this element.
			svgstyle.setProperty("stroke-opacity", "0.1");
			svgstyle.setProperty("fill-opacity", "0.1");
		}
		else
		{
			// Emphasize this element.
			svgstyle.setProperty("stroke-opacity", "1.0");
			svgstyle.setProperty("fill-opacity", "1.0");
		}
		// SVG
		svgobj = svgdoc.getElementById('SVG');
		svgstyle = svgobj.getStyle();
		if (!element_name)
		{
			// Reset to normal.
			svgstyle.setProperty("fill-opacity", "0.5");
		}
		else if (element_name != 'SVG')
		{
			// De-emphasize this element.
			svgstyle.setProperty("fill-opacity", "0.1");
		}
		else
		{
			// Emphasize this element.
			svgstyle.setProperty("fill-opacity", "1.0");
		}
		// coordinates
		svgobj = svgdoc.getElementById('coordinates');
		svgstyle = svgobj.getStyle();
		if (!element_name)
		{
			// Reset to normal.
			svgstyle.setProperty("fill-opacity", "1.0");
			svgstyle.setProperty("stroke-opacity", "1.0");
		}
		else if (element_name != 'coordinates')
		{
			// De-emphasize this element.
			svgstyle.setProperty("fill-opacity", "0.1");
			svgstyle.setProperty("stroke-opacity", "0.1");
		}
		else
		{
			// Emphasize this element.
			svgstyle.setProperty("fill-opacity", "1.0");
			svgstyle.setProperty("stroke-opacity", "1.0");
		}
	}
// -->
</script>
バウンディング・ボックスのレッスンに戻る