Я хочу создать несколько слайдов, Javascript, и используйте Reveal библиотеки и следовать шаблону https://github.com/hakimel/reveal.js/blob/master/index.htmlКак исправить JavaScript «анонимная функцию»
и планирую встроить диаграммы в слайды библиотеки echarts и следуйте это демо http://ecomfe.github.io/echarts/doc/start-en.html
Я поместил эти две библиотеки, следуя каталогу без каких-либо изменений в echarts/library.
|--echarts-2.2.0
|--reveal.js
\--mySlides.html
Когда я слит эти два демо вместе, я получил «анонимные функции» из «require.config». Не знаю, как отладить его. Кто-нибудь может это помочь? Благодарю.
Uncaught ReferenceError: Reveal не определен (анонимную функция) mySlides.html: 36
mySlides.html
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>reveal.js - The HTML Presentation Framework</title>
<meta name="description" content="A framework for easily creating beautiful presentations using HTML">
<meta name="author" content="Hakim El Hattab">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui">
<link rel="stylesheet" href="reveal.js/css/reveal.css">
<link rel="stylesheet" href="reveal.js/css/theme/black.css" id="theme">
<!-- Code syntax highlighting -->
<link rel="stylesheet" href="reveal.js/lib/css/zenburn.css">
</head>
<body>
<div class="reveal">
<!-- Any section element inside of this container is displayed as a slide -->
<div class="slides">
<section id="page1" data-background="#ff0000">
<div id="main" style="height:400px"></div>
<!-- ECharts单文件引入 -->
<script src="echarts-2.2.0/build/dist/echarts.js"></script>
<script type="text/javascript">
require.config({
paths: {
echarts: 'echarts-2.2.0/build/dist'
}
});
// 使用
require(
[
'echarts',
'echarts/chart/bar'
],
function (ec) {
var myChart = ec.init(document.getElementById('main'));
var option = {
tooltip: {
show: true
},
legend: {
data:['销量']
},
xAxis : [
{
type : 'category',
data : ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
}
],
yAxis : [
{
type : 'value'
}
],
series : [
{
"name":"销量",
"type":"bar",
"data":[5, 20, 40, 10, 10, 20]
}
]
};
myChart.setOption(option);
}
);
</script>
</section>
<section id="page2"><p>Page2</p></section>
</div>
</div>
<script src="reveal.js/lib/js/head.min.js"></script>
<script src="reveal.js/js/reveal.js"></script>
<script>
// Full list of configuration options available at:
// https://github.com/hakimel/reveal.js#configuration
Reveal.initialize({
controls: true,
progress: true,
history: true,
center: true,
transition: 'slide', // none/fade/slide/convex/concave/zoom
// Optional reveal.js plugins
dependencies: [
{ src: 'reveal.js/lib/js/classList.js', condition: function() { return !document.body.classList; } },
{ src: 'reveal.js/plugin/markdown/marked.js', condition: function() { return !!document.querySelector('[data-markdown]'); } },
{ src: 'reveal.js/plugin/markdown/markdown.js', condition: function() { return !!document.querySelector('[data-markdown]'); } },
{ src: 'reveal.js/plugin/highlight/highlight.js', async: true, condition: function() { return !!document.querySelector('pre code'); }, callback: function() { hljs.initHighlightingOnLoad(); } },
{ src: 'reveal.js/plugin/zoom-js/zoom.js', async: true },
{ src: 'reveal.js/plugin/notes/notes.js', async: true }
]
});
</script>
</body>
Uncaught ReferenceError: Reveal не определен (анонимная функция) \t mySlides.html: 37 Uncaught Ошибка: Несовместимость анонимного определения() модуля: функция() { \t \t \t root.Reveal = завод() ; \t \t \t return root.Reveal; \t \t} http://requirejs.org/docs/errors.html#mismatch makeError \t require.js: 166 intakeDefines \t require.js: 1236 (анонимная) функция \t require.js: 1423 –
После просмотра в вашем коде немного ближе, есть и ряд других вещей, которые также выглядят проблематичными. Почему вы включаете так много файлов, используя теги скриптов, если вы используете requirejs? Например, файл echartsjs включен в строку 31, а затем снова требуется в строке 42. Кроме того, если «dist» - это папка, в которой находится echarts, почему вы указываете requirejs, что это файл javascript? Я никогда не использовал ни одну из этих библиотек, поэтому я, возможно, не очень много помогу, но сначала я должен был прочитать на requirejs, а затем постепенно наращивать вашу страницу. – user2027202827
Возможно, начните со страницы, используя строгое раскрытие, и после того, как она работает правильно, попробуйте добавить библиотеку диаграмм, чтобы в конце вашего журнала ошибок не появлялся небольшой роман. – user2027202827