wushenghua/vczero.github.io
1
0
Fork 0
mirror of https://github.com/wu736139669/vczero.github.io.git synced 2026-08-05 06:23:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

add canvas

Browse Source
This commit is contained in:
lh_wang
2015-08-06 14:52:22 +08:00
parent ae98b16bbb
commit 7861eb67cb
4 changed files with 63 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
meitu/css/main.css
+7 -1
View File
@@ -137,7 +137,7 @@ html body {
margin-right: auto;
}
.tools_items>div:last-child {
margin-top: -4px;
margin-top: -2px;
}
.tools_items i {
font-size: 18px;
@@ -201,6 +201,12 @@ html body {
min-height:200px;
background-color:#fff;
opacity:0.8;
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
-ms-transform: translateZ(0);
-o-transform: translateZ(0);
transform: translateZ(0);
}
meitu/index.html
+21 -2
View File
@@ -1,14 +1,33 @@
<!DOCTYPE html>
<html style="width:100%;height:100%;">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!--360极速模式-->
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="format-detection" content="telephone=no" searchtype="map">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="apple-mobile-web-app-title" content="美途">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,minimal-ui">
<meta name="misapplication-tap-highlight" content="no"/>
<!-- uc强制竖屏 -->
<meta name="screen-orientation" content="portrait">
<!-- QQ强制竖屏 -->
<meta name="x5-orientation" content="portrait">
<!-- UC强制全屏 -->
<meta name="full-screen" content="yes">
<!-- QQ强制全屏 -->
<meta name="x5-fullscreen" content="true">
<!-- UC应用模式 -->
<meta name="browsermode" content="application">
<!-- QQ应用模式 -->
<meta name="x5-page-mode" content="app">
<!-- windows phone 点击无高光 -->
<meta name="msapplication-tap-highlight" content="no">
<title>美途</title>
<link rel="apple-touch-icon-precomposed" sizes="180x180" href="retinahd_icon.png">
<link type="text/css" rel="stylesheet" href="css/main.css"/>
<link type="text/css" rel="stylesheet" href="css/font-awesome.css"/>
</head>
@@ -75,7 +94,7 @@
</div>
<!--路线图-->
<div class="router sh">
<canvas id="router_canvas" ></canvas>
</div>
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=6a1180467b5f36714645d22044535ab7"></script>
meitu/js/home/router.js
+32
View File
@@ -0,0 +1,32 @@
/*canvas绘制路线*/
define('home/router', function(require, exports, module) {
var $ = require('lib/zepto');
var canvas = $('#router_canvas')[0];
var ctx = canvas.getContext('2d');
canvas.width = 40;
canvas.height = 200;
//line
ctx.beginPath();
var gradient = ctx.createLinearGradient(20, 5, 20, 195);
gradient.addColorStop(0, 'red');
gradient.addColorStop(1, 'yellow');
ctx.lineWidth = '2';
ctx.strokeStyle = gradient;
ctx.moveTo(20, 5);
ctx.lineTo(20, 195);
ctx.closePath();
ctx.stroke();
//circle
for(var i = 0; i < 7; i++){
ctx.beginPath();
ctx.fillStyle = '#0091FF';
ctx.arc(20, 25 + i * 25, 5, 0, Math.PI*2, true);
ctx.closePath();
ctx.fill();
}
});
meitu/js/main.js
+3 -2
View File
@@ -7,8 +7,9 @@ requirejs([
'lib/zepto_pj',
'home/map',
'lib/underscore',
'home/dashboard'
'home/dashboard',
'home/router'
],
function(zepto_pj, map, underscore) {
function(zepto_pj, map, underscore, router) {
});