I have the IIPImage server running and I am trying to display a deepzoom image but fail
This is how I am doing it :
var tileSource =
{
Image:
{
xmlns: "http://schemas.microsoft.com/deepzoom/2008",
Url: "http://127.0.0.1/fcgi-bin/iipsrv.fcgi?
DeepZoom=E:/DeepZoomFile/10580_12079_1121935_stitch_files/",
Format: "jpg",
Overlap: "2",
TileSize: "256",
Size:
{
Height: "38290",
Width: "17953"
}
}
};
And the important line is :
Url: "http://127.0.0.1/fcgi-bin/iipsrv.fcgi?DeepZoom=E:/DeepZoomFile/10580_12079_1121935_stitch_files/"
I am getting errors from the browser that "fail to load tile image"
Any help or example of how should I do it ?
Thanks
No . It doesn't work with a suffix of DZI
Related
Here using node js ill send request but they give me en error ,add key to the config. I have a key but dont know how to add it?
My code is:
var GoogleMapsAPI = require('googlemaps');
var config = require('config');
var gmAPI = new GoogleMapsAPI();
var params = {
center: '444 W Main St Lock Haven PA',
zoom: 15,
size: '500x400',
maptype: 'roadmap',
markers: [
{
location: '300 W Main St Lock Haven, PA',
label : 'A',
color : 'green',
shadow : true
},
{
location: '444 W Main St Lock Haven, PA',
icon: 'http://chart.apis.google.com/chart?chst=d_map_pin_icon&chld=cafe%7C996600'
}
],
style: [
{
feature: 'road',
element: 'all',
rules: {
hue: '0x00ff00'
}
}
],
path: [
{
color: '0x0000ff',
weight: '5',
points: [
'41.139817,-77.454439',
'41.138621,-77.451596'
]
}
]
};
gmAPI.staticMap(params); // return static map URL
gmAPI.staticMap(params, function(err, binaryImage) {
// fetch asynchronously the binary image
});
and they give me an error:
WARNING: No configurations found in configuration directory:/home/okayg/webstorm_projects/Google_map_API/config
WARNING: To disable this warning set SUPPRESS_NO_CONFIG_WARNING in the environment.
/home/okayg/webstorm_projects/Google_map_API/node_modules/googlemaps/lib/staticMap.js:28
throw error;
^
Error: The staticMap API requires a key. You can add it to the config.
at module.exports [as staticMap] (/home/okayg/webstorm_projects/Google_map_API/node_modules/googlemaps/lib/staticMap.js:40:36)
at Object.<anonymous>
So, how can i add key as they say "using config"?
Thank you.
You can find the answer in the documentation:
https://www.npmjs.com/package/googlemaps
It should be something like:
var publicConfig = {
key: '<YOUR-KEY>',
stagger_time: 1000, // for elevationPath
encode_polylines: false,
secure: true, // use https
proxy: 'http://127.0.0.1:9999' // optional, set a proxy for HTTP requests
};
var gmAPI = new GoogleMapsAPI(publicConfig);
Hope this helps!
In the gruntfile.js i wrote:
// Css Purge
css_purge: {
options: {
"verbose": false,
"no_duplicate_property": true,
},
files: {
src: 'css/bigfile.css',
dest: 'css/purged.css'
},
}
Just to test the bigFile.css is :
body {color: red;}
body, p {color:red;}
p {color: red; font-size: 24px;}
#test p {color: red;}
So terminal message is:
Running "css_purge:files" (css_purge) task
"css/" has been created
Thu May 12 2016 01:33:27 GMT-0400 (EDT) Success! css/bigfile.css : css/purged.css
But the new file purged.css is the same as bigFile.css
Ok just figure it out. It removed only identical rules. So if I have exactly same rule it will be removed in output file. Is there a tool that remove extra css like in my exemple file body,p {color:red;} is extra code since I already have body {color:red;} ?
I've just installed Grunt and grunt-svgstore and am using it to compile my folder of SVG's into one application.svg where each icon has a unique id that I can reference using:
It works fine for some icons, but for others, part of their shapes turn black. In the case of the ruby logo I am linking to above, it shows like: http://cl.ly/image/0X2J0f3i0C1X/Screen%20Shot%202014-08-03%20at%2011.02.47.png
The actually SVG file can be found here: http://cl.ly/2k012T020d2S/ruby-logo.svg
If I open the ruby-logo.svg file in illustrator, it looks fine. I have rexported it, ensured all settings are correct and it still happens.
Any suggestions?
Thanks,
Neil
Solved by adding the following styles to the application.svg import at the top of my document:
width: 0;
height: 0;
visibility: hidden;
Use the "style" option instead..
eg:
svgstore: {
options: {
prefix : 'icon-', // This will prefix each ID
svg: {
viewBox : '0 0 100 100',
xmlns: 'http://www.w3.org/2000/svg',
style: 'display:none;' // This line might help you!
},
cleanup: ['fill','stroke']
},
default: {
files: {
'<%= build_dir %>/assets/<%= pkg.name %>-<%= pkg.version %>.svg': '<%= app_files.svgIcons %>'
}
}
},
We're already creating dynamic HighCharts for our webpages--these have a few javascript dependencies and a chart-generation script. We'd like to start creating PDFs of these charts using the new HighCharts/Node/PhantomJS suite HighCharts has rigged up (see press release). Our image-gen node server would run on a separate box/vm. How can we do this without having to maintain two separate codebases for the same chart? I'm not too familiar with Node yet, so I'm not sure how requesting the scripts with a web request would work. I'm guessing a lot of HighCharts users that want to start generating some of their charts as images server-side will run into a similar issue with managing two related codesets...
In essence, we already have have this:
Webserver -> JSON (data) + foo.js + bar.js + foo.html -> webpage with dynamic charts.
We'd like to build:
Web-server -> JSON (data) + separate Node Server + foo.js + bar.js -> images available via web request
Obviously some redundancy. How can we manage the dependencies?
While node is awesome, I felt that approach was needlessly complex, with having to many moving parts that could break. So I did the super simple solution of creating files dynamically. The only problem i faced was deleting the temporary file after adding it to the pdf. It would break the PDF from rendering. And setting the directory to /tmp, crashed phantomjs. The best idea i came up with currently is putting the tempory generated files, in a temp directory, then deleting everything in that directory every night, with a cronjob.
I post this out of code simplicity. It should be in a function, to maintain code re-usability.
<?php
$TmpInFileName = 'tmp/graph_'.md5($CurrentDate.rand(666,9482845713)).'.js';
$TmpGraphFileName = 'tmp/pnggraph_'.md5($CurrentDate.rand(2666,54713)).'.png';
$Data = "
{
chart: {
zoomType: 'xy',
width: 700,
height: 520
},
credits: {
enabled: false
},
colors: [
'#2f7ed8',
'#910000',
'#8bbc21',
'#1aadce',
'#492970',
'#f28f43',
'#77a1e5',
'#c42525',
'#a6c96a'
],
title: {
text: 'Sample Graph - created at ".date('m/d/Y g:i:s a')."',
style: {
fontSize: '16px',
}
},
xAxis: [{
categories: ['00:00', '00:15', '00:30', '00:45', '01:00', '01:15', '01:30']
}],
yAxis: [{
labels: {
format: '{value}',
style: {
fontSize: '14px',
color: Highcharts.getOptions().colors[1]
}
},
title: {
text: 'Y axis',
style: {
fontSize: '16px',
color: Highcharts.getOptions().colors[1]
}
}
}, { // Secondary yAxis
title: {
text: 'Sec Yaxis',
style: {
fontSize: '16px',
color: Highcharts.getOptions().colors[0]
}
},
labels: {
format: '{value}',
style: {
fontSize: '14px',
color: Highcharts.getOptions().colors[0]
}
},
opposite: true
}],
tooltip: {
shared: true
},
legend: {
layout: 'horizontal',
backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'
},
series: [{
name: 'first',
type: 'spline',
yAxis: 1,
data: [0, -119.9502311075212, -119.96203992145706, -119.98172620218355, -119.71898290168028, -119.97023935590325, -119.95230287195413]
},
{
name: 'second',
type: 'spline',
yAxis: 1,
data: [0, -119.24222667756482, -119.60905809195222, -119.63522965403729, -119.11011466187935, -119.63643171374981, -119.54969080301575]
},{
name: 'third',
type: 'column',
data: [10, 11, 9, 7, 5, 2, 7]
},{
name: 'fourth',
type: 'column',
data: [0, -0.7080044299563895, -0.35298182950484147, -0.34649654814626274, -0.6088682398009269, -0.33380764215343106, -0.40261206893838164]
}]
}";
try {
$myfile = fopen($TmpInFileName, "w") or die("Unable to open file!");
fwrite($myfile, $Data);
fclose($myfile);
} catch (Exception $e) {
echo 'Error: '.$e.' <br />';
}
$URL_Command = "phantomjs /highcharts/exporting-server/phantomjs/highcharts-convert.js -infile $TmpInFileName -outfile $TmpGraphFileName -width 600";
exec($URL_Command);
echo '<img src="'.$TmpGraphFileName.'" alt="Could not load img: '.$TmpGraphFileName.'">';
?>
I hope this helps. I couldn't find a good solution that didn't involve Node.JS or Java to do this. I wanted a pure PHP solution.
We decided to pass the entire highcharts config object (e.g. Highcharts.chart(configObj)) to the node server as a URL-encoded string. We had to put a few rendering functions over on the node server, but it wasn't too bad. We also stuck some of the rendering functions in the string config object. Not the most beautiful result, but it worked.
I am trying a implement a really simple layout using BorderLayout.
var summary = new Ext.Panel({
region:'west',
id:'summary',
title:'Summary layout',
header: true,
split:true,
collapseMode: 'mini',
collapsible: true,
width: 200,
minSize: 175,
maxSize: 400,
layout:'vbox',
align: 'stretch',
items: [{
html: Ext.example.shortBogusMarkup,
title:'Navigation',
autoScroll:true,
border:false,
flex: 1
},{
title:'Settings',
html: Ext.example.shortBogusMarkup,
border:false,
autoScroll:true,
iconCls:'settings',
flex: 1
}]
});
The layout renders well, but when I change the width using the handle, the two panels inside the vbox don't resize.
I tried any kind of configuration I thought of, but i did not work.
(layout fit, width auto, autoWidth, etc...)
What do I miss? Thanks
For me, it doesn't work.
But this code works :
layout:{
type:'vbox',
align:'stretch'
}
I finally found by myself.
I set the layout options not correctly
I had to change to
...
layout:'vbox',
layoutConfig: {
align: 'stretch'
},
items: [{
...