0% found this document useful (0 votes)
43 views69 pages

TyranoBuilder Script

The document is a guide for TyranoBuilder, detailing supported languages including HTML, JavaScript/ECMAScript, and TyranoScript, along with their integration with Live2D. It provides explanations, examples, and code snippets for various scripting functionalities within the platform. The document serves as a comprehensive resource for users looking to utilize these languages in their projects.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
43 views69 pages

TyranoBuilder Script

The document is a guide for TyranoBuilder, detailing supported languages including HTML, JavaScript/ECMAScript, and TyranoScript, along with their integration with Live2D. It provides explanations, examples, and code snippets for various scripting functionalities within the platform. The document serves as a comprehensive resource for users looking to utilize these languages in their projects.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 69

TyranoBuilder

The Scripts

1
Índex

1. Introduction ............................................................................................................................. 3
2. Supported Languages ........................................................................................................... 3
2.1. HTML ................................................................................................................................ 3
2.2. JavaScript / ECMAScript ............................................................................................... 3
2.3. TyranoScript .................................................................................................................... 4
3. Supported Programs ............................................................................................................. 4
3.1. Live2D............................................................................................................................... 4
4. Language Explanation and Examples ................................................................................ 5
4.1. HTML ................................................................................................................................ 5
4.2. JavaScript / ECMAScript ............................................................................................... 5
4.3. TyranoScript .................................................................................................................... 5
4.3.1. Audio ......................................................................................................................... 5
4.3.2. Macros, Variables, JavaScript, Interface ........................................................... 11
4.3.3. System Settings ..................................................................................................... 20
4.3.4. Other ........................................................................................................................ 30
4.3.5. Form ........................................................................................................................ 33
4.3.6. Layers ...................................................................................................................... 35
4.3.7. Animation ................................................................................................................ 45
4.3.8. Characters .............................................................................................................. 51
4.3.9. Messages ............................................................................................................... 56
4.3.10. Links ...................................................................................................................... 61
4.3.11. Live2D ................................................................................................................... 66

2
1. Introduction
This guide aims to explain the languages supported by TyranoBuilder
with examples and links to learn the scripts.
TyranoBuilder supports the languages: HTML, JavaScript / ECMAScript,
TyranoScript. This program can be integrated with Live2D.

2. Supported Languages

2.1. HTML
HTML (abbreviation for the English expression HyperText Markup
Language , which means Hypertext Markup Language ) is a markup language
used to build web pages. HTML documents can be interpreted by browsers.
The technology is the result of the junction between the HyTime and SGML
standards.
HyTime is a standard for structured representation of hypermedia and
time -based content . A document is seen as a set of concurrent time
dependent events (such as audio, video, etc.) , connected by links . The default
is independent of other general word processing standards.
SGML is a standard for formatting text . It was developed for hypertext,
but it has become desirable to convert documents into hyper - objects and to
describe the connections.
The version supported by TyranoBuilder is HTML5.

2.2. JavaScript / ECMAScript


JavaScript is an interpreted programming language. It was originally
implemented as part of the web browser scripts that could be executed on the
client side and interact with the user without the necessity of going through the
server script controlling the browser , performing asynchronous communication,
and changing the displayed contents of the document.
It is currently the main language for client-side programming in web
browsers. Also begins to be widely used server-side through environments such
as Node.js. It is designed to be a scripting language with object orientation -

3
based prototypes, weak typing and dynamic and first-class functions. It supports
functional programming and introduces features like closures and high order
functions commonly unavailable in popular languages like Java and C ++.
In TyranoBuilder this language has the designation iScript.

ECMAScript is a programming language, based on scripts, standardized


by Ecma International in ECMA -262 specifications. The language is widely
used in Internet technology, which is the basis for the creation of JavaScript /
JScript and also doActionScript .
The version supported by TyranoBuilder is ECMAScript5.

2.3. TyranoScript
TyranoScript is a Japanese scripting/IF/Dating Sim game engine that
powered "Jurassic Heart". It is a high level scripting language similar to Ren'Py
with the advantage that it produces HTML5/JS games, so you can release your
work on browsers and smartphones with no extra effort.
Although the scripting language supports many common tasks, it is a real
game engine with support for arbitrary HTML and JavaScript as well.

3. Supported Programs

3.1. Live2D
At the moment Live2D is the only program that can be integrated with
Tyranobuilder.

4
4. Language Explanation and Examples

4.1. HTML
I advise you to consult the follow links to learn about HTML:
http://www.html-5-tutorial.com/all-html-tags.htm
http://www.tutorialspoint.com/html5/html5_tutorial.pdf
Or just check in google “HTML Tutorials” or “HTML Book”.

4.2. JavaScript / ECMAScript


I advise you to consult the follow link to learn about JavaScript:
http://www.tutorialspoint.com/javascript/
http://www.echoecho.com/javascript.htm
http://javascript.info
Or just check in google “JavaScript Tutorials” or “JavaScript Book”.

4.3. TyranoScript
http://tyranobuilder.com/tyranoscript-tags-reference/

4.3.1. Audio

[playbgm] Play BGM


Play BGM in HTML5 standard audio format (ogg, mp3, mp4, webm).
Playback files should be stored in the project’s bgm folder.

Parameter

Needed? Explanation
Name

storage yes Set the file to be used


loop no set as true (default) or false. true will repeat the loop
Set to true or false (default) when used for smart phone
click no
browsers. If set to true a click is needed before playback

5
will start in smart phone browsers.With smart phones
without a click no sound is assigned to play. For example
after a scene change when you want music playback if you
do not set this to true no music will play. In the middle of
most text false is ok for playback. Check if music is playing
on smartphones and set this to true if necessary.
time no number of miliseconds for the playback to start
Sample Code

[playbgm storage="music.mp3"]

[stopbgm] Stop BGM


Stop BGM.

Parameter Needed? Explanation


No parameters are specified
Sample Code

[stopbgm ]

[fadeinbgm] Fade in BGM


Gradually fade in BGM
PLEASE NOTE: This is not compatible with Firefox and Safari browsers. In
these cases, they will fall back to playbgm

6
Parameter

Needed? Explanation
Name

storage yes set the file for music playback


loop no set as true (default) or false. true will repeat the loop
Set to true or false (default) when used for smart phone
browsers. If set to true a click is needed before playback
will start in smart phone browsers.With smart phones
without a click no sound is assigned to play. For example
click no
after a scene change when you want music playback if you
do not set this to true no music will play. In the middle of
most text false is ok for playback. Check if music is playing
on smartphones and set this to true if necessary.
time yes number of milliseconds for the fade in to occur
Sample Code

[fadeinbgm storage=sample.mp3 loop=false time=3000]

