ejtile使用說明

by

ejtile可以玩密鋪，以及多聯骨牌，甚至可以玩桌遊。

下面介紹使用方法。

基本用法

html：

<div id="etmainouter"><svg id="etmain" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" width="480" height="480"></svg></div>
<img src="content.svg" class="hide ejtilesvg ejtileonload">

導入js：ejtilemoving.js

上方的svg#etmain是空的，所以需要img.hide.ejtilesvg.ejtileonload。程式會自動導入這個svg的內容。

也可以把svg內容直接粘貼至etmainouter中，則不需要下方的img。

進階用法

多個svg導入

如果有多個svg，可以像下面這樣列出：

<div class="savetolocalstorage">
  <img src="1.svg" class="ejtilesvg">
  <img src="2.svg" class="ejtilesvg">
  <img src="3.svg" class="ejtilesvg onlydefs">
  <img src="4.svg" class="ejtilesvg onlyboard">
</div>

當點擊某個svg，則會導入。onlydefs指只導入單元的定義，onlyboard指只導入背景板。

設定

導入設定js：ejtilesetting.js

搭配取色板js：html5kellycolorpicker.min.js

設定的功能很強大，可以定義tile單元，board，選擇「密鋪」或「拼盤」模式。

本地記錄

導入記錄js：ejtilelocalstorage.js

本功能可把svg數據記錄在瀏覽器的localstorage中。

Leave a Comment