Light High Efficiency Graph Component

Qunee for HTML5 Graph Component

last version: V2.8.0.5 - 2022-4-15
A set of network diagram based on HTML5

Using HTML5 technology,draw clean and smooth network diagrams which can be used as social network diagram, topologic graph, flow chart and map, etc; JS component encapsulation; convey complex concept in a simple way; easily build up elegant internet application and enterprise application; make the online visualization of data much easier

Component Features

Qunee's pronunciation

Qunee - pronunciation: “kjuːni”; means elegant and light; conforms with our attitude to product details and user experience

Provide Web graphic solutions

Maps - metro map、statistic map

Qunee provides a great many vector graphs, and displays point data and wiring data and it applies to metro and pipeline application

Qunee supports roaming interaction, infinite zoom and unlimited coordinate range,which suitable for presenting maps. And rich style of polygon, it could solve many problems with map background and statistic maps

Vector graph - social network diagram, administration network graph

Qunee supports different types of pixel style, such as node, wiring and grouping, and is good at layer control; it also supports thousands of graphic elements and smooth operation which bring fluent and efficient visual experience; it solves network data's displaying or interating problem

Others - organization chart, mind mapping, and flow chart

With the help of the powerful tree layout editor,Qunee could solve the problem of the automatic layout of tree structure data,and can be used in organization chart or mind mapping, etc.

Qunee offers plenty of basic graphic and arrow patterns,supports different kinds of wiring type, including curve and orthogonality,and controls the inclusive relationship. Thus it could solve the problem with flow chart.

Easy to develop

Qunee for HTML5 uses JavaScript to develop. Through importing quee-min.js documents and writing simple code, the client could develop topological graphs easily.

<!DOCTYPE html>
<div style="height: 500px;" id="canvas"/>
<script type="module">
    import Q from '';
    let graph = new Q.Graph('canvas');

    let hello = graph.createNode('Hello', 0, -50);
    hello.image = Q.Graphs.server;
    let qunee = graph.createNode("Qunee", 100, 50);
    let edge = graph.createEdge("Hello\nQunee", hello, qunee);
    edge.setStyle(Q.Styles.LABEL_COLOR, '#F00');
Why choose HTML5?

To achieve rich client application, plug-in technology, such as Adobe Flash, Microsoft Silverlight, and Java Applet was needed,which has some problems (plugins needed, or incompatible with mobile platform). By contrast, the advantages of HTML5 are:

With the development of technology,major browsers support the HTML5 in a more and more perfect way.The web page is no longer just displaying text or images. Using a combination of HTML5 technology could achieve more functions:Real-time communicationlocal storagegraphic plotting,With the help of CanvasSVG and CSS3, HTML 5 could creat rich types of graphical interface and animations

With the technical support, it is possible to display professional graphic components in a website.Qunee for HTML5 The use of HTML5,could turn this possibility to reality; it reduces the technical barriers,making efficientrichand dynamic graphical display easier

Use HTML technology
to develop clean and efficient topological graphs

Online Demo Try

If you have any question,please contact

They are using Qunee for HTML5