透過網頁讀取Photoshop PSD檔案內容
在專案中有需要透過網頁來讀取Photoshop PSD檔案的內部資訊，我們透過PSD.js（備用載點）來實現這樣的功能，在官方提供的功能展示頁中，我們可以看到在頁面中只需引入psd.min.js後，加入透過少量的Javascript就可以針對PSD進行解析。
<!DOCTYPE html>
<html>
<head>
<title>psd.js image example</title>
<style type="text/css">
body, html {
padding: 0;
margin: 0;
}
#dropzone {
width: 500px;
height: 100px;
border: 1px #ababab dashed;
margin: 50px auto;
}
#dropzone p {
text-align: center;
line-height: 100px;
margin: 0;
padding: 0;
}
#image {
text-align: center;
}
</style>
<script type="text/javascript" src="psd.min.js"></script>
</head>
<body>
<div id="dropzone">
<p>Drop here</p>
</div>
<div id="image"></div>
<pre id="data"></pre>
<script type="text/javascript">
(function () {
var PSD = require('psd');
document.getElementById('dropzone').addEventListener('dragover', onDragOver, true);
document.getElementById('dropzone').addEventListener('drop', onDrop, true);
function onDragOver(e) {
e.stopPropagation();
e.preventDefault();
e.dataTransfer.dropEffect = 'copy';
}
function onDrop(e) {
e.stopPropagation();
e.preventDefault();
PSD.fromEvent(e).then(function (psd) {
var data = JSON.stringify(psd.tree().export(), undefined, 2);
document.getElementById('data').innerHTML = data;
document.getElementById('image').appendChild(psd.image.toPng());
});
}
}());
</script>
</body>
</html>
我們透過下圖這樣的一個PSD檔案對頁面進行測試，檔案中共有三個圖層，包含一個文字圖層。
頁面將PSD分析出結果後，以json格式顯示在頁面上，可以看到文字圖層的部分，不僅能讀到圖層名稱也包含文字內容和字型名稱。
{
"children": [
{
"type": "layer",
"visible": true,
"opacity": 1,
"blendingMode": "normal",
"name": "Photoshop Text",
"left": 302,
"right": 723,
"top": 90,
"bottom": 128,
"height": 38,
"width": 421,
"mask": {},
"text": {
"value": "THIS IS TEXT LAYER",
"font": {
"name": "MyriadPro-Regular\u0000",
"sizes": [
53
],
"colors": [
[
0,
0,
0,
255
]
],
"alignment": [
"center"
]
},
"left": 0,
"top": 0,
"right": 0,
"bottom": 0,
"transform": {
"xx": 1,
"xy": 0,
"yx": 0,
"yy": 1,
"tx": 513,
"ty": 127
}
},
"image": {}
},
{
"type": "layer",
"visible": true,
"opacity": 1,
"blendingMode": "normal",
"name": "PSD Icon",
"left": 287,
"right": 738,
"top": 209,
"bottom": 669,
"height": 460,
"width": 451,
"mask": {},
"image": {}
},
{
"type": "layer",
"visible": true,
"opacity": 1,
"blendingMode": "normal",
"name": "Background",
"left": 0,
"right": 1024,
"top": 0,
"bottom": 800,
"height": 800,
"width": 1024,
"mask": {},
"image": {}
}
],
"document": {
"width": 1024,
"height": 800,
"resources": {
"layerComps": [],
"guides": [],
"slices": []
}
}
}
USACanadaPharm: usa canada pharm – canadian mail order pharmacy
https://usacanadapharm.com/# USACanadaPharm
Here is my blog post … Skybridgeeth.Net
Thanks for your publication. One other thing is that often individual states have their very own laws in which affect house owners, which makes it quite difficult for the the nation’s lawmakers to come up with a new set of recommendations concerning property foreclosure on homeowners. The problem is that a state possesses own legal guidelines which may have impact in a damaging manner with regards to foreclosure insurance plans.
Also visit my homepage … best online poker
coumadin 5mg price – buy cozaar pills for sale order losartan without prescription
canadian neighbor pharmacy https://usacanadapharm.com/# pharmacies in canada that ship to the us
legitimate canadian mail order pharmacy
USACanadaPharm: canadianpharmacymeds – usa canada pharm
Hi there to all, it’s genuinely a fastidious for me to pay a visit this web site, it includes priceless Information.
http://ibnews.com.ua/led-optics-guide.html
Современный авто портал https://quebradadelospozos.com свежие новости, каталог машин, рейтинг моделей, видеообзоры и полезные статьи. Помощь при покупке, советы по обслуживанию и анализ рынка.
читайте на автомобильном https://proauto.kyiv.ua портале: тест-драйвы, сравнения, автоаналитика, обзоры технологий и новинки автопрома. Только актуальные материалы и честные мнения.
canada cloud pharmacy: USACanadaPharm – USACanadaPharm
Онлайн-медицинский портал https://novamed.com.ua справочник болезней, симптомы, анализы, лекарства, консультации специалистов и актуальные новости здравоохранения. Всё о здоровье — в одном месте.
Портал о здоровье и медицине https://pravovakrayina.org.ua узнайте больше о своём организме, симптомах, лечении и профилактике. Удобный поиск, рекомендации врачей, база клиник и аптек.
Официальный TG канал проекта – 7k casinо, теперь в вашем Telegram! Актуальное зеркало, ссылки на вход, промокоды на фриспины, регистрация. слоты, играй на реальные деньги с нами! Сайт 7к казинo
https://vk.com/wall-230180565_2
https://usacanadapharm.shop/# usa canada pharm
reputable canadian pharmacy USACanadaPharm canada drugstore pharmacy rx
Water and life
Eth Mixer
Lightning is a dramatic display of electrical power, but it is also sporadic and unpredictable. Even on a volatile Earth billions of years ago, lightning may have been too infrequent to produce amino acids in quantities sufficient for life — a fact that has cast doubt on such theories in the past, Zare said.
Water spray, however, would have been more common than lightning. A more likely scenario is that mist-generated microlightning constantly zapped amino acids into existence from pools and puddles, where the molecules could accumulate and form more complex molecules, eventually leading to the evolution of life.
“Microdischarges between obviously charged water microdroplets make all the organic molecules observed previously in the Miller-Urey experiment,” Zare said. “We propose that this is a new mechanism for the prebiotic synthesis of molecules that constitute the building blocks of life.”
However, even with the new findings about microlightning, questions remain about life’s origins, he added. While some scientists support the notion of electrically charged beginnings for life’s earliest building blocks, an alternative abiogenesis hypothesis proposes that Earth’s first amino acids were cooked up around hydrothermal vents on the seafloor, produced by a combination of seawater, hydrogen-rich fluids and extreme pressure.
Yet another hypothesis suggests that organic molecules didn’t originate on Earth at all. Rather, they formed in space and were carried here by comets or fragments of asteroids, a process known as panspermia.
“We still don’t know the answer to this question,” Zare said. “But I think we’re closer to understanding something more about what could have happened.”
Though the details of life’s origins on Earth may never be fully explained, “this study provides another avenue for the formation of molecules crucial to the origin of life,” Williams said. “Water is a ubiquitous aspect of our world, giving rise to the moniker ‘Blue Marble’ to describe the Earth from space. Perhaps the falling of water, the most crucial element that sustains us, also played a greater role in the origin of life on Earth than we previously recognized.”
What’s up, the whole thing is going sound here and ofcourse every one is sharing data, that’s actually good, keep up writing.
https://anegdot.com.ua/dekoder-led-obmanka-zamina-shtatnykh-can-bus-led-linz-bez-problem
canadian pharmacy sarasota: best canadian pharmacy – the canadian pharmacy
onlinecanadianpharmacy 24 https://usacanadapharm.com/# USACanadaPharm
trustworthy canadian pharmacy
safe canadian pharmacies https://usacanadapharm.shop/# canadian pharmacy cheap
legitimate canadian online pharmacies
check this https://marinade.ink
Water and life
Eth Mixer
Lightning is a dramatic display of electrical power, but it is also sporadic and unpredictable. Even on a volatile Earth billions of years ago, lightning may have been too infrequent to produce amino acids in quantities sufficient for life — a fact that has cast doubt on such theories in the past, Zare said.
Water spray, however, would have been more common than lightning. A more likely scenario is that mist-generated microlightning constantly zapped amino acids into existence from pools and puddles, where the molecules could accumulate and form more complex molecules, eventually leading to the evolution of life.
“Microdischarges between obviously charged water microdroplets make all the organic molecules observed previously in the Miller-Urey experiment,” Zare said. “We propose that this is a new mechanism for the prebiotic synthesis of molecules that constitute the building blocks of life.”
However, even with the new findings about microlightning, questions remain about life’s origins, he added. While some scientists support the notion of electrically charged beginnings for life’s earliest building blocks, an alternative abiogenesis hypothesis proposes that Earth’s first amino acids were cooked up around hydrothermal vents on the seafloor, produced by a combination of seawater, hydrogen-rich fluids and extreme pressure.
Yet another hypothesis suggests that organic molecules didn’t originate on Earth at all. Rather, they formed in space and were carried here by comets or fragments of asteroids, a process known as panspermia.
“We still don’t know the answer to this question,” Zare said. “But I think we’re closer to understanding something more about what could have happened.”
Though the details of life’s origins on Earth may never be fully explained, “this study provides another avenue for the formation of molecules crucial to the origin of life,” Williams said. “Water is a ubiquitous aspect of our world, giving rise to the moniker ‘Blue Marble’ to describe the Earth from space. Perhaps the falling of water, the most crucial element that sustains us, also played a greater role in the origin of life on Earth than we previously recognized.”
Good web site! I really love how it is easy on my eyes and the data are well written. I’m wondering how I could be notified when a new post has been made. I’ve subscribed to your RSS which must do the trick! Have a nice day!
visit https://ringexchange.org
Актуальные новости Украины https://newsportal.kyiv.ua и мира сегодня: главные события, мнения экспертов, интервью, прогнозы. Оставайтесь в курсе с лентой, которая обновляется 24/7.
Главные новости Украины https://novosti24.kyiv.ua и мира — честно, быстро и понятно. События, которые формируют завтрашний день, в одной ленте.
Сайт для женщин https://miymalyuk.com.ua мода, красота, здоровье, отношения, карьера, семья и вдохновение. Актуальные статьи, советы и поддержка для современной женщины каждый день
Авто сайт с обзорами https://microbus.net.ua новостями, тест-драйвами, каталогом моделей, советами по выбору и эксплуатации автомобилей. Всё, что нужно автолюбителю — в одном месте.