pText 1st plot

06 May 2020 - viridi - Sparisoma Viridi

An example of using pText first version plot.

It is still a pure JavaScript version which uses pairs of <script> and </script>. Suppose that there are data of $x$

1, 1, 20, 20, 40, 40, 60, 60, 80, 80, 100, 100, 110, 110, 120, 120, 130, 130, 140, 140, 150, 150, 160, 160, 170, 170, 180, 180, 190, 190, 199, 199,

and $y$

0, 100, 100, 0, 0, 100, 100, 0, 0, 100, 100, 0, 0, 100, 100, 0, 0, 100, 100, 0, 0, 100, 100, 0, 0, 100, 100, 0, 0, 100, 100, 0,

that can be used to draw a chart shown in Fig. fig-siqnal-square.

{ // xy-chart version: "0.0.8", label: "fig-siqnal-square", caption: "Square signal using pText", background: "#fff0f0", width: 200, height: 100, data: { x: [1, 1, 20, 20, 40, 40, 60, 60, 80, 80, 100, 100, 110, 110, 120, 120, 130, 130, 140, 140, 150, 150, 160, 160, 170, 170, 180, 180, 190, 190, 199, 199], y: [0, 100, 100, 0, 0, 100, 100, 0, 0, 100, 100, 0, 0, 100, 100, 0, 0, 100, 100, 0, 0, 100, 100, 0, 0, 100, 100, 0, 0, 100, 100, 0], }, type : "line", color: { line: "#f00", point: "#0e0", }, }

Insert a xy-chart

Fig. fig-siqnal-square can be obtained using following code

<ptext>
{ // xy-chart
	version: "0.0.8",
	label: "fig-siqnal-square",
	caption: "Graph with points",
	background: "#fafffa",
	width: 200,
	height: 100,
	data: {
		x: [1, 1, 20, 20, 40, 40, 60, 60, 80, 80, 100, 100, 110,
		110, 120, 120, 130, 130, 140, 140, 150, 150, 160, 160,
		170, 170, 180, 180, 190, 190, 199, 199],
		y: [0, 100, 100, 0, 0, 100, 100, 0, 0, 100, 100, 0, 0,
		100, 100, 0, 0, 100, 100, 0, 0, 100, 100, 0, 0, 100, 100,
		0, 0, 100, 100, 0],
	},
	type : "line",
	color: {
		line: "#f00",
		point: "#0e0",
	},
}
</ptext>

Referring a chart

Created figure can referred using

<ptref>fig-siqnal-square</ptref>

by putting it in a line, which produces fig-siqnal-square. Note hat the tag pairs <ptref> dan </ptref> should contain the right label, which is fig-siqnal-square in this case. Campare the value of label in the block of code and in the line referring it.

Plan

  1. Add default value of parameters, when some are not passed or defined.
  2. Introduce coordinate transformation for more convenient use.
  3. Make it can plot a function within x_range and y_range.
  4. Design better view, e.g. margin, axis, grid.
  5. Add option of marker types.
  6. Change the name <ptext> to <ptchar> for consistency with <ptref>?

Note

Feature of \ptref{label} in here is cancelled, since the behaviour is unpredictable. It also still access ```some code with \ptref{label}```, while <ptref>label</ptref> is easier to manage.