2 comments

djinn80 PURCHASED
How do you customize the JS of the Multi-Point Chart?
djinn80 PURCHASED
Apologies, to clarify, how do you customize the data inside the Multi Point Chart?

Looks like it is in "custom.js" but what is there now is a formula so hard to just "enter correct values" there without knowing what I'm entering.

Line 717 starts this:

/* ---------- Chart with points ---------- */
if($("#sincos").length)
{
var sin = [], cos = [];

for (var i = 0; i < 14; i += 0.5) {
sin.push([i, Math.sin(i)/i]);
cos.push([i, Math.cos(i)]);
}

var plot = $.plot($("#sincos"),
[ { data: sin, label: "sin(x)/x"}, { data: cos, label: "cos(x)" } ], {
series: {
lines: { show: true,
lineWidth: 2,
},
points: { show: true },
shadowSize: 2
},
grid: { hoverable: true,
clickable: true,
tickColor: "#dddddd",
borderWidth: 0
},
yaxis: { min: -1.2, max: 1.2 },
colors: ["#FA5833", "#2FABE9"]
});

function showTooltip(x, y, contents) {
$('<div id="tooltip">' + contents + '</div>').css( {
position: 'absolute',
display: 'none',
top: y + 5,
left: x + 5,
border: '1px solid #fdd',
padding: '2px',
'background-color': '#dfeffc',
opacity: 0.80
}).appendTo("body").fadeIn(200);
}

var previousPoint = null;
$("#sincos").bind("plothover", function (event, pos, item) {
$("#x").text(pos.x.toFixed(2));
$("#y").text(pos.y.toFixed(2));

if (item) {
if (previousPoint != item.dataIndex) {
previousPoint = item.dataIndex;

$("#tooltip").remove();
var x = item.datapoint[0].toFixed(2),
y = item.datapoint[1].toFixed(2);

showTooltip(item.pageX, item.pageY,
item.series.label + " of " + x + " = " + y);
}
}
else {
$("#tooltip").remove();
previousPoint = null;
}
});


$("#sincos").bind("plotclick", function (event, pos, item) {
if (item) {
$("#clickdata").text("You clicked point " + item.dataIndex + " in " + item.series.label + ".");
plot.highlight(item.series, item.datapoint);
}
});
}

Write a comment

This is a great way to give the seller feedback and ask them questions about their item.

You must sign in to write a comment

Sign in or sign up to make a purchase

$12
579Purchases

Licenses: Details »

Single application $12
Version:1.0.2
Type:
  • HTML Template
Bootstrap: Compatible with 2.2.x
Layouts:
  • Responsive
  • Fluid
Browsers:
  • IE 9, 10, 11
  • Latest Chrome
  • Latest Firefox
  • Latest Safari
Uses Less:No
Uses Sass:No
Categories:
Tags: admin, admin template, charts, css3, dashboard, html5, premium, responsive, template
Item#:WB0016FX5
Released:5 years ago
Updated:4 years ago
Sold exclusively on WrapBootstrap
creativelabs

creativelabs

Signed up 5 years ago

Need a front-end theme?

About Bootstrap

Bootstrap is designed to help people of all skill levels – designer or developer, huge nerd or early beginner. Use it as a complete kit or use it to start something more complex.

Unlike other front-end toolkits, Bootstrap was designed first and foremost as a styleguide to document not only its features, but best practices and living, coded examples.

Built to support new HTML5 elements and syntax with progressively enhanced components.

Browser support

Bootstrap is tested and supported in major modern browsers like Chrome, Firefox, and Internet Explorer.

Tested and supported in Chrome, Safari, Firefox, Internet Explorer, and Opera.
  • Latest Chrome
  • Latest Firefox
  • Latest Safari
  • Latest Edge
  • Internet Explorer 9/10/11
  • Latest Opera

Features & includes

Bootstrap provides an unparalleled array of features and reusable components that let you hit the ground running: