I installed Plotly.js with bower and added script reference in my view page but when I run my page, console says "Uncaught Reference error : Plotly is not defined"
below is my settings :
bower.json
{
"name": "ASP.NET",
"private": true,
"dependencies":
{
"bootstrap": "3.3.6",
"jquery": "2.1.4",
"jquery-validation": "1.15.0",
"jquery-validation-unobtrusive": "~3.2.6",
"gl-matrix": "~2.3.2",
"pixi": "~3.0.11",
"requirejs": "2.2.0",
"pixi-particles": "1.6.7",
"d3": "3.5.17",
"plotly.js": "~1.12.0"
},
"resolutions":
{
"jquery": "~2.2.4"
}
}
html page with script
@using System.Collections.Generic
@using Microsoft.AspNet.Http
@using Microsoft.AspNet.Authentication
@using WebApplication1.Controllers
@model PitchGraphViewModel
@{
ViewData["Title"] = "Example Page";
}
<meta charset="utf-8" />
<meta http-equiv="Cache-Control" content="no-cache" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<script type="text/javascript" src="~/lib/plotly.js/dist/plotly.js" charset="utf-8"></script>
<!DOCTYPE HTML>
<html>
<head>
<title>Webgl test page</title>
</head>
<body>
<canvas id="mycanvas" width="500" height="500"></canvas>
<div id="tester" style="width:600px;height:250px;"></div>
</body>
</html>
<script>
var TESTER = document.getElementById('tester');
Plotly.plot(TESTER, [{
x: [1, 2, 3, 4, 5],
y: [1, 2, 4, 8, 16]
}], {
margin: { t: 0 }
});
</script>
I tried requirejs shim config as this page but it failed : Using RequireJS to load plotly and D3
I checked plotly.js is downloaded on page visit with browser developer tool but 'Plotly' still remains undefined.