將HTML5畫布保存到MySql的詳細信息

我是新來的HTML5，我只想知道如何保存畫布數據（我在畫布上畫了一個正方形）。我想在數據庫上保存x，y，h，w或scale，並使用該數據重新創建繪圖。我怎樣才能做到這一點？將HTML5畫布保存到MySql的詳細信息

謝謝。

來源

2013-01-21 Kandy7

如果只將圖像存儲在數據庫中，您是需要所有數據還是足夠？ –

不是圖像。想要從數據庫重新加載後更改方形細節。 – Kandy7

這意味着您必須將數據存儲在某種JS數據結構中並將其推送到服務器。無法從您已繪製的對象中檢索數據。 –

那麼你可以將它們存儲到mysql數據庫或服務器文件中。

在mysql的情況下創建一個名爲實體的表，你想要的列或甚至1列並序列化你想存儲的數據。

例如

id | x | y | h | w | scale 
1 4 4 4 4 0.5

或

$object_cube = array(); 
$object_bube['x'] = 4; 
$object_bube['y'] = 4; 
$object_bube['h'] = 4; 
$object_bube['w'] = 4; 
$object_bube['s'] = 0.5;

然後進行序列化和創建PDO查詢

$host =  "localhost"; 
$user =  "someuser"; 
$pass =  "somepass"; 
$database = "db_name"; 

$db = new PDO("mysql:host=$host;dbname=$database", $user, $pass,array(PDO::MYSQL_ATTR_INIT_COMMAND => "SET NAMES utf8")) or die("Connection error!"); 
$ser_obj = serialize($object_cube); 
$query = "INSERT INTO entities ('cube') VALUES (:object)"; 
$params = array(':object' => $ser_obj); 
db_query($query, $params); 

function db_query($q,$p = array()) 
{ 
    global $db; 

    if($stmt = $db->prepare($query)) 
    { 

     if(count($p) > 0) 
     { 
      foreach ($p as $key => $value) { 
       $stmt->bindParam($key,$value); 
      } 
     } 

     $stmt->execute(); 

    } 

}

應該採取後節省的保養是由你來加載哪些你想通過挖掘數據庫，只要你需要它:)

您必須熟悉AJAX - >http://www.w3schools.com/ajax/default.asp 以及一些服務器端語言（如php或asp）。否則，您可以將其存儲在本地。

來源

2013-01-21 08:15:48 Syd

爲了訪問服務器上的數據庫，您需要一個服務器端應用程序，它從用戶Web瀏覽器接收數據，然後將其發送到數據庫。

客戶端和服務器之間的通信可以使用XmlHttpRequest或WebSockets來實現。

在服務器上運行的Web應用程序可以在NodeJS，PHP，ASP.NET，JSP，Django，Ruby on Rails或任何其他服務器端Web開發技術中實現。

或者，當您想要在沒有服務器端編程的情況下執行此操作時，也可以將數據本地存儲在用戶localStorage中。

來源

2013-01-21 08:13:28 Philipp

一個可能的解決方案是把所有的對象數據存儲在數組中，並把它發送到服務器之前對其進行序列化：

GraphicObjects = new Array(); 
GraphicObjects.push({ 
    x: 10, 
    y: 10, 
    w: 100, 
    h: 200, 
    scale: 0.5 
}); // Write a function for adding new objects, that's just an example 
$.post('urlToPostTo', data: GraphicObjects.stringify());

後來檢索JSON數據回重繪圖像。

來源

2013-01-21 08:27:15

將HTML5畫布保存到MySql的詳細信息

回答

相關問題