[fadeoutbgm] Fade out BGM


Fade Out BGM.
PLEASE NOTE: This is not compatible with Firefox and Safari browsers. In
these cases, they will fall back to playbgm

Parameter Needed? Explanation


time no Time in milliseconds for fade out to occur
Sample Code

[fadeoutbgm time=3000]

7
[xchgbgm] Crossfade BGM
Crossfade BGM
Mix one music in as another fades out.
PLEASE NOTE: This is not compatible with Firefox and Safari browsers. In
these cases, they will fall back to playbgm.

Parameter

Needed? Explanation
Name

storage yes set the next file for playback


set true (default) or false. true will repeat the sound when it
loop no
is done
Set to true or false (default) when used for smart phone
browsers. If set to true a click is needed before playback
will start in smart phone browsers.With smart phones
without a click no sound is assigned to play. For example
click no
after a scene change when you want music playback if you
do not set this to true no music will play. In the middle of
most text false is ok for playback. Check if music is playing
on smartphones and set this to true if necessary.
time yes number of milliseconds for the cross fade to occur
Sample Code

[xchgbgm storage=new.mp3 loop=true time=3000]

8
[playse] Play a Sound Effect
Play a sound effect
Sound effect files are stored in the project’s \sound folder

Parameter

Needed? Explanation
Name

storage yes Set the playback file


set true or false (default). true will repeat the sound when it
loop no
is done
true or false (default). When another sound effect is playing
clear no interrupt it and start playing this. true could be useful for
voice
Sample Code

[playse storage=sound.mp3 loop=false ]

[stopse] Stop a Sound Effect


Stop a sound effect

Parameter Needed? Explanation


No parameters are specified
Sample Code

[stopse ]

9
[fadeinse] Fade in a Sound Effect
Fade in a sound effect

Parameter Needed? Explanation


storage yes Set the file to be used
loop no set as true or false(default). true will repeat the playback
time yes set the fade in time in milliseconds
Sample Code

[fadeinse storage=sound.mp3 loop=false time=2000 ]

[fadeoutse] Sound Effect Fadeout


Sound Effect fadeout

Parameter Needed? Explanation


time no fadeout in milliseconds
Sample Code

[fadeoutse time=2000 ]

[wb] Pause BGM Playback


Pause BGM playback

Parameter Needed? Explanation


No parameters are specified

10
4.3.2. Macros, Variables, JavaScript, Interface

[eval] Evaluate Expression


exp allows evaluation of expressions. Variables can be assigned to numbers,
etc.
exp allows for arbitrary TJS(JS) so, any valid TJS(JS) can be evaluated.

Parameter Needed? Explanation


exp yes TJS expression to be evaluated
Sample Code

[eval exp="f.test=500"]
;↑assign to game variable test to a number

[eval exp="f.test2='Example String'"]


;↑assign game variable test2 to Example String

[eval exp="sf.test=400"]
;↑assign system variable test to a number

[eval exp="f.test2=f.test*3"]
;↑assign game variable test2 to 3x game variable test

[clearvar] Clear All Game Variables


clear all game variables

Parameter Needed? Explanation


No parameters are specified

11
[clearsysvar] Clear All System Variables
Clear all system variables

Parameter Needed? Explanation


No parameters are specified

[iscript] Enter JavaScript


You can use JavaScript between [iscript] and [endscript].
TJS can also be used, but TyranoScript variables are unavailable.

Parameter Needed? Explanation


No parameters are specified
Sample Code

[iscript]
var test = 22;
f.name = test;
alert("javascript functions are available");
//jquery commands and javascript methods can also be used.
$("body").html();
[endscript]

[endscript] End JavaScript


End JavaScript description

Parameter Needed? Explanation


No parameters are specified

12
[emb] Embed Expression
The the result of an evaluated expression can be embedded.
Use this when you want to display a variable in a scenario.

Parameter

Needed? Explanation
Name

An TJS (JS) expression that can be displayed with the


exp yes
[emb] tag
Sample Code

[eval exp="f.value1='variable level'"]


The variable f.value1 is now stored.
[emb exp="f.value1"]
The variable is shown above here.

[if] If
if the evaluation of the expression is true (or a non-zero number), the
statements and tags up until elsif, else and endif tag are executed, otherwise
those statements and tags are ignored and the statements and tags inside of
elsif or else would be executed instead.

Parameter

Needed? Explanation
Name

a TJS expression to be evaluated. if the expression is false


exp yes (or 0)- the statements and tags will be ignored until an elsif
else or endif tag.

13
Sample Code
; example 1
[if exp="false"]
This will not be displayed
[else]
This will be displayed
[endif]

; example 2
[if exp="false"]
This will not be displayed
[elsif exp="false"]
This will not be displayed
[else]
This will be displayed
[endif]

; example 3
[if exp="false"]
This will not be displayed
[elsif exp="true"]
This will be displayed
[else]
This will not be displayed
[endif]

; example 4
[if exp="true"]
This will be displayed
[elsif exp="true"]
This will not be displayed
[else]
This will not be displayed
[endif]

14
[elsif] Else If
between the [if] and [endif] tags, this can be used. If statements in a previous [if]
or [elsif] tag have not been executed yet, the statements in this tag will be
evaluated if the expression in the exp parameter evaluates to true until the point
where an elsif, else, or endif tag is reached.
For usage examples, see the entry for the [if] tag.

Parameter Needed? Explanation


exp yes Sets the js expression to be evaluated

[else] Else
If an [if] tag or [elsif] tag have not been executed, statements between [else]
and [endif] are executed.
For usage examples, see the entry for the [if] tag.

Parameter Needed? Explanation


No parameters are specified

[endif] End If
End an if statement. when you use an [if] tag, you must have an [endif]

Parameter Needed? Explanation


No parameters are specified

15
[call] Call a Subroutine
Call a subroutine by label and scenario file.
if a subroutine contains a [return] tag, execution will pick up after where the
subroutine was called

Parameter

Needed? Explanation
Name

set the scenario file containing the subroutine you wish to


storage no call. If parameter is missing the current scenario file is
used.
The label of the subroutine you wish to call. The first label
target no
found in the file is used

[return] Return from Subroutine


Return to where the subroutine was called from.
This is deprecated in KAG3.
(when you need this, use call instead)

Parameter Needed? Explanation


No parameters are specified

16
[macro] Describe Macro
Start macro definition.
The statements between this tag and the [endmacro]tag will register a new tag
named after the name attribute. Then you can use this new tag.
When an inner tag’s attribute value is prefixed with the % symbol, that
parameter is passed through when defined by the macro. If a | is used in
conjunction with the %, a default parameter can be defined.
Also, all parameters are passed through when the “*” is used.

