引用的js包有3个。顺序是1.mui.min.js 2.jquery.min.js 3.highstock-all.js。用的时候报错[ERROR] : TypeError: undefined is not an object (evaluating 'j.info')
file name:myjs/highstock.js
line no:332
看了下是说highstock.js里面有代码识别不了。想大神帮忙看看这是什么问题,js包都是官网下的应该不会有错。是不是引用冲突的问题?望大神们帮忙解答。谢谢
代码如下:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Hello MUI</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link href="css/mui.min.css" rel="stylesheet" />
</head>
<body>
<div class="mui-content">
<div class="mui-row">
<div class="mui-col-sm-12 mui-col-xs-12">
<div class="chart" id="main" style="min-width: 100%; height: 100%;">Highstock图表</div>
</div>
</div>
<div class="mui-row">
<div class="mui-col-sm-12 mui-col-xs-12">
<div class="mui-btn mui-btn-primary mui-col-sm-12 mui-col-xs-12" id="price">价格</div>
</div>
</div>
<div class="mui-row">
<div class="mui-col-sm-12 mui-col-xs-12">
<a class="mui-btn mui-btn-danger mui-col-sm-6 mui-col-xs-6 mui-pull-right" href="#"><span>看涨</span></a>
<a class="mui-btn mui-btn-success mui-col-sm-6 mui-col-xs-6" href="#"><span>看跌</span></a>
</div>
</div>
</div>
<script src="js/mui.min.js"></script>
<script src="myjs/jquery.min.js"></script>
<!--<script src="libs/highstock-all.js"></script>-->
<script src="myjs/highstock.js"></script>
<script>
$.noConflict();
//行情数据格式:{时间,货币编号,买价,卖价}
function Obj(Time, Symbol, BuyPrice, SellPrice)
{
this.DtTime = Time;
this.Hb = Symbol;
this.Price = BuyPrice;
this.AskPrice = SellPrice;
};
var HistoryFormData={
TaskGuid:"ab8495db-3a4a-4f70-bb81-8518f60ec8bf",
UserID:"",
DataType: "MT4DataHistory",
Top: "100",
Type: "FDXZ6"
};
//全局变量用于获取当前时间的毫秒值
var getdate;
//websocket对象用于建立连接
var socket;
//全局变量用于接收当前的行情数据和上一个接收到的数据
var obj_New,obj_Pre;
//全局变量highstock图表的数据源
var series;
//图表对象
var chart = null;
// var host = "ws://139.196.207.149:2012";
var host = "ws://192.168.85.144:2012";
// var host = "ws://127.0.0.1:2014/WebSocketChatDemo";
// var host = "ws://127.0.0.1:8080/ChatWebSocket";
// var host = "ws://139.196.242.162:2012";
mui.init({
swipeBack: false,
statusBarBackground: '#f7f7f7',
gestureConfig: {
doubletap: true
}
});
mui.plusReady(function(){
//仅支持竖屏显示
plus.screen.lockOrientation("portrait-primary");
try {
//highstock图表的全局定义
Highcharts.setOptions({
global: {
useUTC: false//世界标准时间,如果为true,中国的时间经highcharts处理会减8个小时
},
lang: {
rangeSelectorZoom: '', // hidden the text 'Zoom' show in chart
loading:'数据载入中...'
},
credits: {
enabled: false//去掉右下角的标志
},
zoom: {
enabled: false//去掉右下角的标志
},
//animation: {
// enabled: false//去掉动画
// },
// exporting: {
// enabled: false//去掉截图
// }
});
//
var strjson=JSON.stringify(HistoryFormData);//获取历史行情参数json序列化
console.log(strjson);
mui.ajax('http://139.196.207.149:10015/WebDB.asmx/TransformData', {
data: {
"user": strjson
},
type: 'POST', //HTTP请求类型
dataType: 'json', //服务器返回json格式数据
timeout: 100000, //超时时间设置为10秒;
headers: {
'Content-Type': 'application/json'
},
success: function(data) {
console.log("success");
//服务器返回响应,根据响应结果,分析是否登录成功;
var jsons = data.d;
// console.log(jsons);
var v_date = new Date();
console.log("服务器返回值" + v_date.toTimeString());
console.log(jsons);
DrawHistroyData(jsons);
// $("#price").html(obj_New.Price);
},
error: function(xhr, type, errorThrown) {
mui.toast("当前网络不给力,请稍后再试");
console.log(xhr + type + errorThrown);
}
});
if ("WebSocket" in window) {
socket = new WebSocket(host);//wss://192.168.85.12:4141/chat 表示进行加密传输的websocket协议。
}
else if ("MozWebSocket" in window) {
socket = new MozWebSocket(host);
}
socket.onopen = function (openEvent) {
//document.getElementById("serverStatus").innerHTML = 'WebSocket Status:: Socket Open';
if (window.console)
console.log('WebSocket Status:: Socket Open');
};
socket.onmessage = function (messageEvent) {
console.log(messageEvent.data);
if (messageEvent.data instanceof Blob)//messageEvent.data是不是二进制大对象
{
var destinationCanvas = document.getElementById('destination');
var destinationContext = destinationCanvas.getContext('2d');
var image = new Image();
image.onload = function () {
destinationContext.clearRect(0, 0,
destinationCanvas.width, destinationCanvas.height);
destinationContext.drawImage(image, 0, 0);
}
image.src = URL.createObjectURL(messageEvent.data);
}
else {
console.log(messageEvent.data);
//document.getElementById("serverResponse").innerHTML = 'Server Reply:: ' + messageEvent.data;
if (series != undefined)
{
if (messageEvent.data.toString().indexOf("Data") == 0)
{
var strs = new Array(); //定义一数组
strs = messageEvent.data.split(","); //字符分割
}
}
else
{
console.log("初始化失败!");
}
};
};
socket.onerror = function (errorEvent) {
//document.getElementById("serverStatus").innerHTML = 'WebSocket Status:: Error was reported';
if (window.console)
console.log('WebSocket Status:: Error was reported');
if ("WebSocket" in window) {
socket = new WebSocket(host);//wss://192.168.85.12:4141/chat 表示进行加密传输的websocket协议。
}
else if ("MozWebSocket" in window) {
socket = new MozWebSocket(host);
}
};
socket.onclose = function (closeEvent) {
//document.getElementById("serverStatus").innerHTML = 'WebSocket Status:: Socket Closed';
if (window.console)
console.log('WebSocket Status:: Socket Closed');
};
}
catch (exception) { if (window.console) console.log(exception); }
//function sendTextMessage() {
// if (socket.readyState != WebSocket.OPEN) return;
// //var e = document.getElementById("textmessage");
// socket.send("你好");
//}
//function sendBinaryMessage() {
// if (socket.readyState != WebSocket.OPEN) return;
// //var sourceCanvas = document.getElementById('source');
// socket.send(sourceCanvas.msToBlob());
//}
});
//获取当前时间的详细信息
function xAialStartEndPoint() {
var date = new Date();
var a = {
year: date.getFullYear(),
month: (date.getMonth()+1),
day: date.getDate(),
hour: date.getHours(),
minute: date.getMinutes(),
second: date.getSeconds(),
week:date.getDay()
}
//console.log(a);
return a;
}
//商品交易时间
function WorkTime(Symbol) {
switch (Symbol)
{
case "美原油":
{
if ((xAialStartEndPoint().week != 0 && xAialStartEndPoint().week != 6
&& ((Date.parse(new Date().toString()) < Date.parse(new Date().toDateString() + " " + "03:50:00"))
|| (Date.parse(new Date().toString()) > Date.parse(new Date().toDateString() + " " + "09:15:00"))))
|| ((Date.parse(new Date().toString()) < Date.parse(new Date().toDateString() + " " + "03:50:00"))
&& (xAialStartEndPoint().week == 6))
)
{
return true;
}
else
{
return false;
}
break;
}
case "恒生指数":
{
if ((xAialStartEndPoint().week != 0 && xAialStartEndPoint().week != 6
&& (Date.parse(new Date().toString()) < Date.parse(new Date().toDateString() + " " + "12:00:00"))
&& (Date.parse(new Date().toString()) > Date.parse(new Date().toDateString() + " " + "09:15:00")))
|| (xAialStartEndPoint().week != 0 && xAialStartEndPoint().week != 6
&& (Date.parse(new Date().toString()) < Date.parse(new Date().toDateString() + " " + "16:15:00"))
&& (Date.parse(new Date().toString()) > Date.parse(new Date().toDateString() + " " + "13:00:00")))
)
{
return true;
}
else
{
return false;
}
break;
}
case "德国指数":
{
if ((xAialStartEndPoint().week != 0 && xAialStartEndPoint().week != 6
&& ((Date.parse(new Date().toString()) < Date.parse(new Date().toDateString() + " " + "04:00:00"))
|| (Date.parse(new Date().toString()) > Date.parse(new Date().toDateString() + " " + "14:00:00"))))
|| ((Date.parse(new Date().toString()) < Date.parse(new Date().toDateString() + " " + "04:00:00"))
&& (xAialStartEndPoint().week == 6))
) {
return true;
}
else {
return false;
}
break;
}
}
}
//获取历史数据初始化highstock图表
function DrawHistroyData(data)
{
// var stockdata = JSON.parse(data);
var stockdata = eval(data);
console.log(stockdata);
//新建图表并初始化
chart=new Highcharts.StockChart({
chart: {
//关闭平移
//panning:false,
//zoomType: 'none',
//pinchType:'none',
renderTo:"main",
margin: [20, 5,25, 75],//外边框和绘图区的距离
spacing: [0,0,0,0],//外边框和标签,按钮等内容的距离
backgroundColor: '#014d87',//图表背景颜色
//backgroundColor: '',
borderColor: '#EBBA95', //图表外边框
borderWidth: 0,
borderRadius: 10,
//plotBackgroundColor: '#014d87',//绘图区域的背景色
plotBackgroundColor: '',
plotBorderColor: '#3C94C4',
plotBorderWidth: 2, //绘图边框
//plotShadow: true,
events: {
load: function () {
series = this.series[0];
//setInterval(Time_1S = function() {
// if (socketflage)//保证websocket没有接受到最新数据
// {
// obj_New.Time = new Date().getTime();
// var b = {
// x: parseInt(obj_New.Time),
// y: parseFloat(obj_New.BuyPrice),
// //name: parseFloat(obj_New.SellPrice).toString()
// };
// series.addPoint(b, true, false);
// if ((series.xData[0] + 3 60 1000) < parseInt(obj_New.Time)) {
// series.removePoint(0);
// }
// //chart.redraw();
// //series.yAxis.removePlotLine('old');
// //series.yAxis.addPlotLine({
// // id: 'old',
// // color: 'green', //线的颜色,定义为红色
// // dashStyle: 'dash',//标示线的样式,默认是solid(实线),这里定义为长虚线
// // value: obj_New.BuyPrice, //定义在哪个值上显示标示线,这里是在x轴上刻度为3的值处垂直化一条线
// // width: 2 //标示线的宽度,2px
// //});
// }
//}, 1000);
}
},
},
tooltip: {
backgroundColor: '#FCFFC5', // 背景颜色
borderColor: 'black', // 边框颜色
borderRadius: 10, // 边框圆角
borderWidth: 3, // 边框宽度
//shadow: ture, // 是否显示阴影
//animation: true, // 是否启用动画效果
style: { // 文字内容相关样式
color: "#ff0000",
fontSize: "12px",
fontWeight: "blod",
fontFamily: "Courir new",
},
crosshairs: [{ // 设置准星线样式
width: 1,
color: 'green',
dashStyle: 'longdashdot',
}, {
width: 1,
color: "green",
dashStyle: 'longdashdot',
zIndex: 100
}],
positioner: function () { //固定位置显示提示框
return {
x: 60,
y: 80
}
},
//dateTimeLabelFormats: {
// millisecond: "%A, %b %e, %H:%M:%S.%L",
// second: "%A, %b %e, %H:%M:%S",
// minute: "%A, %b %e, %H:%M",
// hour: "%A, %b %e, %H:%M",
// day: "%A, %b %e, %Y",
// week: "Week from %A, %b %e, %Y",
// month: "%B %Y",
// year: "%Y"
//},
formatter: function () {
//console.log(this.points);
var s = '<b>' + Highcharts.dateFormat("%A,%b %e,%H:%M:%S", this.x) + '</b>';
$.each(this.points, function () {
s += '<br/>价格:' + this.y;
//s += '<br/>buy price:' + this.y + '<br/>sell price:' + this.point.name;
});
//s += '<br/>buy price:' + this.y + '<br/>sell price:' + this.points[0].key;
return s;
},
shared: true,//多y轴情况下
useHTML: true,
},
plotOptions: {
line: {
color: 'red'//折线图的颜色
}
},
//rangeSelector: {
// buttonTheme: {
// //display: 'none', // 不显示按钮
// width: 50,
// height: 20
// },
// buttons: [{
// count: 1,
// type: 'minute',
// text: '1M'
// },
// {
// type: 'all',
// text: 'All'
// }],
// inputEnabled: false,// 不显示日期输入框
// selected: 0
//},
//title: {
// text: 'Live random data'
//},
navigator: { enabled: false },
scrollbar: { enabled: false },
rangeSelector: { enabled: false },
credits: { enabled: false },
series: [{
name: '最新价',
data: (function () {
var data = [], i;
if (stockdata.length > 0) {
for (i = 0; i < stockdata.length-1; i++) {
var a = {
x: parseInt(Date.parse(stockdata[i].DtTime)),
y: parseFloat(stockdata[i].Price),
//name: parseFloat(stockdata[i].SellPrice).toString(),
};
data.push(a
//[
//parseInt(stockdata[i].Time),
//parseFloat(stockdata[i].BuyPrice),
//parseFloat(stockdata[i].SellPrice),
//]
);
}
//保存历史数据最近的一个数据
obj_New = new Obj(Date.parse(stockdata[stockdata.length - 1].DtTime), stockdata[stockdata.length - 1].Hb, stockdata[stockdata.length - 1].Price, stockdata[stockdata.length - 1].AskPrice);
}
else {
var a = {
x: parseInt((new Date().getTime() - 2 * 60 * 1000)),
y: parseFloat(0),
//name: parseFloat(stockdata[i].SellPrice).toString(),
};
data.push(a
//[
//parseInt(stockdata[i].Time),
//parseFloat(stockdata[i].BuyPrice),
//parseFloat(stockdata[i].SellPrice),
//]
);
//保存历史数据最近的一个数据
obj_New = new Obj(a.x, "HKX6", a.y, a.y);
}
console.log(data);
return data;
}())
}],
xAxis: {
type: 'datetime',
//min: new Date(xAialStartEndPoint().year, xAialStartEndPoint().month, xAialStartEndPoint().day, xAialStartEndPoint().hour - 1, xAialStartEndPoint().minute).getTime(),
//min: stockdata[stockdata.length - 1].Time,
//max: new Date(xAialStartEndPoint().year, xAialStartEndPoint().month, xAialStartEndPoint().day, xAialStartEndPoint().hour, xAialStartEndPoint().minute, xAialStartEndPoint().second).getTime(),
//tickInterval:1000,//x轴的间隔
gridLineDashStyle: 'solid',
gridLineWidth: 1,
gridLineColor: '#d0d0d3',
tickLength: 10,
tickWidth: 1,
tickPosition: 'inside',
lineWidth:0,
//events:{
// setExtremes: function (e) {
// console.log(e);
// var xMin = e.min;
// var xMax = e.max;
// var zmRange = computeTickInterval(xMin, xMax);
// this.chart.xAxis[0].options.tickInterval =zmRange;
// this.chart.xAxis[0].isDirty = true;
// },
//},
//tickPixelInterval: 50,
//ordinal: false,
//min: minTime,//minTime 与maxTime 都是变量
//max: maxTime,
//showFirstLabel: true,
//showLastLabel: true,
labels: {
formatter: function () {
return Highcharts.dateFormat('%H:%M:%S', this.value);
},
style: { "color": "white" }
},
units: [['minute', [1]
]],
},
yAxis: {
showFirstLabel: true,
showLastLabel: true,
//events:{
// setExtremes: function(e) {
// var xMin = e.min;
// var xMax = e.max;
// var zmRange = computeTickInterval(xMin, xMax);
// this.chart.yAxis[0].options.tickInterval =zmRange;
// this.chart.yAxis[0].isDirty = true;
// },
labels: {
align:'right',
//staggerLines:6,
style: { "color": "white" },
formatter: function () {
return this.value;
//var str = this.value.toString();
//if (str.indexOf(".") == -1)
//{
// return this.value;
//}
//else
//{
// return this.value.toFixed(2);//这里是两位小数
//}
}
},
//plotLines: [{
// id:'old',
// color:'green', //线的颜色,定义为红色
// dashStyle:'dash',//标示线的样式,默认是solid(实线),这里定义为长虚线
// value:obj_New.BuyPrice, //定义在哪个值上显示标示线,这里是在x轴上刻度为3的值处垂直化一条线
// width:2 //标示线的宽度,2px
//}],
gridLineDashStyle: 'solid',
gridLineWidth: 1,
gridLineColor: '#d0d0d3',
opposite: false,//y轴显示在左边
offset: -10,//标签距离y轴的距离
},
})
}
</script>
</body>
</html>
1 个回复
小虎虎
可以不用 JQuery.js
把这个包去掉就可以了