drawio-tools: Online CSV Viewer fails with 403 error

[julamb]

I am trying to import a CSV in drawio using the CSV tool tool (from drawio-tools)

I've tried with different hosts and csv urls (including the one suggested in the tool : https://jgraph.github.io/drawio-diagrams/diagrams/orgchart.csv) but It appears that clicking on the generated link always leads to a "Error loading file - Error 403" message in draw.io.

This seems to be caused by the proxy returning a 403 on csv files, as you can see:

• 403 : https://app.diagrams.net/proxy?url=https%3A%2F%2Fjgraph.github.io%2Fdrawio-diagrams%2Fdiagrams%2Forgchart.csv
• success : https://app.diagrams.net/proxy?url=https%3A%2F%2Fjgraph.github.io%2Fdrawio-diagrams%2Findex.html

[alderg]

We'll replace #S with ?desc in the next release and update the csv link tool.

[julamb]

Great! Do you already know if ?desc be compatible with ?embed=1? Right now it appears that #S is ignored in embed mode.

[alderg]

We'll add {action: 'load', descriptor: {format: 'csv', data: ...}} to support this in embed mode, eg.

{action: 'load', descriptor: {format: 'csv', data: '##\n' + '## Example CSV import. Use ## for comments and # for configuration. Paste CSV below.\n' + '## The following names are reserved and should not be used (or ignored):\n' + '## id, tooltip, placeholder(s), link and label (see below)\n' + '##\n' + '#\n' + '## Node label with placeholders and HTML.\n' + '## Default is \'%name_of_first_column%\'.\n' + '#\n' + '# label: %name%<br><i style="color:gray;">%position%</i><br><a href="mailto:%email%">Email</a>\n' + '#\n' + '## Node style (placeholders are replaced once).\n' + '## Default is the current style for nodes.\n' + '#\n' + '# style: label;image=%image%;whiteSpace=wrap;html=1;rounded=1;fillColor=%fill%;strokeColor=%stroke%;\n' + '#\n' + '## Parent style for nodes with child nodes (placeholders are replaced once).\n' + '#\n' + '# parentstyle: swimlane;whiteSpace=wrap;html=1;childLayout=stackLayout;horizontal=1;horizontalStack=0;resizeParent=1;resizeLast=0;collapsible=1;\n' + '#\n' + '## Optional column name that contains a reference to a named style in styles.\n' + '## Default is the current style for nodes.\n' + '#\n' + '# stylename: -\n' + '#\n' + '## JSON for named styles of the form {"name": "style", "name": "style"} where style is a cell style with\n' + '## placeholders that are replaced once.\n' + '#\n' + '# styles: -\n' + '#\n' + '## JSON for variables in styles of the form {"name": "value", "name": "value"} where name is a string\n' + '## that will replace a placeholder in a style.\n' + '#\n' + '# vars: -\n' + '#\n' + '## Optional column name that contains a reference to a named label in labels.\n' + '## Default is the current label.\n' + '#\n' + '# labelname: -\n' + '#\n' + '## JSON for named labels of the form {"name": "label", "name": "label"} where label is a cell label with\n' + '## placeholders.\n' + '#\n' + '# labels: -\n' + '#\n' + '## Uses the given column name as the identity for cells (updates existing cells).\n' + '## Default is no identity (empty value or -).\n' + '#\n' + '# identity: -\n' + '#\n' + '## Uses the given column name as the parent reference for cells. Default is no parent (empty or -).\n' + '## The identity above is used for resolving the reference so it must be specified.\n' + '#\n' + '# parent: -\n' + '#\n' + '## Adds a prefix to the identity of cells to make sure they do not collide with existing cells (whose\n' + '## IDs are numbers from 0..n, sometimes with a GUID prefix in the context of realtime collaboration).\n' + '## Default is csvimport-.\n' + '#\n' + '# namespace: csvimport-\n' + '#\n' + '## Connections between rows ("from": source colum, "to": target column).\n' + '## Label, style and invert are optional. Defaults are \'\', current style and false.\n' + '## If placeholders are used in the style, they are replaced with data from the source.\n' + '## An optional placeholders can be set to target to use data from the target instead.\n' + '## In addition to label, an optional fromlabel and tolabel can be used to name the column\n' + '## that contains the text for the label in the edges source or target (invert ignored).\n' + '## The label is concatenated in the form fromlabel + label + tolabel if all are defined.\n' + '## Additional labels can be added by using an optional labels array with entries of the\n' + '## form {"label": string, "x": number, "y": number, "dx": number, "dy": number} where\n' + '## x is from -1 to 1 along the edge, y is orthogonal, and dx/dy are offsets in pixels.\n' + '## The target column may contain a comma-separated list of values.\n' + '## Multiple connect entries are allowed.\n' + '#\n' + '# connect: {"from": "manager", "to": "name", "invert": true, "label": "manages", \\\n' + '# "style": "curved=1;endArrow=blockThin;endFill=1;fontSize=11;"}\n' + '# connect: {"from": "refs", "to": "id", "style": "curved=1;fontSize=11;"}\n' + '#\n' + '## Node x-coordinate. Possible value is a column name. Default is empty. Layouts will\n' + '## override this value.\n' + '#\n' + '# left: \n' + '#\n' + '## Node y-coordinate. Possible value is a column name. Default is empty. Layouts will\n' + '## override this value.\n' + '#\n' + '# top: \n' + '#\n' + '## Node width. Possible value is a number (in px), auto or an @ sign followed by a column\n' + '## name that contains the value for the width. Default is auto.\n' + '#\n' + '# width: auto\n' + '#\n' + '## Node height. Possible value is a number (in px), auto or an @ sign followed by a column\n' + '## name that contains the value for the height. Default is auto.\n' + '#\n' + '# height: auto\n' + '#\n' + '## Padding for autosize. Default is 0.\n' + '#\n' + '# padding: -12\n' + '#\n' + '## Comma-separated list of ignored columns for metadata. (These can be\n' + '## used for connections and styles but will not be added as metadata.)\n' + '#\n' + '# ignore: id,image,fill,stroke,refs,manager\n' + '#\n' + '## Column to be renamed to link attribute (used as link).\n' + '#\n' + '# link: url\n' + '#\n' + '## Spacing between nodes. Default is 40.\n' + '#\n' + '# nodespacing: 40\n' + '#\n' + '## Spacing between levels of hierarchical layouts. Default is 100.\n' + '#\n' + '# levelspacing: 100\n' + '#\n' + '## Spacing between parallel edges. Default is 40. Use 0 to disable.\n' + '#\n' + '# edgespacing: 40\n' + '#\n' + '## Name or JSON of layout. Possible values are auto, none, verticaltree, horizontaltree,\n' + '## verticalflow, horizontalflow, organic, circle or a JSON string as used in Layout, Apply.\n' + '## Default is auto.\n' + '#\n' + '# layout: auto\n' + '#\n' + '## ---- CSV below this line. First line are column names. ----\n' + 'name,position,id,location,manager,email,fill,stroke,refs,url,image\n' + 'Tessa Miller,CFO,emi,Office 1,,me@example.com,#dae8fc,#6c8ebf,,https://www.draw.io,https://cdn3.iconfinder.com/data/icons/user-avatars-1/512/users-3-128.png\n' + 'Edward Morrison,Brand Manager,emo,Office 2,Tessa Miller,me@example.com,#d5e8d4,#82b366,,https://www.draw.io,https://cdn3.iconfinder.com/data/icons/user-avatars-1/512/users-10-3-128.png\n' + 'Alison Donovan,System Admin,rdo,Office 3,Tessa Miller,me@example.com,#d5e8d4,#82b366,"emo,tva",https://www.draw.io,https://cdn3.iconfinder.com/data/icons/user-avatars-1/512/users-2-128.png\n' + 'Evan Valet,HR Director,tva,Office 4,Tessa Miller,me@example.com,#d5e8d4,#82b366,,https://www.draw.io,https://cdn3.iconfinder.com/data/icons/user-avatars-1/512/users-9-2-128.png\n'}}

[julamb]

Sounds good! Thanks!

[julamb]

Hi @alderg, any pointer on when the new version should be coming out? Thanks 👍