Representing an App decision flow as a mind map

I am attempting to build a web application to build an app with. Basically, it will work like a mind map, each step is a page, and each page will have options in the page to select. Some pages will lead to another page, whereas some options in a page will lead to another page.

This would be represented as follows in my models:

class Option(models.Model):
    key = models.CharField(max_length=256)
    value = models.CharField(max_length=256)
    def __unicode__(self):
        return self.value

class Item(models.Model):
    key = models.CharField(max_length=256)
    value = models.CharField(max_length=256)
    image = models.ImageField(upload_to="builder/item", null=True, blank=True)
    options = models.ManyToManyField(Option, blank=True)
    goto = models.ForeignKey("Page", null=True, blank=True)

    def __unicode__(self):
        return self.value

class Page(models.Model):
    survey = models.ForeignKey(Survey)
    title = models.CharField(max_length=256)
    items = models.ManyToManyField(Item)
    parent = models.ForeignKey("Page", blank=True, null=True)

I want to build these relationships in a visual way, the user would add a new page, add items to the page, and from each option choose a next page (if applicable) or just next page from the current page (this would be a next arrow on the footer bar of the app). All this would be like a mind map. Sort of how its done in x

I looked at gojs but this does not really do what I want.

Could you point me to other libraries that might be able to do this? Or perhaps there is another type of flow chart that would be useful for this type of visualization?


Source: stackoverflow-javascript