Parameter

Needed? Explanation
Name

The name of the new tag to register as a macro.


name yes
Afterwards this name can be used as a normal tag.
Sample Code

[macro name="newtag"][font color=0xff0000]new


tag[resetfont][endmacro]
[newtag]
[macro name="colortag"][font color=%iro]color tag[resetfont][endmacro]
[colortag iro=0x332211]
; ↑ iro is passed through colortag to the [font] tag within the macro by
using a "%"
[macro name="transwait"][trans *][wt][endmacro]
; ↑ transwait all of the properties passed to the [transwait] tag are passed
to the [trans] tag with a "*"
[macro name="colortag"][font color=%iro|0xff0000]the iro property is
supplied if not set[resetfont][endmacro]
; ↑ in conjunction with the "%" syntax the "|" is used to supply default
parameters

17
[endmacro] End Macro
This ends the macro

Parameter Needed? Explanation


No parameters are specified

[erasemacro] Erase Macro


Deletes registered macro

Parameter Needed? Explanation


name yes The name of the macro to be deleted

[ignore] Start Ignore


When the expression evaluates to true (or is a non-zero number) do not
execute any tags or statements until after the [endignore] tag

Parameter Needed? Explanation


exp yes this is the expression (in TJS) that is evaluated.

[endignore] End Ignore


End ignore

Parameter Needed? Explanation


No parameters are specified

18
[loadjs] Load JavaScript File
Read in external JavaScript File
There are no restrictions on how the js will work.
The JS file should be in data/others folder

Parameter Needed? Explanation


storage yes the name of the JavaScript file to load.
Sample Code

[loadjs storage="sample.js" ]

19
4.3.3. System Settings

[close] Close Window


Close Window

Parameter

Needed? Explanation
Name

if true is set a confirmation will be requested. If false is set


ask no no confirmation will occur. This attribute is set to true by
default.

[title] Set Title


Sets the title for the game.
You can also change each chapter title for the player.
In kirikiri the application window title will change.
In TyranoScript the title attribute of the browser is changed.

Parameter Needed? Explanation


name yes The name you want for your title
Sample Code

[title name="Title after change"]

20
[savesnap] Create a Save Snapshot
Save the current game conditions. After that, tyrano.ks’s expansion [setsave] is
peformed. This records the save data.

Parameter Needed? Explanation


title yes Sets the title of the save data

[preload] Preloads Image Files


Using the preload tag, you can load files (images or music) before they are
needed.
The presentation will be smooth when they are needed.

Parameter

Needed? Explanation
Name

