Buttons
Using the style and script tags you can trigger some actions on the elements created with the html function.
User defined function
⎘
% defining css properties
style = '<style> .select{ background:grey; } .option{ width:23%; height:20px; border:1px solid; margin-right:1%; } .option:hover{ cursor:pointer; } </style>'% defining HTML elements
body = '<div style="width:100%;"> <div class="option">option 1</div> <div class="option">option 2</div> <div class="option">option 3</div> <div class="option">option 4</div> <button style="width:100%;" onclick="clearclass()">clear selection</button> </div>'% defining jQuery functions
% function activated when clicking options
% clearclass: function activated when clicking button
script = '<script> $(".option").on("click",function(){ $(this).toggleClass("select") }) function clearclass(){ $(".option").removeClass("select"); }</script>' html([style body script])
option 1
option 2
option 3
option 4
mathlayer® JavaScript function
mathlayer® graphs are generated by some HTML elements and jQuery functions. With the html function we can access them to control its behaviour.⎘
% 3D GRAPH
o1 = struct o1.markerStroke3d = 'gradient' o1.markerFill = 'none' o1.show = false a1=scatter3(rand(20),rand(20),rand(20),o1)% BUTTON: use of function rotate(p,y) with p as pitch and y as yaw values of the graph
a2 = html('<button onclick="rotate(0,0.5)" style="width:450px;">rotate</button>',o1) assemble({a1,a2})
See also
Reports - Generating Reports2D graphs - Secondary Axis
2D graphs - Formatting Axes
HTML - HTML Elements
2D graphs - Adding Legends
Reports - Comparing Assembled Graphs
Reports - Controlling Report Width
HTML - Tips To Control HTML Tables
2D graphs - Control Bars Color