通过按钮触发
html
<script src="jquery.min.js"></script>
<div id=qzs style="width: 382px;height:282px;position:absolute; background-color:#ff0000; left: 109px; top: 133px;"><a href="#" onClick=setInterval("shoppingcat()",1)
>点击我就运行js -jquery函数</a></div>
js
function shoppingcat(){
document.getElementById("qzs").style.display = "none"//不显示
//document.getElementById("qzs").style.display = "block"//显示
}
http://jquery.cuishifeng.cn/jQuery.Ajax.html
一、通过按钮触发运行
document.getElementById("qzs") 通过div 的id定位 选择 改变对象
二、直接打开网页就运行 通过 ajax 联系 php 到数据库 取数据 还要打包成json格式
json 格式 {} 对象 【】数组
var myChart = echarts.init(document.getElementById('bar_week'));
var arr1=[],arr2=[],arr3=[];
function arrTest(){
$.ajax({
type:"post",
async:false,
url:"data.php",
data:{},
dataType:"json",
success:function(result){
//{"daming":[53,54,53],"ming":[56,59,57],"jin":[62,114,93],"zuo":[58,113,90]}
//[{"public_zao":53,"public_zhong":54,"public_wan":53}]
if (result) {
for (var i = 0; i < result.length; i++) {
arr1.push(result[i].public_zao);
arr2.push(result[i].public_zhong);
arr3.push(result[i].public_wan);
}
}
}
})
return arr1,arr2,arr3;
}
arrTest();
var option = {
tooltip: {
show: true
},
legend: {
data:['早餐报餐']
},
xAxis : [
{
type : 'category',
//data : arr1
data: ["大明天","明天","今天","昨天"]
}
],
yAxis : [
{
type : 'value'
}
],
series : [
{
"name":"早餐报餐",
"type":"bar",//funnel bar 柱形图
"data":arr1,
//barWidth : 39, //柱体大小
itemStyle: { //上方显示数值
normal: {
label: {
show: true, //开启显示
position: 'top', //在上方显示
textStyle: { //数值样式
color: 'black',
fontSize: 16
}
}
}
}
}
]
};
// 为echarts对象加载数据
myChart.setOption(option);
// }