enter the full path for previously entered images. They are
storage yes
set in the order that they are passed in.
this can be set to true or false. The default is false. When
wait no this is set to true all the game is paused until the images
are loaded. You will need a loading screen.
Sample Code
;Use the full path below the project directory
[preload storage="data/fgimage/girl.jpg"]
;You can also specify an array
[iscript]
f.preload_images =
["data/fgimage/girl.jpg","data/fgimage/haruko.png","data/fgimage/miku1.p
ng","data/fgimage/miku2.png"];
[endscript]
[preload storage=&f.preload_images]

21
[showsave] Show Save Screen
Show save screen

Parameter Needed? Explanation


No parameters are specified
Sample Code

[showsave]

[showload] Show Load Screen


Show load screen

Parameter Needed? Explanation


No parameters are specified
Sample Code

[showload]

[showmenu] Show Menu


Show menu

Parameter Needed? Explanation


No parameters are specified
Sample Code

[showmenu]

22
[showmenubutton] Show Menu Button
Show menu button

Parameter Needed? Explanation


No parameters are specified
Sample Code

[showmenubutton]

[hidemenubutton] Hide Menu Button


Hide menu Button

Parameter Needed? Explanation


No parameters are specified
Sample Code

[hidemenubutton]

[skipstart] Skip Start


Start “skip mode” where the characters move faster

Parameter Needed? Explanation


No parameters are specified

23
[skipstop] Skip Stop
Stop “skip mode” where the characters move faster

Parameter Needed? Explanation


No parameters are specified

[s] End Game


Stop executing the script in the scenario file choices shown in [link] tags etc. will
have no way to execute them.

Parameter Needed? Explanation


No parameters are specified
Sample Code

[link target=*select1] This won't work after the [s] tag executes [endlink][r]
[link target=*select2] This won't work after the [s] tag executes [endlink][r]
[s]

[wait] Begin Wait


For the time specified by the time attribute, the script will not execute.

Parameter Needed? Explanation


time yes set the time to wait in milliseconds
Sample Code

;pause execution for 2000 milliseconds (2seconds)


[wait time=2000]

24
[quake] Shake the Screen
For a set number of milliseconds、the screen will shake. (KAG3 does not
support setting the number of characters) if you set the vmax attribute to 0 it will
only shake horizontally. if you set the hmax attribute to 0 it will only shake
vertically.

Parameter

Needed? Explanation
Name

count no Set the number of times to shake the screen


Set as true or false. if set to true the game will pause
wait no
during the shaking. true is the default
Set the number of milliseconds to shake the screen per
time yes
count. default is 300ms
The maximum number of pixels to shake the screen
hmax no
horizontally. The default is 10(px).
The maximum number of pixels to shake the screen
vmax no
vertically. The default is 10(px).
Sample Code

[quake count=5 time=300 hmax=20]

25
[font] Set Font Attributes
Set various attributes of text.
These attributes are set for each message layer.
If any of the attributes are omitted, the default set in Config.tjs is used.
When these tags are used: [resetfont] [ct] [cm] [er]、the defaults set in
Config.tjs or in the [deffont] are used.

Parameter

Needed? Explanation
Name

size no set the character size


set a color with the 0xRRGGBB form with 吉里吉里. If
color no you’re using HTML5 you should be able to set this in other
ways
bold no sets characters to be bold. can be true or false
set the font type. This is not compatible with KAG. Put
face no them in the project’s “other” folder. Then designate this with
tyrano.css’s @font-face
Sample Code

[font size=40 bold=true]


This message is big and bold.
[resetfont]
This message goes back to normal.

26
[deffont] Default Font Attributes
Sets the default font attributes for the current message layer.
If the [resetfont] tag is used, these attributes will take effect.
In other words, by only using this tag, the font attribute will not be reflected.

Parameter

Needed? Explanation
Name

size no set the character size


set a color with the 0xRRGGBB form with 吉里吉里. If
color no you’re using HTML5 you should be able to set this in other
ways
bold no sets characters to be bold. can be true or false
set the font type. This is not compatible with KAG. Put
face no them in the project’s “other” folder. Then designate this with
tyrano.css’s @font-face

[delay] Message Speed


Set the message speed for text.
If you want the characters to appear instantly, you can use the [nowait] tag.

Parameter Needed? Explanation


speed no how fast the characters appear

27
[nowait] Instant Text
Without waiting, text will appear on the screen. (contrast with [delay])

Parameter Needed? Explanation


No parameters are specified

[endnowait] End Instant Text


Text between this and the [nowait] tag will appear instantly.

Parameter Needed? Explanation


No parameters are specified

[resetfont] Reset Font


Return to the default font attributes set by the [font] tag
Each message layer can have different font settings.

Parameter Needed? Explanation


No parameters are specified

[cancelskip] Cancel Skip


Cancel option to skip through dialog.
Able to override player initiated skips.

Parameter Needed? Explanation


No parameters are specified

28
[locate] Display Location Settings
Set placement of graphical buttons.
There is no support for writing text.

Parameter Needed? Explanation


x no Set horizontal position
y no Set vertical position
Sample Code

[glyph] ‘Waiting for Click’ Indicator


The image that is used when waiting for a click.
This goes in same directory as tyrano/images/kag/nextpage.gif

Parameter

Needed? Explanation
Name

specify the image to use. It goes somewhere in the same


line no
directory as tyrano/kag/nextpage.gif.
fix no if set to true you can place this with the top and left params
left no if the fix property is true set the left margin to this number
top no if the fix property is true set the top margin to this number
Sample Code

[glyph fix=true left=200 top=100 ]

29
4.3.4. Other

[trace] Console Output


Outputs values to the console
In the case of KAG3 or 吉里吉里(kirikiri): in the console with Shift+F4 activate
the display or in Config.tjs turn logMode on and it will record
In the case of TyranoScript in a browser: Check in the web inspector console of
the browser

Parameter Needed? Explanation


exp no A TJS(JS) expression to be evaluated
Sample Code

[trace exp="f.test"]
; ↑ game variable test's details are output to the console

[html] Add an HTML Layer


In between [html] and [endhtml] HTML can be entered.
This feature is very powerful. Of course JavaScript, Canvas, and next
generation web expressions are supported.
For example a Youtube video player can be inserted and any number of public
APIs can be accessed.
By using this tag, any HTML elements can be added.
If you use the [cm] tag and do not clear everything, even if you click the game
cannot continue.
By all means use graphic buttons, etc. to ensue that you can jump to a game
state where you can still continue.
Inside of this tag, variables of TyranoScript can be used.
[emb] tags inside of previously set HTML can be used.

30
Parameter

Needed? Explanation
Name

left no sets the horizontal postion of the [HTML] tag in pixels


top no sets the vertical postion of the [HTML] tag in pixels
you can set the name of the HTML area. Using this name
name no
animations can be performed with the HTML.
Sample Code

;place the youtube player in a designated spot


;use the embed tag for youtube
[html top=100 left=300]

<object width="200" height="113">


<param name="movie"
value="http://www.youtube.com/v/60TMm2sQTBU?version=3&amp;hl=ja
_JP&amp;rel=0">
</param>
<param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param> <embed
src="http://www.youtube.com/v/60TMm2sQTBU?version=3&amp;hl=ja_J
P&amp;rel=0" type="application/x-shockwave-flash" width="200"
height="113" allowscriptaccess="always" allowfullscreen="true">
</embed></object>

[endhtml]

31
[endhtml] End HTML
End HTML input

Parameter Needed? Explanation


No parameters are specified

[movie] Play Movie


Play an mp4 video

Parameter Needed? Explanation


storage yes the file where an mp4 is stored
skip no set whether or not this is skippable.
Sample Code

[movie storage="" skip=false ]

32
4.3.5. Form

[edit] Text Box


Show a text box.
The value entered via the commit tag is stored as a variable that was set by this
tag’s name attribute.
Inside of form display the scenario is paused. (even if you click the story cannot
continue)
So when you display a graphical button, you must provide a target label to jump
to.
To make a small change to the display, you can edit tyrano.css.

Parameter

Needed? Explanation
Name

name yes the name of the variable to store on commit


length no width
color no The color of the text. The default is black
left no The horizontal position of the text box
top no The vertical position of the text box
size no sets the text size. The default is 20 pixels
width no The width of the text box
height no The height of the text box
maxchars no The maximum number of characters that can be entered.
Sample Code

[edit name="f.test"]
[locate x=200 y=300 ]
[button graphic="start.png" target=*commit]
[s]

33
*commit
[commit]
[cm]
;show the contents of entered Text
Value is set as [1]
[emb exp=f.test]
This is what you entered.[1]

[commit] Submit Form


The value of the text box is saved as a variable from the [edit] tag’s name
property.
Keep in mind that while [commit] is executed, the text Box of the form are
displayed.

Parameter Needed? Explanation


No parameters are specified

34
4.3.6. Layers

[clearfix] Clears the Fix Layer


by setting the name property, only the corresponding element can be deleted

Parameter Needed? Explanation


name no the name used when the fix layer was declared
Sample Code

;add a fix Layer


[ptext name="sample" layer=fix page=fore text="TextText" size=30 x=200
y=100 color=red ]

;clear fix Layer


[clearfix name="sample"]

[position] Set Position of Message Layer


Set various options for the message layer.
Any parameters that are omitted will not change their attributes.

Parameter

Needed? Explanation
Name

set target message layer.


layer no
If this is omitted the current layer will be used.
set target page. set”fore” or “back”.
page no
If this is omitted the current page will be used

35
left no message layer’s position from the left in pixels
top no message layer’s position from the top in pixels
width no message layer’s width in pixels
height no message layer’s height in pixels
set image for the message layer’s frame image.
use this to customize the message area.
adjust image size is according to the width and height
attributes.
frame no futhermore you should use this to regulate the places
where the message will be displayed by margin attributes.
if you set this to “none” it will return to the standard margin.
You can also change it to designate a different frame
image.
sets the color of the message layer with a 0xRRGGBB
color no
format
this sets the opacity for the message layer. This does not
opacity no affect the opacity of the text itself or the layer.0 is
completely transparent.
marginl no message layer’s left margin
margint no message layer’s top margin
marginr no message layer’s left margin
marginb no message layer’s bottom margin
set message layer’s vertical mode with “true”. Use “false”
vertical no
for horizontal mode.
if set to “true” message layer is visible
visible no
“false” hides the message layer.
Sample Code

;message layer position and size


[position width=400 height=300 top=100 left=20]

;message layer color and opacity


[position color=blue opacity=100]

36
[ image ] Display an Image
Show an image for the layer. you can use this to change the image of the
background or character. visible must be set to true in order to show the
foreground layer

Parameter

Needed? Explanation
Name

sets the image file name. If it is a background image it


storage no should be in the bgimage folder. Foreground images
should be in the fgimage folder
sets the target layer. if you set it as “base” it will be the
layer no background layer. if you set it as an integer above zero it
will put that layer in front of lower numbers
sets the target page. Set as “fore” or “back”.
page no
if omitted “fore” will be set
left no sets pixels from the left
top no sets pixels from the top
x no sets pixels from the left. the same as left but overrides it
y no sets pixels from the top. the same as top but overrides it
width no sets the width of the picture in pixels
height no sets the height of the picture in pixels
you can chose an image from this folder. By default
fgimage is set for the foreground image and bgimage is set
folder no
for the background image. Any image under the folder
name that you write here will be available for use
TyranoScript only (not KAG3). This name is used later to
reference this image by tags like [anim] tag. Basically by
name no setting this name you can set this as a JS class. If you
divide them with commas you can designate multiple
names.
pos no set the layer position automatically. This is used for the

37
foreground layer. This attribute can be set as left
left_center center right_center right. You can change how
far it is from the center in the Config.tjs file. You can also
abbreviations l lc c rc and r.
Setting these will override the top and left attributes.
Don’t set this attribute for the layer that you intend to use
as base. Set these positions beforehand in Config.tjs
Sample Code

[image storage="default/rouka.jpg" layer=1 page=fore visible=true


width="128" height="128" x="730" y="40" ]

[freeimage] Free Image


Frees the images of a particular layer that were added with tag. The layer
attribute is required.

Parameter

Needed? Explanation
Name

set message layer. If it is not set the current message layer


layer yes
is used
page no set page. If it is not set the surface page is used
Sample Code

[backlay]
;Show character
[image layer=0 page=back visible=true top=100 left=300 storage =
chara.png] [trans time=2000]
@wt

38
@backlay
;Hide character
[freeimage layer=0 page=back]
@trans time=2000
[wt]

[ptext] Add Text to the Layer


This displays text in the layer. Only performed in the foreground layer.
This will inherit all of the attributes of the foreground layer. when text is deleted,
it applies to the [freeimage] tag in the layer.
Keep in mind that if the foreground layer is not set to visible=true this text will
also not display.
[layopt layer=0 visible=true] is required

Parameter

Needed? Explanation
Name

layer yes this sets the target layer. you can reference it by number.
sets the target page. can be set as set as “fore” or “back”.
page no
defaults to “fore”
text no text contents to show
x yes horizontal position from left border in pixels
y yes vertical position from top border in pixels
set to true or false (this is the default). If set to true the text
vertical no
reads vertically. If false the text is horizontal.
size no set the font size in pixels
set the font type. This is not KAG compatible but you can
face no
use web fonts
color no set the font color
name no TyranoScript only (not KAG3). This name is used later to

39
reference this by tags like [anim] tag. Basically by setting
this name you can set this as a JS class. If you divide them
with commas you can designate multiple names.
this sets the text as bold. You can use font-style for the
bold no
HTML5 compatible method.
Sample Code

[backlay]
[ptext page=back text="texttext" size=30 x=200 y=300 color=red
vertical=true]
[trans time=2000]
[wt]
[1]
Clear the displayed text
[freeimage layer = 0]

[backlay] Copy Information from the Surface


Page
The layer that you designate or all of the layer information is copied from the
front page to the back page.
The image of the front page layer marked with the [trans] tag moves to the back
page’s image layer.
In order to do that, before the transition, the image is moved to the back with the
[backlay] tag. On the back page, after the layer is manipulated, the transition is
performed.

40
Parameter

Needed? Explanation
Name

set the layer target


if set as “base” then it becomes the background layer
if set as an integer above zero then it becomes the
foreground
if you set as message0 or message1 then it will become
that message layer.
layer no
if you set is as message it will become the message layer
of whatever the [current] tag is set to.
Even if the message layer is the back page it will copy that
message layer from the front to the back.
if this is omitted the information of every layer is copied to
the back page
Sample Code

;The background change is executed via a transition


@layopt layer=message0 visible=false
[backlay]
[image layer=base page=back storage=rouka.jpg]
[trans time=2000]
[wt]

41
[wt] Wait on Transition
wait until transition is finished

Parameter Needed? Explanation


No parameters are specified
Sample Code

[backlay]
[image layer=base page=back storage=rouka.jpg]
[trans time=2000]
;don't advance until transition is finished
[wt]

hidemessage] Hide Message


