PathwayWidget
From WikiPathways
(→Multiple Labels and Colors) |
Current revision (22:16, 21 September 2020) (view source) (→Examples: Add Toolforge option showing mapped identifiers) |
||
| (11 intermediate revisions not shown.) | |||
| Line 1: | Line 1: | ||
The pathway widget can be used to include a pathway viewer in your website. You can include a pathway widget by adding the following code snippet to your site: | The pathway widget can be used to include a pathway viewer in your website. You can include a pathway widget by adding the following code snippet to your site: | ||
| - | <pre><nowiki><iframe src =" | + | <pre><nowiki><iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=PATHWAYID[&rev=REVISION]" width="500" height="500" style="overflow:hidden;"></iframe></nowiki></pre> |
In the iframe url, specify the ''id'' parameter by replacing PATHWAYID with the identifier of the pathway you want to add (e.g. WP4, you can find this identifier in the url of the pathway page) and optionally specify the ''rev'' parameter by replacing REVISION by a specific revision number of the pathway (you can find these in the ''history'' section on the pathway page). If you leave out the ''rev'' parameter, the widget will always show the most recent version of the pathway. | In the iframe url, specify the ''id'' parameter by replacing PATHWAYID with the identifier of the pathway you want to add (e.g. WP4, you can find this identifier in the url of the pathway page) and optionally specify the ''rev'' parameter by replacing REVISION by a specific revision number of the pathway (you can find these in the ''history'' section on the pathway page). If you leave out the ''rev'' parameter, the widget will always show the most recent version of the pathway. | ||
| Line 8: | Line 8: | ||
To add a widget for the newest version of the [[Pathway:WP87|mouse nucleotide metabolism pathway]], use the following code snippet: | To add a widget for the newest version of the [[Pathway:WP87|mouse nucleotide metabolism pathway]], use the following code snippet: | ||
| - | <pre><nowiki><iframe src =" | + | <pre><nowiki><iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP87" width="600px" height="300px" style="overflow:hidden;"></iframe></nowiki></pre> |
<html> | <html> | ||
| - | <iframe src =" | + | <iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP87" width="600px" height="300px" style="overflow:hidden;"></iframe> |
</html> | </html> | ||
| + | |||
| + | Alternate Option: Pathway Viewer on Toolforge (in beta) | ||
| + | <pre><nowiki><iframe src ="https://pathway-viewer.toolforge.org/?id=WP554" width="600px" height="300px" style="overflow:hidden;"></iframe></nowiki></pre> | ||
=== Specific version of the pathway === | === Specific version of the pathway === | ||
To add a widget for a specific version of the pathway, lookup the revision in the ''history'' section on the pathway page and add it as the ''rev'' parameter to the ''iframe'' url. For example, to point to revision 71749 of the [[Pathway:WP87|mouse nucleotide metabolism pathway]], use the following code snippet: | To add a widget for a specific version of the pathway, lookup the revision in the ''history'' section on the pathway page and add it as the ''rev'' parameter to the ''iframe'' url. For example, to point to revision 71749 of the [[Pathway:WP87|mouse nucleotide metabolism pathway]], use the following code snippet: | ||
| - | <pre><nowiki><iframe src =" | + | <pre><nowiki><iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP87&rev=71749" width="600px" height="300px" style="overflow:hidden;"></iframe></nowiki></pre> |
''Note that older revisions that use GPML schema prior to 2013a may not be rendered as interactive SVG. A static PNG will be shown in these cases.'' | ''Note that older revisions that use GPML schema prior to 2013a may not be rendered as interactive SVG. A static PNG will be shown in these cases.'' | ||
<html> | <html> | ||
| - | <iframe src =" | + | <iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP87&rev=71749" width="600px" height="300px" style="overflow:hidden;"></iframe> |
</html> | </html> | ||
| Line 28: | Line 31: | ||
You can change the size of the widget with the ''width'' and ''height'' parameters of the ''iframe'' tag: | You can change the size of the widget with the ''width'' and ''height'' parameters of the ''iframe'' tag: | ||
| - | <pre><nowiki><iframe src =" | + | <pre><nowiki><iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP12" width="800px" height="300px" style="overflow:hidden;"></iframe></nowiki></pre> |
<html> | <html> | ||
| - | <iframe src =" | + | <iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP12" width="800px" height="300px" style="overflow:hidden;"></iframe> |
</html> | </html> | ||
| Line 37: | Line 40: | ||
You can highlight specific elements on the pathway. You can match by text label (get parameter 'label') or external reference (get parameter 'xref'). You can also specify the highlight color(s) using the 'colors' parameter. You can provide colors in names (e.g. 'red') or hexadecimals (e.g. '%23FF0000', note that the # sign needs to be encoded in the url). If you provide a single color, all highlights will get that color (e.g. colors='red'), but you can also provide multiple colors as a comma separated list (e.g. colors='red,green,blue'). | You can highlight specific elements on the pathway. You can match by text label (get parameter 'label') or external reference (get parameter 'xref'). You can also specify the highlight color(s) using the 'colors' parameter. You can provide colors in names (e.g. 'red') or hexadecimals (e.g. '%23FF0000', note that the # sign needs to be encoded in the url). If you provide a single color, all highlights will get that color (e.g. colors='red'), but you can also provide multiple colors as a comma separated list (e.g. colors='red,green,blue'). | ||
| - | ==== Label | + | ==== Label and Color ==== |
| - | <pre><nowiki><iframe src =" | + | <pre><nowiki><iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP528&label=PEMT&colors=green" width="800px" height="400px" style="overflow:hidden;"></iframe></nowiki></pre> |
<html> | <html> | ||
| - | <iframe src =" | + | <iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP528&label=PEMT&colors=green" width="800px" height="400px" style="overflow:hidden;"></iframe> |
</html> | </html> | ||
| + | |||
| + | Alternate Option: Pathway Viewer on Toolforge (in beta) | ||
| + | <pre><nowiki><iframe src ="https://pathway-viewer.toolforge.org/?id=WP528&lightgreen=PEMT" width="600px" height="300px" style="overflow:hidden;"></iframe></nowiki></pre> | ||
==== Multiple Labels and Colors ==== | ==== Multiple Labels and Colors ==== | ||
| - | <pre><nowiki><iframe src =" | + | <pre><nowiki><iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP528&label[]=PEMT&label[]=Choline&label[]=CHKA&colors=green,red,blue" width="800px" height="400px" style="overflow:hidden;"></iframe></nowiki></pre> |
<html> | <html> | ||
| - | <iframe src =" | + | <iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP528&label[]=PEMT&label[]=Choline&label[]=CHKA&colors=green,red,blue" width="800px" height="400px" style="overflow:hidden;"></iframe> |
</html> | </html> | ||
| - | ==== | + | Alternate Option: Pathway Viewer on Toolforge (in beta) |
| - | <pre><nowiki><iframe src =" | + | <pre><nowiki><iframe src ="https://pathway-viewer.toolforge.org/?id=WP528&lightgreen=PEMT&pink=Choline&lightblue=CHKA" width="600px" height="300px" style="overflow:hidden;"></iframe></nowiki></pre> |
| + | |||
| + | ==== Xref and Color ==== | ||
| + | <pre><nowiki><iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP528&xref=10400,Entrez Gene&colors=green" width="800px" height="400px" style="overflow:hidden;"></iframe></nowiki></pre> | ||
<html> | <html> | ||
| - | <iframe src =" | + | <iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP528&xref=10400,Entrez Gene&colors=green" width="800px" height="400px" style="overflow:hidden;"></iframe> |
</html> | </html> | ||
| + | |||
| + | Alternate Option: Pathway Viewer on Toolforge (in beta) | ||
| + | <pre><nowiki><iframe src ="https://pathway-viewer.toolforge.org/?id=WP528&lightgreen=Entrez_Gene_10400" width="600px" height="300px" style="overflow:hidden;"></iframe></nowiki></pre> | ||
| + | |||
| + | ==== Multiple Xrefs and Colors ==== | ||
| + | <pre><nowiki><iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP528&xref[]=10400,Entrez Gene&xref[]=62-49-7,CAS&xref[]=1119,Entrez Gene&colors=green,red,blue" width="600px" height="300px" style="overflow:hidden;"></iframe></nowiki></pre> | ||
| + | |||
| + | <html> | ||
| + | <iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP528&xref[]=10400,Entrez Gene&xref[]=62-49-7,CAS&xref[]=1119,Entrez Gene&colors=green,red,blue" width="600px" height="300px" style="overflow:hidden;"></iframe> | ||
| + | </html> | ||
| + | |||
| + | Alternate Option: Pathway Viewer on Toolforge (in beta) | ||
| + | <pre><nowiki><iframe src ="https://pathway-viewer.toolforge.org/?id=WP528&lightgreen=Entrez_Gene_10400&pink=CAS_62-49-7&lightblue=Entrez_Gene_1119" width="600px" height="300px" style="overflow:hidden;"></iframe></nowiki></pre> | ||
| + | |||
| + | ==== Mapped Identifiers ==== | ||
| + | Pathway WP528 uses Entrez Gene (NCBIGene) for identifiers, but with the pathway viewer on Toolforge (in beta), you can highlight using Ensembl identifiers: | ||
| + | <pre><nowiki><iframe src ="https://pathway-viewer.toolforge.org/?id=WP528&yellow=Ensembl_ENSG00000110721,Ensembl_ENSG00000161217" width="600px" height="300px" style="overflow:hidden;"></iframe></nowiki></pre> | ||
| + | |||
| + | <html> | ||
| + | <iframe src ="https://pathway-viewer.toolforge.org/?id=WP528&yellow=Ensembl_ENSG00000110721,Ensembl_ENSG00000161217" width="600px" height="300px" style="overflow:hidden;"></iframe> | ||
| + | </html> | ||
| + | |||
| + | Supported identifiers include Entrez Gene (NCBIGene), Ensembl, HGNC, Wikidata, ChEBI and HMDB. | ||
Current revision
The pathway widget can be used to include a pathway viewer in your website. You can include a pathway widget by adding the following code snippet to your site:
<iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=PATHWAYID[&rev=REVISION]" width="500" height="500" style="overflow:hidden;"></iframe>
In the iframe url, specify the id parameter by replacing PATHWAYID with the identifier of the pathway you want to add (e.g. WP4, you can find this identifier in the url of the pathway page) and optionally specify the rev parameter by replacing REVISION by a specific revision number of the pathway (you can find these in the history section on the pathway page). If you leave out the rev parameter, the widget will always show the most recent version of the pathway.
Contents |
Examples
To add a widget for the newest version of the mouse nucleotide metabolism pathway, use the following code snippet:
<iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP87" width="600px" height="300px" style="overflow:hidden;"></iframe>
<html> <iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP87" width="600px" height="300px" style="overflow:hidden;"></iframe> </html>
Alternate Option: Pathway Viewer on Toolforge (in beta)
<iframe src ="https://pathway-viewer.toolforge.org/?id=WP554" width="600px" height="300px" style="overflow:hidden;"></iframe>
Specific version of the pathway
To add a widget for a specific version of the pathway, lookup the revision in the history section on the pathway page and add it as the rev parameter to the iframe url. For example, to point to revision 71749 of the mouse nucleotide metabolism pathway, use the following code snippet:
<iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP87&rev=71749" width="600px" height="300px" style="overflow:hidden;"></iframe>
Note that older revisions that use GPML schema prior to 2013a may not be rendered as interactive SVG. A static PNG will be shown in these cases.
<html> <iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP87&rev=71749" width="600px" height="300px" style="overflow:hidden;"></iframe> </html>
Change the size of the widget
You can change the size of the widget with the width and height parameters of the iframe tag:
<iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP12" width="800px" height="300px" style="overflow:hidden;"></iframe>
<html> <iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP12" width="800px" height="300px" style="overflow:hidden;"></iframe> </html>
Highlight elements on the pathway
You can highlight specific elements on the pathway. You can match by text label (get parameter 'label') or external reference (get parameter 'xref'). You can also specify the highlight color(s) using the 'colors' parameter. You can provide colors in names (e.g. 'red') or hexadecimals (e.g. '%23FF0000', note that the # sign needs to be encoded in the url). If you provide a single color, all highlights will get that color (e.g. colors='red'), but you can also provide multiple colors as a comma separated list (e.g. colors='red,green,blue').
Label and Color
<iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP528&label=PEMT&colors=green" width="800px" height="400px" style="overflow:hidden;"></iframe>
<html> <iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP528&label=PEMT&colors=green" width="800px" height="400px" style="overflow:hidden;"></iframe> </html>
Alternate Option: Pathway Viewer on Toolforge (in beta)
<iframe src ="https://pathway-viewer.toolforge.org/?id=WP528&lightgreen=PEMT" width="600px" height="300px" style="overflow:hidden;"></iframe>
Multiple Labels and Colors
<iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP528&label[]=PEMT&label[]=Choline&label[]=CHKA&colors=green,red,blue" width="800px" height="400px" style="overflow:hidden;"></iframe>
<html> <iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP528&label[]=PEMT&label[]=Choline&label[]=CHKA&colors=green,red,blue" width="800px" height="400px" style="overflow:hidden;"></iframe> </html>
Alternate Option: Pathway Viewer on Toolforge (in beta)
<iframe src ="https://pathway-viewer.toolforge.org/?id=WP528&lightgreen=PEMT&pink=Choline&lightblue=CHKA" width="600px" height="300px" style="overflow:hidden;"></iframe>
Xref and Color
<iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP528&xref=10400,Entrez Gene&colors=green" width="800px" height="400px" style="overflow:hidden;"></iframe>
<html> <iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP528&xref=10400,Entrez Gene&colors=green" width="800px" height="400px" style="overflow:hidden;"></iframe> </html>
Alternate Option: Pathway Viewer on Toolforge (in beta)
<iframe src ="https://pathway-viewer.toolforge.org/?id=WP528&lightgreen=Entrez_Gene_10400" width="600px" height="300px" style="overflow:hidden;"></iframe>
Multiple Xrefs and Colors
<iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP528&xref[]=10400,Entrez Gene&xref[]=62-49-7,CAS&xref[]=1119,Entrez Gene&colors=green,red,blue" width="600px" height="300px" style="overflow:hidden;"></iframe>
<html> <iframe src ="https://www.wikipathways.org/wpi/PathwayWidget.php?id=WP528&xref[]=10400,Entrez Gene&xref[]=62-49-7,CAS&xref[]=1119,Entrez Gene&colors=green,red,blue" width="600px" height="300px" style="overflow:hidden;"></iframe> </html>
Alternate Option: Pathway Viewer on Toolforge (in beta)
<iframe src ="https://pathway-viewer.toolforge.org/?id=WP528&lightgreen=Entrez_Gene_10400&pink=CAS_62-49-7&lightblue=Entrez_Gene_1119" width="600px" height="300px" style="overflow:hidden;"></iframe>
Mapped Identifiers
Pathway WP528 uses Entrez Gene (NCBIGene) for identifiers, but with the pathway viewer on Toolforge (in beta), you can highlight using Ensembl identifiers:
<iframe src ="https://pathway-viewer.toolforge.org/?id=WP528&yellow=Ensembl_ENSG00000110721,Ensembl_ENSG00000161217" width="600px" height="300px" style="overflow:hidden;"></iframe>
<html> <iframe src ="https://pathway-viewer.toolforge.org/?id=WP528&yellow=Ensembl_ENSG00000110721,Ensembl_ENSG00000161217" width="600px" height="300px" style="overflow:hidden;"></iframe> </html>
Supported identifiers include Entrez Gene (NCBIGene), Ensembl, HGNC, Wikidata, ChEBI and HMDB.
