{"id":20467392,"url":"https://github.com/zhaocq-nlp/attention-visualization","last_synced_at":"2025-04-13T09:12:02.928Z","repository":{"id":201721730,"uuid":"124226314","full_name":"zhaocq-nlp/Attention-Visualization","owner":"zhaocq-nlp","description":"Visualization for simple attention and Google's multi-head attention.","archived":false,"fork":false,"pushed_at":"2018-03-08T05:31:37.000Z","size":2453,"stargazers_count":68,"open_issues_count":1,"forks_count":15,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-04-13T09:11:53.040Z","etag":null,"topics":["attention","attention-visualization","machine-translation","multi-head-attention","neural-machine-translation","visualization"],"latest_commit_sha":null,"homepage":null,"language":"Java","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/zhaocq-nlp.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2018-03-07T11:29:46.000Z","updated_at":"2024-08-30T16:57:09.000Z","dependencies_parsed_at":null,"dependency_job_id":"5304df60-501a-4956-acf0-e034ec379329","html_url":"https://github.com/zhaocq-nlp/Attention-Visualization","commit_stats":null,"previous_names":["zhaocq-nlp/attention-visualization"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zhaocq-nlp%2FAttention-Visualization","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zhaocq-nlp%2FAttention-Visualization/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zhaocq-nlp%2FAttention-Visualization/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zhaocq-nlp%2FAttention-Visualization/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/zhaocq-nlp","download_url":"https://codeload.github.com/zhaocq-nlp/Attention-Visualization/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248688566,"owners_count":21145766,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["attention","attention-visualization","machine-translation","multi-head-attention","neural-machine-translation","visualization"],"created_at":"2024-11-15T13:28:20.742Z","updated_at":"2025-04-13T09:12:02.892Z","avatar_url":"https://github.com/zhaocq-nlp.png","language":"Java","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Attention-Visualization\nVisualization for simple attention and Google's multi-head attention.\n\n## Requirements\n\n- python\n- jdk1.8\n\n## Usage\n\n1\\. Python version (for simple attention only):\n\n``` bash\npython exec/plot_heatmap.py --input xxx.attention\n```\n\n2\\. Java version (for both simple attention and Google's multi-head attention):\n``` bash\njava -jar exec/plot_heatmap.jar\n```\nthen select the attention file on the GUI.\n\n\n## Data Format\n\nThe name of the attention file should end with \".attention\" extension especially when using exec/plot_heatmap.jar and the file should be json format:\n\n``` python\n{ \"0\": {\n    \"source\": \" \",       # the source sentence (without \u003cs\u003e and \u003c/s\u003e symbols)\n    \"translation\": \" \",      # the target sentence (without \u003cs\u003e and \u003c/s\u003e symbols)\n    \"attentions\": [         # various attention results\n        {\n            \"name\": \" \",        # a unique name for this attention\n            \"type\": \" \",        # the type of this attention (simple or multihead)\n            \"value\": [...]      # the attention weights, a json array\n        },      # end of one attention result\n        {...}, ...]     # end of various attention results\n    },   # end of the first sample\n  \"1\":{\n        ...\n    },       # end of the second sample\n    ...\n}       # end of file\n```\n\nNote that due to the hard coding, the `name` of each attention should contain \"encoder_decoder_attention\", \"encoder_self_attention\" or \"decoder_self_attention\" substring on the basis of its real meaning.\n\nThe `value` has shape [length_queries, length_keys] when `type`=simple and has shape [num_heads, length_queries, length_keys] when `type`=multihead.\n\nFor more details, see [attention.py](https://github.com/zhaocq-nlp/NJUNMT-tf/blob/master/njunmt/inference/attention.py).\n\n## Demo\n\nThe `toydata/toy.attention` is generated by a NMT model with a self-attention encoder, Bahdanau's attention and a RNN decoder using [NJUNMT-tf](https://github.com/zhaocq-nlp/NJUNMT-tf).\n\n1\\. Execute the python version (for simple attention only):\n\n``` bash\npython exec/plot_heatmap.py --input toydata/toy.attention\n```\nIt will plot the traditional attention heatmap:\n\n\u003cdiv align=\"center\"\u003e\n  \u003cimg src=\"https://github.com/zhaocq-nlp/Attention-Visualization/blob/master/toydata/figures/py-heatmap1.png\"\u003e\u003cbr\u003e\u003cbr\u003e\n\u003c/div\u003e\n\n\n2\\. As for java version (for both simple attention and Google's multihead attention), execute\n``` bash\njava -jar exec/plot_heatmap.jar\n```\nthen select the `toydata/toy.attention` on the GUI.\n\n\u003cdiv align=\"center\"\u003e\n  \u003cimg src=\"https://github.com/zhaocq-nlp/Attention-Visualization/blob/master/toydata/figures/java-heatmap1.png\"\u003e\u003cbr\u003e\u003cbr\u003e\n\u003c/div\u003e\n\u003cdiv align=\"center\"\u003e\n  \u003cimg src=\"https://github.com/zhaocq-nlp/Attention-Visualization/blob/master/toydata/figures/java-heatmap2.png\"\u003e\u003cbr\u003e\u003cbr\u003e\n\u003c/div\u003e\n\nThe words on the left side are attention \"queries\" and attention \"keys\" are on the right. Click on the words on the left side to see the heatmap:\n\n\u003cdiv align=\"center\"\u003e\n  \u003cimg src=\"https://github.com/zhaocq-nlp/Attention-Visualization/blob/master/toydata/figures/java-heatmap3.png\"\u003e\u003cbr\u003e\u003cbr\u003e\n\u003c/div\u003e\n\nHere shows the traditional `encoder_decoder_attention` of word \"obtained\". The color depth of lines and squares indicate the degree of attention.\n\nNext, select `encoder_self_attention0` under the menu bar. Click on the \"获得\" on the left.\n\n\u003cdiv align=\"center\"\u003e\n  \u003cimg src=\"https://github.com/zhaocq-nlp/Attention-Visualization/blob/master/toydata/figures/java-heatmap4.png\"\u003e\u003cbr\u003e\u003cbr\u003e\n\u003c/div\u003e\n\nIt shows the multi-head attention of the word \"获得\". Attention weights of head0 - head7 are displayed on the right.","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzhaocq-nlp%2Fattention-visualization","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fzhaocq-nlp%2Fattention-visualization","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzhaocq-nlp%2Fattention-visualization/lists"}