Production Process GoJS Sample

Select a node to see more information.

This process flow diagram partially simulates the production process for gas and oil byproducts into their end products.

Below is the JSON data for the model:

{ "class": "go.GraphLinksModel",
  "nodeDataArray": [
{
  "key":1, "pos":"-180 -57", "icon":"natgas", "iconWidth": 30, "iconHeight": 60, "portHeight": 20,
  "text":"Gas\nCompanies",
  "description": "Provides natural gas liquids (NGLs).",
  "caption":"Gas Drilling Well",
  "imgsrc":"https://upload.wikimedia.org/wikipedia/commons/thumb/5/5d/BarnettShaleDrilling-9323.jpg/256px-BarnettShaleDrilling-9323.jpg"
},
{
  "key":2, "pos":"-180 100", "icon":"oil", "iconWidth": 40, "iconHeight": 60, "portHeight": 20,
  "text":"Oil\nCompanies",
  "description": "Provides associated petroleum gas (APG). This type of gas used to be released as waste from oil drilling, but is now commonly captured for processing.",
  "caption":"Offshore oil well",
  "imgsrc":"https://upload.wikimedia.org/wikipedia/commons/thumb/a/ab/Oil_platform_P-51_%28Brazil%29.jpg/512px-Oil_platform_P-51_%28Brazil%29.jpg"
},
{
  "key":3, "pos":"-80 100", "icon":"gasprocessing", "iconWidth": 40, "iconHeight": 40,
  "text":"Gas Processing",
  "description":"APG processing turns associated petrolium gas into natural gas liquids (NGLs) and stable natural gas (SGN).",
  "caption":"Natural gas plant",
  "imgsrc":"https://upload.wikimedia.org/wikipedia/commons/thumb/6/68/Solohiv_natural_gas_plant_-_fragment.jpg/256px-Solohiv_natural_gas_plant_-_fragment.jpg"
},
{
  "key":4, "pos":"30 -50", "icon":"fractionation", "iconWidth": 40, "iconHeight": 60,
  "text":"Gas Fractionation",
  "description": "Natural gas liquids are separated into individual hydrocarbons like propane and butanes, hydrocarbon mixtures (naphtha) and liquefied petroleum gases (LPGs).",
  "caption":"Gas Plant",
  "imgsrc":"https://upload.wikimedia.org/wikipedia/commons/thumb/2/20/Gasblok.jpg/256px-Gasblok.jpg"
},
{
  "key":5, "pos":"130 -50", "icon":"pyrolysis", "iconWidth": 40, "iconHeight": 40,  "color":"#FFBC00",
  "text":"Pyrolysis (Cracking)",
  "description": "Liquefied petroleum gases (LPGs) are transformed into Ethylene, propylene, benzene, and other by-products.",
  "caption":"Pyrolysis plant",
  "imgsrc":"https://upload.wikimedia.org/wikipedia/commons/6/6c/Guelph.jpg"
},

{
  "key":6, "pos":"330 -140", "icon":"polymerization", "iconWidth": 40, "iconHeight": 40,  "portHeight": 12, "color":"#E63538",
  "text":"Basic Polymers",
  "description": "Ethylene and propylene (monomers) are processed into end products using various methods (polymerization).",
  "caption":"Plastics engineering-Polymer products",
  "imgsrc":"https://upload.wikimedia.org/wikipedia/commons/thumb/4/4c/Plastics_engineering-Polymer_products.jpg/256px-Plastics_engineering-Polymer_products.jpg"
},

{
  "key":7, "pos":"330 -55", "icon":"polymerization", "iconWidth": 40, "iconHeight": 40,  "portHeight": 12, "color":"#1F8235",
  "text":"Plastics",
  "description": "Polymerization produces PET, glycols, alcohols, expandable polystyrene, acrylates, BOPP-films and geosynthetics.",
  "caption":"Lego Color Bricks",
  "imgsrc":"https://upload.wikimedia.org/wikipedia/commons/thumb/3/32/Lego_Color_Bricks.jpg/256px-Lego_Color_Bricks.jpg"
},
{
  "key":8, "pos":"330 40", "icon":"polymerization", "iconWidth": 40, "iconHeight": 40, "portHeight": 12, "color":"#5D9F31",
  "text":"Synthetic Rubbers",
  "description": "Polymerization produces commodity and specialty rubbers and thermoplastic elastomers.",
  "caption":"Sheet of synthetic rubber coming off the rolling mill at the plant of Goodrich",
  "imgsrc":"https://upload.wikimedia.org/wikipedia/commons/thumb/2/23/Sheet_of_synthetic_rubber_coming_off_the_rolling_mill_at_the_plant_of_Goodrich.jpg/512px-Sheet_of_synthetic_rubber_coming_off_the_rolling_mill_at_the_plant_of_Goodrich.jpg"
},
{
  "key":9, "pos":"330 115", "color":"#FFBC00", "portHeight": 22,
  "text":"Intermediates",
  "description": "Produced Ethylene, Propylene, Butenes, Benzene, and other by-products.",
  "caption":"Propylene Containers",
  "imgsrc":"https://upload.wikimedia.org/wikipedia/commons/thumb/2/2e/XVJ-12_Propylene_%288662385917%29.jpg/256px-XVJ-12_Propylene_%288662385917%29.jpg"
},
{
  "key":10, "pos":"330 205", "icon":"finishedgas", "iconWidth": 30, "iconHeight": 30, "portHeight": 15,
  "text":"LPG, Naphtha, MTBE",
  "description": "Propane, butane, and other general purpose fuels and byproducts.",
  "caption":"Liquid Petroleum Gas Truck",
  "imgsrc":"https://upload.wikimedia.org/wikipedia/commons/thumb/5/52/LPG_Truck.jpg/256px-LPG_Truck.jpg"
},
{
  "key":11, "pos":"330 280", "icon":"finishedgas", "iconWidth": 30, "iconHeight": 30, "portHeight": 15,
  "text":"Natural Gas, NGLs",
  "description": "Used for heating, cooking, and electricity generation",
  "caption":"Natural Gas Flame",
  "imgsrc":"https://upload.wikimedia.org/wikipedia/commons/thumb/0/03/%22LPG_flame%22.JPG/512px-%22LPG_flame%22.JPG"
}
],
  "linkDataArray": [
{"from":1, "to":4 },
{"from":2, "to":3, "label": "APG" },
{"from":3, "to":4 },
{"from":3, "to":5, "toSpot":"bottom" },
{"from":4, "to":5 },
{"from":4, "to":5 },
{"from":3, "to":11, "fromSpot":"bottom" },
{"from":4, "to":10, "fromSpot":"bottom" },

{"from":5, "to":6, "fromSpot":"rightsingle", "color":"#FFBC00" },
{"from":5, "to":7, "fromSpot":"rightsingle", "color":"#FFBC00" },
{"from":5, "to":8, "fromSpot":"rightsingle", "color":"#FFBC00" },
{"from":5, "to":9, "fromSpot":"rightsingle", "color":"#FFBC00" }
 ]}