• General
    • Home
    • Contact Us
    • Privacy Policy
    • Sitemap
  • Photographs
    • 2018
    • 2017
    • 2016
    • 2015
  • Literature
    • Poems
  • News
    • Announcements
    • Charity
    • Legal
    • Medicine
    • Politics
  • Education
    • Code Samples
      • Basic
      • Simple
      • Intermediate
      • Advanced
      • Tips
    • History
    • Literature
    • Quotes
    • Videos
    • Vocabulary
  • Entertainment
    • Art
    • Humor
    • Photos
    • Video
  • Technology
    • Software
      • Support
      • Tweaks
    • Company
    • Science
    • Security
Major Mike

Knowledge is Power - Share the Power

SVG Graph [INTERMEDIATE]

September 22, 2015 by GµårÐïåñ

Function graphing using SVG as a canvas.

		<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
		<script src="ASCIIsvg.js"></script>

	<body style="background-color: silver;">
	<form name="makeGraph">
		<p><span id="fn"><strong style="font-size: 20pt;">Function : </strong>
		<input id="function" type="text" size="33" value="cos(x^3)+sin(x^2)+tan(x)" style="font-size: 18pt;">
		<input id="picture1input" type="hidden">
		<input type="color"  id="color" value="#0000FF">
		<input type="submit" name="button" id="button" value="Plot" style="font-size: 16pt; font-weight: bold; width: 75px;"></p>
	</form>
	<embed width="680" height="680" src="plot.svg">
	<script>
		$(function() {
			var x_Min, x_Max, y_Min, y_Max, graphWidth, graphHeight;
			graphWidth = graphHeight = 680;
			$("#picture1").attr("width", graphWidth);
			$("#picture1").attr("height", graphHeight);
			x_Min = y_Min = -10;
			x_Max = y_Max = 10;
			xGrid = yGrid = 1;
			$("#xGrid").attr("value", xGrid);
			$("#yGrid").attr("value", yGrid);
			$("#button").click(function(event) {
				event.preventDefault();
				if (fn == '') {
					fn = "0";
					fnACol = "gray"
				} else {
					fnACol = $("#color").val();
				}
				fn = $("#function").val();
				$("#picture1input").attr("value", 'setBorder(0);fontstyle="normal";initPicture(' + x_Min + ',' + x_Max + ',' + y_Min + ',' + y_Max + ');axes(' + xGrid + ',' + yGrid + ', "labels", ' + xGrid + ');stroke = fnACol;plot(fn);');
				updatePicture(0);
			});
		});
	</script>
DEMO | DOWNLOAD
FacebooktwitterredditpinterestlinkedinmailFacebooktwitterredditpinterestlinkedinmail
Posted in: Education, Intermediate Tagged: code, intermediate level, JavaScript, SVG
← Flickr API [INTERMEDIATE]
The Matrix [INTERMEDIATE] →

Show Your Support – We Don’t Believe in Disruptive Ads

Donate in one of two ways :
(BitCoin - preferred)
1BTshbqMSx5AHrDFLEa1YdPAy5EFzRSjr9
(PayPal)
September 2015
M T W T F S S
« Aug   Oct »
 123456
78910111213
14151617181920
21222324252627
282930  

Semper Fidelis

Always Faithful, Always Forward
United States Marine Corp

Places to find me:

StackExchange profile for GµårÐïåñ at StackExchange

CodeProject

Twitter : verified ➠Follow

GitHub ➠Follow @GuardianMajor

ello ➠

deviantArt profile for GµårÐïåñ on deviantArt

Facebook i have made a personal choice after their "name policy" witch hunt which repeats every 2 years it seems at the whim of the "bully mob" (even when they make you jump through hoops and verify you), to just quit it and be done with it, they are not worth my time. I don't need it, I don't miss it, in fact it has made my life more productive and void of gross hate, vitriol and drivel. To those who say they can't stay in touch if I am not on there, if you can't reach me because I am not on Facebook, then you are not trying AT ALL - therefore, good riddance.

Scribd profile for GµårÐïåñ on Scribd

NoScript/FLashGot (Informaction) profile for GµårÐïåñ on Informaction Forums

Subjects

1952 1911 1939 2000 1972 1915 NASA 1918 1776 1976 1863 1989 1957 1977 1937 England 1973 United States annual 1959 1889 1954 1979 New York 1962 1981 1993 1789 1982 1961 code has_audio 1846 1914 1898 vocabulary 1934 1908 1851 1902 history 1965 1922 1998 1938 1984 1974 1935 1967 1942 national park 1968 memorial 1940 1865 1917 daily pic 1812 1995 1990 1919 1933 1963 event 1958 has_video holiday 1947 1946 1859 1966 1960 Soviet Union 1980 1994 1986 1948 1970 1950 1870 1949 1978 1944 1901 1991 1943 1969 1964 1953 1955 1941 1971 1951 Germany 1956 1945 1983 1985 1975 1916

Archives

Access Options

  • Log in
  • Entries RSS
  • Comments RSS
  • ∞ Guardian International
🎔
Brought to You
by Guardian International

Copyright © 2007-2019 Major Mike | Privacy Policy | DMCA | Contact | About
fortitudo fortis defendit

McAfee SecureNorton by SymantecVirusTotal