temporarily hides the message layer. This will perform the same action as if you
were to choose clear message from the menu.
after waiting for a click, the message layer is shown, and the script execution
continues.

Parameter Needed? Explanation


No parameters are specified

42
[layopt] Layer Options
set layer options.
Parameter

Needed? Explanation
Name

This sets the target layer or message layer. if you only set
the message it will be set with the [current] tag and the
layer yes
current layer that you’re working with will become the
message layer
page no sets as “fore” (default) or “back”. But if layer
sets whether or not the layer is visible. The visibility will not
visible no
change if this attribute is omitted
sets the layer position from the left. If this omitted there is
left no no position change. If you want to change the position of
message0 or message1 use the [position] tag instead
sets the layer position from the top. If this omitted there is
top no no position change. If you want to change the position of
message0 or message1 use the [position] tag instead
sets the opacity of the layer from 0-255. 255 is totally
opacity no
transparent.
Sample Code

;delete message layer


@layopt layer=message0 visible=false
[backlay]
[image layer=0 page=back visible=true top=100 left=50 storage =
miku1.png]
[trans time=2000]
@wt
;then show the layer
@layopt layer=message0 visible=true

43
[trans] Transition Layer
Transition to the set layer.
Transition is a way to move the back layer to the front.
after transition, the surface page’s status of the target layer image’s placement,
size, visibility, invisibility are made to be the same as the back page.
Also, during a transition do not change the properties of the layers

Parameter

Needed? Explanation
Name

set the target layer


if “base” is set it will become the scene layer
if a number greater than 0 is used it will become a
foreground layer
if you set as message0 or message1 then it will become
that message layer.
layer no
if you set is as message it will become the message layer
of whatever the [current] tag is set toEven if the message
layer is the back page it will copy that message layer from
the front to the back.
if this is omitted the information of every layer is copied to
the back pageNormally the background changes are used.
set the transition type. The default is “crossfade”. Other
possibilities are「crossfade」「explode」「slide」「blind
method no
」「bounce」「clip」「drop」「fold」「puff」 「scale」
「shake」「size」
time yes the time for the transition is set in milliseconds
Sample Code
[backlay]
[image storage=fg0 layer=0 page=back]
[trans time=1500 ]
[wt]

