Questions tagged [jointjs]

JointJS is a JavaScript library for creating fully interactive diagrams and graphs.

JointJS is a JavaScript library for creating diagrams and graphs. The diagrams can be fully interactive. The JointJS API is suitable both for implementing a diagramming tool as well as simply for publishing diagrams.

Resources


Related tags

607 questions
7
votes
3 answers

Making a tooltip on elements created by jointjs

The title says everything, I created a graph on paper and filled with cells and links, now I need to add a tooltip to display information about every element (selected, hover ...). I appreciate all hints, links, answers ...
Constant
  • 71
  • 1
  • 4
7
votes
2 answers

JointJS creating custom Shapes, Diamond, Hexagon

I m new to jointJS, I need to create custom shapes using JointJS, I have tried creating the diamond shape using the Rectangle, making its height and width same, and then rotate by 45 degrees as follows, var diamond = new joint.shapes.basic.Rect({ …
Mayuri Ruparel
  • 694
  • 2
  • 11
  • 36
7
votes
1 answer

joint.js trigger drag start on a new cloned element

How can I trigger pointerdown/dragstart on a cloned joint element in joint js? toolBoxPointerDown is triggered when pointerdown event is fired on toolbox paper. addNode is triggered when pointerup event is fired on _this.paperDrag. var…
Gabriel Burciu
  • 123
  • 2
  • 6
6
votes
2 answers

Change label of a JointJS cell by clicking on it and type in a new label

I created a diagram with JointJS cells and now I want to change the label of a cell by clicking on it. When I click on a cell a modal pops up and I enter a new text. The text will be stored in a variable. When the modal closes the label of the…
beayze
  • 113
  • 6
6
votes
2 answers

NameSpace Issue in JointJS version 3

I am trying to convert a legacy app from JointJS v2.2.1 to v3.0.2. I’m hitting an error others have found: Uncaught Error: dia.ElementView: markup required. (joint.min.js:8) A helpful person said: “Please note you need to be careful with…
Tachyon80
  • 147
  • 10
6
votes
1 answer

Why are my embedded JointJS elements overlapping?

I am working on a JointJS graph, using DirectedGraph to take care of the layout and I am trying to achieve something similar to the image below. I need the nodes (A, B, C, D, E, F, G, H, I, J) to be "outlined" or enclosed in a separate node (Foo,…
Fjotten
  • 347
  • 3
  • 13
6
votes
2 answers

Can I inject JointJS as an AngularJS module like any other library?

I have an app with angular and I need to use this library http://www.jointjs.com/, So I downloaded the joint.min.js and joint.min.css and placed their routes in the index.html but I don't know what to put in the app.js to inject it and I keep…
theITguy
  • 147
  • 3
  • 9
6
votes
2 answers

How to add an image to an element as a decorator?

Imagine I have Rect element and I wish to decorate it with a small (say 16x16) PNG image in the upper left. I am unable to determine how to achieve that task. I have studied the docs but have (so far) been unable to find a sample or reference on…
Kolban
  • 13,794
  • 3
  • 38
  • 60
6
votes
2 answers

How to create links programmatically in JointJs to ports

I am trying to create links programmatically in JointJs to devs.Model objects that have ports. I've tried to use the addCell for graph from the api (http://jointjs.com/api#joint.dia.Graph:addCell), but for some reason the links created are not…
user3749851
  • 61
  • 1
  • 2
6
votes
1 answer

Bower override dependency

I have an application, written in Backbone with Marionette and some other dependencies, managed through bower : { "name": "admin", "version": "0.1.1", "main": "public/javascripts/app.js", "dependencies": { "lodash": "~2.4.1", …
mavarazy
  • 7,562
  • 1
  • 34
  • 60
6
votes
4 answers

JointJS Non-interactive elements

I want to disable the movement of elements and links in JointJS Diagrams while keeping alive other featurs like hyperlinking of elements and highlighting of link on mouse:hover. I referred to the following…
Lahore
  • 133
  • 3
  • 8
6
votes
3 answers

JointJS : How to restrict links per port to one?

API doc for the JointJS library is here: http://www.jointjs.com/api I'm using DEVS plugin for Elements with ports. I need to restrict number of connections from a port to a single one. Once a link is made from a port, user shouldn't be able to…
Arun Karunagath
  • 1,593
  • 10
  • 24
6
votes
1 answer

How can I change the attrs of a custom object in JointJS?

I created a custom element with the JointJS library . The object have two nested Rectangles with two associated Texts. I want to change his atributtes inside de Model... I only get through JQUERY change his attributes and css, through its ids. I…
Rosencrantz
  • 75
  • 1
  • 8
5
votes
4 answers

How can I use JointJS with an application built with Angular CLI?

I have installed jointjs via npm and also installed typings and code compiles/builds fine. Code import { Component } from '@angular/core'; import * as joint from '../../node_modules/jointjs/dist/joint.min'; export class AppComponent { title =…
5
votes
3 answers

JointJs: Scale custom shape html along with element (using paperScroller.zoom)

Using something like paperScroller.zoom(0.2, { max: 5 }); only causes svg elements to be zoomed, whereas in my custom shape, I've used html as well, which doesn't scale in tandem. Since there's no model.change event firing on scaling, the updateBox…
Sameet
  • 2,191
  • 7
  • 28
  • 55
1
2
3
40 41