javascript - Chartjs won't render chart with Requirejs -
javascript - Chartjs won't render chart with Requirejs -
i trying render chart using chartjs , requirejs, fails render or provide error messages. know tired , missing obvious, can't seem figure out.
the line in html hold canvas chart follows:
<canvas id="canvas" height="450" width="600"></canvas> my requirejs file follows. here suspect issue:
require.config({ paths: { jquery: "jquery-2.1.1.min", bootstrap: "bootstrap.min", chartjs: "chart.min" }, shim: { bootstrap: { deps: ['jquery'], exports: 'bootstrap' }, } }); requirejs(['bootstrap'], function (bootstrap) { homecoming {}; }); require(['chartjs'], function (chart) { // utilize chart.js normal here. var randomscalingfactor = function () { homecoming math.round(math.random() * 100) }; var linechartdata = { labels: ["january", "february", "march", "april", "may", "june", "july"], datasets: [ { label: "my first dataset", fillcolor: "rgba(220,220,220,0.2)", strokecolor: "rgba(220,220,220,1)", pointcolor: "rgba(220,220,220,1)", pointstrokecolor: "#fff", pointhighlightfill: "#fff", pointhighlightstroke: "rgba(220,220,220,1)", data: [randomscalingfactor(), randomscalingfactor(), randomscalingfactor(), randomscalingfactor(), randomscalingfactor(), randomscalingfactor(), randomscalingfactor()] }, { label: "my sec dataset", fillcolor: "rgba(151,187,205,0.2)", strokecolor: "rgba(151,187,205,1)", pointcolor: "rgba(151,187,205,1)", pointstrokecolor: "#fff", pointhighlightfill: "#fff", pointhighlightstroke: "rgba(151,187,205,1)", data: [randomscalingfactor(), randomscalingfactor(), randomscalingfactor(), randomscalingfactor(), randomscalingfactor(), randomscalingfactor(), randomscalingfactor()] } ] } window.onload = function () { var ctx = document.getelementbyid("canvas").getcontext("2d"); window.myline = new chart(ctx).line(linechartdata, { responsive: true }); } // chart.noconflict restores chart global variable it's previous owner // function returns chart, allowing reassign. var chartjs = chart.noconflict(); });
what describe consistent event handler give window.onload not beingness fired @ all.
by time requirejs starts executing code in require(['chartjs'] call, load event has happened. utilize jquery's ready or requirejs' domready.
by way, code bizarre:
requirejs(['bootstrap'], function (bootstrap) { homecoming {}; }); if loading bootstrap, cut down requirejs(['bootstrap']). note loads asynchronous thing tell requirejs load bootstrap, happen @ indeterminate point in future.
javascript requirejs chart.js
Comments
Post a Comment