44
4.3.7. Animation

[anim] Animation
With this you can animate a picture, button or even the contents of a layer.
You should call the element that you want to animate by using the name you
gave it when it was created with the [ptext] or [ button ] tags.
When you set a layer, the animation will affect all elements in the layer.
This tag does not wait for the animation to stop. If you use the [wa] tag, you can
wait for the completion of all animations that are being performed.
You can set the position of the animation using the values of -100 through 100.
(From where it is currently, it can be moved to the left 100px)
If you set the opacity, you can also make something disappear.

Parameter

Needed? Explanation
Name

use this property to look up the button layer or picture to


name no
animate
if a name is set this will be ignored. Otherwise this to set
layer no
the foreground layer
left no animate it horizontally to the position you set
top no animate it vertically to the position you set
width no set the width
height no set the height
set the value from 0-255. It will animate to the given
opacity no
opacity.
color no set the color
time no time taken by the animation. Default is 2000 milliseconds
define the effect of the animation. examples are defined as
follows
effect no
jswing |def |easeInQuad |easeOutQuad |
easeInOutQuad |easeInCubic |easeOutCubic |

45
easeInOutCubic |easeInQuart |easeOutQuart |
easeInOutQuart |easeInQuint |easeOutQuint |
easeInOutQuint |easeInSine |easeOutSine |
easeInOutSine |easeInExpo |easeOutExpo |
easeInOutExpo |easeInCirc |easeOutCirc |
easeInOutCirc |easeInElastic |easeOutElastic |
easeInOutElastic |easeInBack |easeOutBack |
easeInOutBack |easeInBounce |easeOutBounce |
easeInOutBounce
Sample Code

[ptext layer=1 page=fore text="example text" size=30 x=0 y=0 color=red


vertical=true]
[image layer=0 left=100 top=100 storage = yuko1.png page=fore
visible=true name=yuko,chara ]
[image layer=1 left=300 top=100 storage = haruko1.png page=fore
visible=true name=haruko ]

;set the name attribute animate


[anim name="haruko" left="=100" time=10000 effect=easeInCirc
opacity=0 ]

;set the layer and animate


[anim layer=1 left="=100" effect=easeInCirc opacity=0]

;pause all animations


[wa]

Animations over

46
[wa] Pause Animation
Pause the currently playing animation

Parameter Needed? Explanation


No parameters are specified

[keyframe] Set Animation Keyframe


Set animation keyframe. The defined animation can be used by setting the
[kanim] tag.

Parameter

Needed? Explanation
Name

Sets the names of the key frame. This will be the name to
name yes
use if you use the kanim tag later.
Sample Code

;----setting the keyframe


[keyframe name="fuwafuwa"]
[frame p=40% x="100" ]
[frame p=100% y="-200" opacity=0 ]
[endkeyframe]
;-----run the defined animation

47
[endkeyframe] End Keyframe
Stop the definition of keyframe animations

Parameter Needed? Explanation


No parameters are specified

[frame] Keyframe Animation Settings


This defines the key frame animation. The defined animation can be used by
setting the [kanim] tag.

Parameter Needed?Explanation
Set the percentage. For example an animation that
takes 5 seconds you will want to set each slide at
p yes 20% (?). Set it to 0-100%. If you omit putting it to
0% you can continue from the previous animation
and start a new animation.
Set the pixels the amount that the animation should
move on the X axis. Or if you start it with an
x no
asterisk (*) you can set it at an absolute position.
(For example) x
Set the pixels the amount that the animation should
y no move on the Y axis. Or if you start it with an
asterisk (*)
you can set it at an
absolute position.no “100” (it will move 100px forward) y
(For example) y
Set the pixels the amount that the animation should
move on the Z axis. Or if you start it with an
z no
asterisk (*) you can set it at an absolute position.
(For example) z

48
You can rotate the target. As an example using
rotate no
notation like rotate
You can rotate the target on the X axis. As an
rotateX no
example
using notation like
no “360deg” will turn the image 360 degrees.
rotate
You can rotate the target on the Y axis. As an
rotateY no
example
using notation like
no “360deg” will turn the image 360 degrees.
rotate
You can rotate the target on the Z axis. As an
rotateZ no
example
using notation like
no “360deg” will turn the image 360 degrees.
rotate
scale no You can enlarge or shrink the target. (Ex) scale
scaleX no Enlarge or shrink the target horizontally.
scaleY no Enlarge or shrink the target vertically.
scaleZ no Enlarge or shrink the target in the 3rd dimension.
skew no skew
skewX no Xskew
skewY no Yskew
perspective no You can change perspective. Only select browsers.
By setting this to 0-1 you can set the opacity of
every element. It is possible to make an element
opacity no
disappear this way. At 0 it is completely
transparent.
Others no You can also use CSS to set other properties.

49
[kanim] Execute Keyframe
This executes a keyframe animation. You can implement a complex animation
by defining the name as well as the text and pictures you want to animate with
the [keyframe] tag.

Parameter

Needed? Explanation
Name

name no sets the name of the text or image that will be animated
if you don’t set the name and set the layer instead this will
layer no
animate all elements in the layer
keyframe yes sets the name of the keyframe animation
time no the time of the animation in milliseconds
set the pattern of change for the animation.Some of the
things you can set are:ease(smoothly at the beginning and
end)linear(plays at a set interval)ease-in(plays back slowly
easing no at the beginning)ease-out(plays back slowly at the
end)ease-in-out(plays back slowly at the beginning and
end)it’s possible to set the easing your own way by using
the cubic-bezier function
set the number of times it plays. The default is one. If you
count no
set it to “infinite” the animation will play forever.
delay no milliseconds before playback. default is 0
animations can alternate between their reverse and normal
direction no progression. default is “normal” and “alternate” sets the
animation to alternate between normal and reverse
set the status before and after playback. Default is
“forwards” and it maintains the same configuration after
mode no
play. If set to “none” it will not maintain the same
configuration.

50
4.3.8. Characters

[chara_config] Character Settings


Change Character Settings

Parameter

Needed? Explanation
Name

set as true or false. default is true. when true the


