html怎么用js特效做折线图
使用原生js自己写或js库(框架)都是可以的,由于目前HTML5并不是所有的浏览器都完美支持,使用兼容性比较好的js库是个不错的选择。
例如Highcharts图标库就可以实现各类曲线图、折线图、区域图、3D图、柱状图等等。具体使用参考:http://www.hcharts.cn/demo/index.php。
Highcharts中做折线图的demo代码可以作为参考:
<html lang="en">
<head>
<script type="text/javascript" src="http://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="http://cdn.hcharts.cn/highcharts/highcharts.js"></script>
<script type="text/javascript" src="http://cdn.hcharts.cn/highcharts/exporting.js"></script>
<script>
$(function () {
$('#container').highcharts({
chart: {
type: 'line'
},
title: {
text: 'Monthly Average Temperature'
},
subtitle: {
text: 'Source: WorldClimate.com'
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
yAxis: {
title: {
text: 'Temperature (°C)'
}
},
tooltip: {
enabled: false,
formatter: function() {
return '<b>'+ this.series.name +'</b><br/>'+this.x +': '+ this.y +'°C';
}
},
plotOptions: {
line: {
dataLabels: {
enabled: true
},
enableMouseTracking: false
}
},
series: [{
name: 'Tokyo',
data: [7.0, 6.9, 9.5, 14.5, 18.4, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
}, {
name: 'London',
data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
}]
});
});
</script>
</head>
<body>
<div id="container" style="min-width:700px;height:400px"></div>
</body>
</html>
使用原生js自己写或js库(框架)都是可以的,由于目前HTML5并不是所有的浏览器都完美支持,使用兼容性比较好的js库是个不错的选择。
例如Highcharts图标库就可以实现各类曲线图、折线图、区域图、3D图、柱状图等等。具体使用参考:http://www.hcharts.cn/demo/index.php。
Highcharts中做折线图的demo代码可以作为参考:
<html lang="en">
<head>
<script type="text/javascript" src="http://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js">
</script>
<script type="text/javascript" src="http://cdn.hcharts.cn/highcharts/highcharts.js">
</script>
<script type="text/javascript" src="http://cdn.hcharts.cn/highcharts/exporting.js">
</script>
<script>
$(function () {
$('#container').highcharts({
chart: {
type: 'line'
},
title: {
text: 'Monthly Average Temperature'
},
ubtitle: {
text: 'Source: WorldClimate.com'
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
yAxis: {
title: {
text: 'Temperature (°C)'
}
},
tooltip: {
enabled: false,
formatter: function() {
return '<b>'+ this.series.name +'</b><br/>'+this.x +': '+ this.y +'°C';
}
},
plotOptions: {
line: {
dataLabels: {
enabled: true},
enableMouseTracking: false
}
},
series: [{
name: 'Tokyo',
data: [7.0, 6.9, 9.5, 14.5, 18.4, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
}, {
name: 'London',
data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
}]
});
});
</script>
</head>
<body>
<div id="container" style="min-width:700px;height:400px"></div>
</body>
</html>
html中如何用js实现提交表单
办法1.同一个页面中建立两个表单 各自提交:
<form action="?" name="form1" id="form1">
<!-- 表单内容 -->
<input type="submit" />
</form>
<form action="?" name="form1" id="form1">
<!-- 表单内容 -->
<input type="submit" />
</form>
办法2:如果非要只有一个表单的话,通过js提交:
<script type="text/javascript" language="javascript">
function submitYouFrom(path){
$('form1').action=path;
$('form1').submit();
}
</script>
<form action="?" name="form1" id="form1">
<!-- 表单内容 -->
<input type="button" value="提交1" onclick="submitYouFrom('地址一')"/>
<input type="button" value="提交2" onclick="submitYouFrom('地址二')"/>
</form>
可以用HTML5作图,之前都是用插件。
官方的那个demo不是android的,我只把官方里面的js类库,以及他里面的例子,整合了一下,放到android里面了,主要就是webView与JS交互
如果我的回答没能帮助您,请继续追问。