Git Product home page Git Product logo

next2d / player Goto Github PK

View Code? Open in Web Editor NEW
45.0 3.0 5.0 6.48 MB

Next2D Player supports WebGL and OffscreenCanvas, enabling advanced graphical expression. It can also be used in game production, advertisement production, and other scenes requiring rich expressions without having to deal with browser or device compatibility.

Home Page: https://next2d.app

License: MIT License

JavaScript 1.07% TypeScript 98.93%
webgl2 webgl next2d game-development typescript offscreencanvas

player's Introduction

Next2D Player

Next2D Player

UnitTest CodeQL Lint

release Github All Releases Discord Twitter

[日本語]
Next2D Playerは、WebGLのハードウェアアクセラレーションでグラフィックス処理負荷を軽減し、OffscreenCanvasのマルチスレッド処理で描画パフォーマンスを向上させています。
ベクター描画、Tweenアニメーション、テキスト、音声、動画など、さまざまな要素をサポートしているので、ゲーム制作、インタラクティブなデータビジュアライゼーション、クリエイティブなウェブアプリケーションなど、豊かな表現が必要とされるプロジェクトで活用が期待できます。

[English]
Next2D Player reduces graphics processing load with WebGL hardware acceleration and improves drawing performance with OffscreenCanvas multi-threaded processing.
With support for vector rendering, tween animation, text, audio, video, and many other elements, Next2D Player can be used for game production, interactive data visualization, creative web applications, and other projects that require rich expression. The software is expected to be used in game production, interactive data visualization, creative web applications and other projects requiring rich expression.

[简体中文]
Next2D Player通过WebGL硬件加速降低了图形处理负载,通过OffscreenCanvas多线程处理提高了绘图性能。
由于支持矢量绘图、Tween动画、文本、音频、视频和许多其他元素,它可用于游戏制作、交互式数据可视化、创意网络应用和其他需要丰富表达的项目。 该软件可用于需要丰富表现力的项目中。

Support

[日本語]
最新ニュースや技術情報は、Twitterの@Next2Dや公式のWebsiteで発信していきますので、チェックしてみてください。
Next2Dがお役に立つようでしたら、プロジェクトをご支援いただければ幸いです。

[English]
Please check @Next2D on Twitter and the official website for the latest news and technical information.
If Next2D is useful to you, we hope you will support our project.

[简体中文]
请在Twitter上查看@Next2D官方网站,了解最新的新闻和技术信息。
如果Next2D对你有用,我们希望你能支持我们的项目。

Related Sites

Examples

Use Simple Sample

next2d.load("Path to JSON output from NoCode Tool");

CodePen

Use Program Sample

const { Loader }     = next2d.display;
const { URLRequest } = next2d.net;
const { Event }      = next2d.events;

// create root MovieClip
const start = async () => 
{
    const root = await next2d.createRootMovieClip();

    const request = new URLRequest("JSON path");
    const loader  = new Loader(request);
    
    loader
        .contentLoaderInfo
        .addEventListener(Event.COMPLETE, (event) =>
        {
            root.addChild(event.currentTarget.content);
        });
    
    loader.load(request);
};

start();

Use Program Sample

CodePen
@see API Documentation

Option settings

[日本語]

プロパティ名 デフォルト値 説明
base string empty 相対パスでJSONを取得する場合、ここで設定したURLがrootとして適用されます。絶対パスの場合はここで設定したURLは適用されません。
fullScreen boolean false Stageクラスで設定した幅と高さを超えて画面全体に描画されます。
tagId string empty IDを指定すると、指定したIDのエレメント内で描画を行います。
bgColor string "transparent" 背景色を16進数で指定できます。デフォルトは無色透明です。

[English]

name type default description
base string empty When JSON is acquired by a relative path, the URL set here is applied as root. For absolute paths, the URL set here is not applied.
fullScreen boolean false The entire screen is drawn beyond the width and height set in the Stage class.
tagId string empty When an ID is specified, drawing is performed within the element of the specified ID.
bgColor string "transparent" You can specify a background color in hexadecimal. The default is colorless.

[简体中文]

名称 值类型 默认值 说明
base string empty 当JSON是由相对路径获得的,这里设置的URL被应用为根。对于绝对路径,这里设置的URL不被应用。
fullScreen boolean false 整个屏幕的绘制超出了Stage类中设置的宽度和高度。
tagId string empty 当一个ID被指定时,在指定ID的元素内进行绘图。
bgColor string "transparent" 你可以指定一个十六进制的背景颜色。默认为无色。

Flowchart

Flowchart

License

This project is licensed under the MIT License - see the LICENSE file for details.

player's People

Contributors

herberthe avatar ienaga avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

player's Issues

StyleSheet

[memo]
Adjust placement and size management in containers by screen size.

Loader

[TODO]

  • ARRAY_BUFFER
  • loadJSON
  • loadImage

BitmapData

[TODO]

  • applyFilter
  • clone
  • colorTransform
  • compare
  • copyChannel
  • copyPixels
  • dispose
  • fillRect
  • floodFill
  • generateFilterRect
  • getColorBoundsRect
  • getPixel
  • getPixel32
  • getPixels
  • hitTest
  • merge
  • noise
  • paletteMap
  • perlinNoise
  • pixelDissolve
  • scroll
  • setPixel
  • setPixel32
  • setPixels
  • threshold

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.