pos_mode no [chara_show] tag (etc) will automatically place the
character
set the name text to show when the character is speaking.
ptext no
for example when defined like this [ptext name
The way that a character moves in or out.jswing |def |
easeInQuad |easeOutQuad |easeInOutQuad |
easeInCubic |easeOutCubic |easeInOutCubic |
easeInQuart |easeOutQuart |easeInOutQuart |
easeInQuint |easeOutQuint |easeInOutQuint |
effect no easeInSine |easeOutSine |easeInOutSine |
easeInExpo |easeOutExpo |easeInOutExpo |
easeInCirc |easeOutCirc |easeInOutCirc |
easeInElastic |easeOutElastic |easeInOutElastic |
easeInBack |easeOutBack |easeInOutBack |
easeInBounce |easeOutBounce |easeInOutBounce
No parameters are specified

51
[chara_new] New Character
Set the info for a new character. after that, it can be further manipulated with the
[chara_show] tag and others.
Also you can set the name here which is referenced by the [anim] tag later.
In other words, after you add a character, you can freely animate it.

Parameter

Needed? Explanation
Name

The name that this character will be referenced by (written


name yes
in ASCII characters). This name must be unique.
set the character picture. this should be in the project’s
storage yes
fgimage directory
width no Set the width of the picture
height no Set the height of the picture
when this character’s name is shown this is the display
jname no version. For example when Yuko is used “ゆうこ” can
appear in the message area
Sample Code

[chara_new name="yuko" storage="yuko.png" jname="ゆうこ"]

52
[chara_show] Show Character
Show a previously defined character.

Parameter

Needed? Explanation
Name

reference the character to show with the name previously


name yes
defined by [chara_new]
Set the time it takes for the character to appear。The
time no
default is 1000 milliseconds
The layer to place the character in. The default is the
layer no
foreground (layer
page no set fore or back. The default is fore.
if true is set the character’s appearance will be delayed.
wait no
The default is true
sets the horizontal position. If this is set automatic
left no
movement will not be affected
sets the vertical position. If this is set automatic movement
top no
will not be affected
Sample Code

[chara_show name="yuko" ]

53
[chara_hide] Hide Character
hide a character that has been displayed with [chara_show]

Parameter

Needed? Explanation
Name

name yes the name defined by [chara_new]’s name attribute


if this is set to true the character will wait to disappear.
wait no
Default is true
set in milliseconds. this is the length of time for a character
time no
to disappear. The default is 1000 milliseconds
remove the character from the layer set by [chara_show] if
layer no
it is set. the default is 0
if set to true and the ptext of the name already exists on the
overwrite no
screen you can change just the text. the default is false
Sample Code

[chara_hide name="yuko" ]

[chara_delete] Delete Character


Delete character and character info.
If you want to just remove the character from the screen, use [chara_hide]
instead.

Parameter Needed? Explanation


name yes the name set by [chara_new]
Sample Code

[chara_delete name="yuko" ]

54
[chara_mod] Change Character Appearance
Change the sprite of a character on the screen. Likely useful for changing facial
expressions.

Parameter

Needed? Explanation
Name

name yes define name of [chara_new]

new character sprite file. should be in the fgimage folder of


storage yes
the project

Sample Code

[chara_mod name="yuko" storage=""chara/1/newface.png"]

55
4.3.9. Messages

[l] Wait for Click


This tag allows waiting for a click.

Parameter Needed? Explanation


No parameters are specified
Sample Code

show some text...[1]


show some more text...[1][r]

[p] Clear Text after Click


This tag waits for a click (like [l]), but clears the text afterwards.

Parameter Needed? Explanation


No parameters are specified
Sample Code

Show text[p]
Show text[p][r]

56
[graph] Show Image Inline
Show arbitrary images inside of a message.
You can use pictographs or special characters, etc.
Put images you want to show in the image folder.
Also, for frequently used symbols, it’s easy to set up a macro.

Parameter Needed? Explanation


storage yes The filename where the picture is stored
Sample Code

; put a heart picture in


[macro name="heart"][graph storage="heart.png"][endmacro]

; below, with the [heart] tag, a heart symbol can be used


I love you![heart]

[r] New Line


Puts a new line

Parameter Needed? Explanation


No parameters are specified
Sample Code

Show text[1]
Put text on a new line[1][r]
Put text on a new line[1][r]

57
[er] Erase
Erase the characters of the current layer

Parameter Needed? Explanation


No parameters are specified
Sample Code

Show some text[1]


Clear the message[1][er]
Put a new line[1][r]

[cm] Clear All Messages


Clear all messages.
Also, font styles will return to defaults.
Position and/or layopt settings will take effect.
Similar to the [ct] tag, nothing is set in the target message layer.
Even after executing this tag, the included target layer is the same.

Parameter Needed? Explanation


No parameters are specified
Sample Code

Show some text[1]


Clear screen[1][cm]
Clear screen again[1][cm]

58
[ct] Reset the Message Layers
Resets the message layers
Clears all of the characters from the message layers. Current message layer is
set to message0.
Also, font styles will return to defaults.
Position and/or layopt settings will take effect.

Parameter Needed? Explanation


No parameters are specified
Sample Code

Show text[l]
Clear screen[l][ct]
Clear screen again[l][ct]

[current] Set Current Message Layer


Set the current message layer. After setting this, statements, setting attributes
via font tags, using the l tag for click events, etc. will take place in this layer.
For message0 the default is visible, but for message1, if you don’t set the
[layopt] tag’s visible attribute to true it will not be shown.
Parameter

Needed? Explanation
Name

sets the message layer to be affected. It will affect the


layer no
current message layer.
it will be set to the foreground or background. If omitted it
page no
will set to the foreground.

59
Sample Code

[current layer="message0"]
Show message0 layer[l]
[current layer="message1"]
Show message1 layer[l]

[ruby] Add Helper Text (furigana)


Set the helper characters of the following characters.
Set them anytime you want to show ruby characters (furigana).
When you want to apply ruby characters to a multi-character string, you need to
set ruby characters for every character in the string.

Parameter

Needed? Explanation
Name

sets ruby characters to show for kanji (“漢” gets “かん” and
text yes
“字” gets “じ”).
Sample Code
[ruby text="かん"]漢[ruby text="じ"]字

60
4.3.10. Links

[jump] Jump to Scenario


Goes to the specified label in the specified file.
It is a mistake to use call if there is no jump on the call stack.
In other words, it can only be used one way. Setting a label is required.

Parameter

Needed? Explanation
Name

scenario file to move to. If this is left out the current


storage no
scenario file will be used
label name to jump to. If this is left out it will go to the
target no
beginning.
Sample Code

; Go to the scenario file second.ks in the place with the label: *start
[jump storage=second.ks target=*start]

[link] Hyperlink (Choice)


the text inside the [link] and [endlink] tags can be selected with the mouse or
keyboard. on a click or key event a jump event can be fired.
This tag cannot be used to visit a different page.

Parameter

Needed? Explanation
Name

storage no set the scenario file to jump to. if omitted the current

61
scenario file
set the label to jump to. If omitted the script will be
target no
executed from the beginning of the file
Sample Code

pick what you like[l][r][r]


[link target=*select1] 1- first choice[endlink][r]
[link target=*select2] 2- second choice[endlink][r]
[s]
*select1
[cm]
you clicked the first choice
@jump target=*common
*select2
[cm]
you clicked the second choice
@jump target=*common *common
[cm]
Common Route

[endlink] Hyperlink(Choice)Ending
closing tag for hyperlinks (choices)

Parameter Needed? Explanation


No parameters are specified
Sample Code

[link target=*select1]1- first choice[endlink][r]


[link target=*select2]2- second choice[endlink][r]

62
[button ] Display a Graphical Button
Show a graphical button.
This is the image version of a [link] tag.
By implementing this button, it forces the scenario to stop, so you need to
include a jump target.
The location of the graphical button is determined by most recent [locate] tag.
However, if x and y are set, it will use those attributes to determine the location.
If it is moved from here, it will not remain on the call stack. In other words, you
cannot return to here.
After the jump you have to use the [cm] tag to stop displaying the button.

Parameter

Needed? Explanation
Name

sets the image for the button. Put this file in the image
graphic no
folder
set the scenario file to jump to. If this is omitted the current
storage no
scenario file is used.
sets the label to jump to. If this is omitted the beginning of
target no
the file is used
TyranoScript only (not KAG3). This name is used later to
reference this by tags like [anim] tag. Basically by setting
name no
this name you can set this as a JS class. If you divide them
with commas you can designate multiple names.
x no sets the button’s horizontal position
y no sets the button’s vertical position
width no sets the button’s horizontal position
width no sets the button’s width
height no sets the button’s height
set to true or false. The default is false. If set to true it
fix no moves the button to a fixed layer and this scenario file can
be continued even though the button is being shown. For

63
example if you always wanted to show a save button you
would use this. And if you wanted to remove a component
from a fixed layer you would user the [fixclear] tag
set as true or false. default is false. When the button is
savesnap no
pressed a save state (savesnap) is created.
set the folder. The foreground image defaults to fgimage
folder no and the background image defaults to bgimage but folder
can be set and used.
exp no Set JavaScript to be performed when you set this button
this can put the value of something into memory. When the
preexp no button is clicked any variables can declared in this can be
used.
Sample Code

[locate x=20 y=100]


[button graphic="oda.png" target=*oda]

[locate x=300 y=100]


[button graphic="toyo.png" target=*toyo]

[clickable] Set Clickable Area


Defines a clickable area.
Because showing clickable areas pause the execution of the scenario script, a
jump target must be set. Also as with graphical button’s [locate] tag must be set
for reference.
Keep in mind that this movement does not exist on the call stack so a return is
not possible.
Important:if an [s]tag is reached, the clickable area will not be valid. Only use
the [s] tag to stop the game.

64
Parameter

Needed? Explanation
Name

width yes set width of area

height yes set height of area

You can show a border of the area with a line. The style
of the line looks like this: “thickness:style:color”.
borderstyle no
Possible line types are solid double groove dashed
dotted etc

color no specify the box like this: 0xRRGGBB

this sets the opacity from 0-255. 0 is completely


opacity no
transparent.

when the mouse is over the clickable area you can


mouseopacityno change the transparency. Values can range from 0-255.
0 is completely transparent

set the scenario file to jump to. If this is omitted the


storage no
current file will be used.

when the clickable area is clicked jump to that location.


target no
If omitted it will jump to the top.

Sample Code

[locate x=20 y=100]


[clickable width=200 height=300 target=*oda]
[locate x=300 y=100]
[clickable width=100 height=100 border="solid:1px:gray" target=*oda]

65
4.3.11. Live2D

[live2d_new] Generate Live2D Model


Parameter

Needed? Explanation
Name

name yes Live2D Model’s ID (name applied to model.json)

left no x position of the Live2D model

top no y position of the Live2D model

width no width of the Live2D model

height no height of the Live2D model

zindex no depth of the Live2D model

opacity no transparency of the Live2D model (0~1.0)

x position of the Live2D model within the canvas


glleft no
(approximately 0.0〜2.0)

y position of the Live2D model within the canvas


gltop no
(approximately 0.0〜2.0)

glscale no scaling of the Live2D model (approximately 0.0〜2.0)

Sample Code

[live2d_new name="nasuka"]

66
[live2d_show] Display Live2D Model
Parameter Needed? Explanation
name yes Live2D Model’s ID (name applied to model.json)
time no Transition time (1000=1 second)
Sample Code

[live2d_show name="nasuka"]

[live2d_hide] Hide Live2D Model


Parameter Needed? Explanation
name yes Live2D Model’s ID (name applied to model.json)
time no Transition time (1000=1 second)
Sample Code

[live2d_hide name="nasuka"]

[live2d_opacity] Adjust the opacity of Live2D


Model
Parameter Needed? Explanation
name yes Live2D Model’s ID (name applied to model.json)
opacity no Transparency (0 ~ 1.0)
time no Transition time (1000=1 second)
Sample Code

[live2d_opacity name="nasuka"]

67
[live2d_delete] Remove Live2D Model
Parameter Needed? Explanation
name yes Live2D Model’s ID (name applied to model.json)
Sample Code

[live2d_delete name="nasuka"]

[live2d_motion] Play Live2D Model Motion


Parameter Needed? Explanation
name yes Live2D Model’s ID (name applied to model.json)
filenm no Transparency (0 ~ 1.0)
idle no Toggle idling (‘on’ or ‘off’)
Sample Code

[live2d_motion name="nasuka"]

[live2d_trans] Move Live2D Model


Parameter Needed? Explanation
name yes Live2D Model’s ID (name applied to model.json)
left yes x position
top yes y position
time no transition time (1000=1 second)
Input the number by which to move from the current position.
E.g. To move horizontally only, use top=0 left=100
Sample Code

[live2d_trans name="nasuka"]

68
[live2d_rotate] Rotate Live2D Model
Parameter Needed? Explanation
name yes Live2D Model’s ID (name applied to model.json)
rotate yes Angle of rotation
time no transition time (1000=1 second)
Sample Code

[live2d_rotate name="nasuka"]

[live2d_scale] Enlarge or reduce Live2D Model


Parameter Needed? Explanation
name yes Live2D Model’s ID (name applied to model.json)
scaleX yes x scale
scaleY yes y scale
time no transition time (1000=1 second)
Sample Code

[live2d_scale name="nasuka"]

[live2d_shake] Shake Live2D Model


Parameter NameNeeded?Explanation
name yes Live2D Model’s ID (name applied to model.json)
Sample Code

[live2d_shake name="nasuka"]

69

You might also like