JavaScript Chart
Set the showToolTips property of the jqxChart.
Author: http://jqwidgets.com
HTML
<link rel="stylesheet" href="http://jqwidgets.com/public/jqwidgets/styles/jqx.base.css">
<script src="http://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<div id='chartContainer' style="width:850px; height:500px">
</div>
JavaScript
$(document).ready(function () {
// prepare chart data as an array
var sampleData = [
{ Day: 'Monday', Running: 30, Swimming: 10},
{ Day: 'Tuesday', Running: 25, Swimming: 15 },
{ Day: 'Wednesday', Running: 30, Swimming: 10},
{ Day: 'Thursday', Running: 40, Swimming: 20 },
{ Day: 'Friday', Running: 45, Swimming: 20 },
{ Day: 'Saturday', Running: 30, Swimming: 20},
{ Day: 'Sunday', Running: 20, Swimming: 30 }
];
// prepare jqxChart settings
var settings = {
title: "Fitness & exercise weekly scorecard",
description: "Time spent in vigorous exercise by activity",
enableAnimations: true,
showLegend: true,
padding: { left: 10, top: 10, right: 15, bottom: 10 },
titlePadding: { left: 90, top: 0, right: 0, bottom: 10 },
source: sampleData,
colorScheme: 'scheme05',
xAxis: {
dataField: 'Day',
unitInterval: 1,
tickMarks: { visible: true, interval: 1 },
gridLinesInterval: { visible: true, interval: 1 },
valuesOnTicks: false,
padding: { bottom: 10 }
},
valueAxis: {
logarithmicScaleBase: 10,
logarithmicScale: true,
unitInterval: 1,
maxValue: 50,
title: { text: 'Time in minutes<br><br>' },
labels: { horizontalAlignment: 'right' }
},
seriesGroups:
[
{
// type: 'line',
type: 'scatter',
orientation:...