Skip to content

Commit

Permalink
all test passed , remaining explode
Browse files Browse the repository at this point in the history
  • Loading branch information
gagan-bansal committed Apr 11, 2014
1 parent 632949d commit 00ef0bf
Show file tree
Hide file tree
Showing 9 changed files with 250 additions and 5,749 deletions.
5,594 changes: 11 additions & 5,583 deletions dist/geojson2svg.js

Large diffs are not rendered by default.

28 changes: 1 addition & 27 deletions examples/world.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,18 +3,8 @@
//var dataURL = 'http://54.255.134.125:3005/examples/data/CAN.geo.json';
var dataURLPoint = 'http://54.255.134.125:3005/examples/data/capitals.json';
getjson(dataURLPoint,drawGeoJSON);
getjson(dataURLPoly,drawGeoJSON2);
getjson(dataURLPoly,drawGeoJSON);

function handleRequest() {
if (httpRequest.readyState === 4) {
if (httpRequest.status === 200) {
drawGeoJSON(JSON.parse(httpRequest.responseText));
} else {
console.log('There was a problem with the request.');
}
}
}

function drawGeoJSON(resp) {
console.log('i am drawing');
var geojson = JSON.parse(resp);
Expand All @@ -31,22 +21,6 @@
svgMap.appendChild(svg);
});
}
function drawGeoJSON2(resp) {
console.log('i am drawing2');
var geojson = JSON.parse(resp);
var svgMap = document.getElementById('map');
var convertor = geojson2svg({width:800,height:800});
//var attributes = {style:"stroke:#006600; fill: #00cc00"};
var attributes = {style:"stroke:#006600; fill: none;stroke-width:1px;"};
var svgElements = convertor.convert(geojson,{attributes:attributes,output:'svg',explode:false});
var parser = new DOMParser();
svgElements.forEach(function(svgStr) {
var el = parser.parseFromString(svgStr, "image/svg+xml");
//var svg = el.firstChild;
var svg = parseSVG(svgStr);
svgMap.appendChild(svg);
});
}
//parseSVG from http://stackoverflow.com/questions/3642035/jquerys-append-not-working-with-svg-element
function parseSVG(s) {
var div= document.createElementNS('http://www.w3.org/1999/xhtml', 'div');
Expand Down
5 changes: 4 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,9 @@
},
"devDependencies": {
"mocha": "~1.17.1",
"chai": "~1.9.0"
"chai": "~1.9.0",
"parse-svg-path": "~0.1.1",
"expect.js": "~0.3.1",
"jsdom": "~0.10.5"
}
}
25 changes: 13 additions & 12 deletions src/converter.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,6 @@ function getCoordString(coords,res,origin) {
return coordStr.join(' ');
}
function addAttributes(ele,attributes) {
console.log('adding attr');
var part = ele.split('/>')[0];
for(var key in attributes) {
if(attributes[key]) {
Expand All @@ -19,17 +18,19 @@ function addAttributes(ele,attributes) {
}

function point(geom,res,origin,opt) {
var forcePath = opt && opt.hasOwnProperty('forcePath') ? opt.forcePath
: false;
var path;
if(forcePath) {

} else {
path = getCoordString([geom.coordinates],res,origin);
}
var r = opt && opt.r ? opt.r : 1;
var path = 'M' + getCoordString([geom.coordinates],res,origin)
+' m'+ -r+ ',0'+ ' a'+r+','+ r + ' 0 1,1 '+ 2*r + ','+0
+' a'+r+','+ r + ' 0 1,1 '+ -2*r + ','+0;
return [path];
}
function multiPoint(geom,res,origin,attributes) {
function multiPoint(geom,res,origin,opt) {
var explode = opt && opt.hasOwnProperty('explode') ? opt.explode : false;
var paths = multi.explode(geom).map(function(single) {
return point(single,res,origin,opt)[0];
});
if(!explode) return [paths.join(' ')]
return paths;

}
function lineString(geom,res,origin,otp) {
Expand All @@ -38,7 +39,7 @@ function lineString(geom,res,origin,otp) {
return [path];
}
function multiLineString(geom,res,origin,opt) {
var explode = opt.hasOwnProperty('explode') ? opt.explode : false;
var explode = opt && opt.hasOwnProperty('explode') ? opt.explode : false;
var paths = multi.explode(geom).map(function(single) {
return lineString(single,res,origin,opt)[0];
});
Expand All @@ -65,7 +66,7 @@ function multiPolygon(geom,res,origin,opt) {
var paths = multi.explode(geom).map(function(single) {
return polygon(single,res,origin,opt)[0];
});
if(!explode) return [paths.join(' ').replace('Z','') + 'Z'];
if(!explode) return [paths.join(' ').replace(/Z/g,'') + 'Z'];
return paths;
}
module.exports = {
Expand Down
8 changes: 0 additions & 8 deletions src/defaults.js
Original file line number Diff line number Diff line change
@@ -1,13 +1,5 @@
module.exports = {
mapExtent: [-180,-90,180,90],
mapExtentProjCode: 'EPSG:4326',
mapExtent: [-180,-90,180,90],
inProjCode: 'EPSG:4326',
outProjCode: 'EPSG:4326',
r: 2,
style:"",
proj4jsDefs: {
'SR-ORG:6864': '+proj=merc +lon_0=0 +k=1 +x_0=0 +y_0=0 +a=6378137 +b=6378137 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs',
'EPSG:4326': '+proj=longlat +ellps=WGS84 +datum=WGS84 +no_defs'
}
};
99 changes: 17 additions & 82 deletions src/instance.js
Original file line number Diff line number Diff line change
@@ -1,77 +1,18 @@
var extend = require('deep-extend'),
proj4 = require('proj4'),
reproject = require('reproject'),
defaults = require('./defaults.js'),
converter = require('./converter.js');

//g2svg as geojson2svg (shorthand)
var g2svg = function(viewportSize,opt) {
if(!viewportSize) return;
this.viewportSize = viewportSize;
var opt = opt || {};
extend(defaults,opt);
extend(this,defaults);
var mapExtentProj,inPorj,outProj;
this.reproject = reproject;
if(this.mapExtentProjCode != this.outProjCode) {
if(!this.proj4jsDefs) return;
if(!proj4.defs[this.mapExtentProjCode]) {
if(this.proj4jsDefs[this.mapExtentProjCode]){
mapExtentProj = proj4.Proj(this.proj4jsDefs[this.mapExtentProjCode]);
} else {
return false;
}
} else {
mapExtentProj = proj4.Proj(this.mapExtentProjCode);
}
if(!proj4.defs[this.outProjCode]) {
if(this.proj4jsDefs[this.outProjCode]){
outProj = proj4.Proj(this.proj4jsDefs[this.outProjCode]);
} else {
return false;
}
} else {
outProj = proj4.Proj(this.outProjCode);
}
var ll = proj4(mapExtentProj,outProj,[this.mapExtent[0],this.mapExtent[1]]);
var tr = proj4(mapExtentProj,outProj,[this.mapExtent[2],this.mapExtent[3]]);
this.projectedMapExtent = [ll[0],ll[1],tr[0],tr[1]];
this.mapExtentProj = mapExtentProj;
this.outProj = outProj;
} else {
this.projectedMapExtent = this.mapExtent;
}
this.res = this.calResolution(this.projectedMapExtent,this.viewportSize);

if(this.inProjCode !== this.outProjCode) {
if(!this.proj4jsDefs) return;
if(!proj4.defs[this.inProjCode]) {
if(this.proj4jsDefs[this.inProjCode]){
inProj = proj4.Proj(this.proj4jsDefs[this.inProjCode]);
} else {
return false;
}
} else {
inProj = proj4.Proj(this.inProjCode);
}
this.inProj = inProj;
if(!this.outProj) {
if(!proj4.defs[this.outProjCode]) {
if(this.proj4jsDefs[this.outProjCode]){
outProj = proj4.Proj(this.proj4jsDefs[this.outProjCode]);
} else {
return false;
}
} else {
outProj = proj4.Proj(this.outProjCode);
}
this.outProj = outProj;
}
}
this.mapExtent = opt.mapExtent
|| {'left':-180,'bottom':-90,'right':180,'top':90};
this.res = this.calResolution(this.mapExtent,this.viewportSize);
};
g2svg.prototype.calResolution = function(extent,size) {
var xres = (extent[2] - extent[0])/size.width;
var yres = (extent[3] - extent[1])/size.height;
var xres = (extent.right - extent.left)/size.width;
var yres = (extent.top - extent.bottom)/size.height;
return Math.max(xres,yres);
};
g2svg.prototype.convert = function(geojson,options) {
Expand Down Expand Up @@ -109,23 +50,17 @@ g2svg.prototype.convertFeature = function(feature,options) {
};
g2svg.prototype.convertGeometry = function(geom,opt) {
if(converter[geom.type]) {
var outGeom
,opt = opt || {};

if(this.inProjCode != this.outProjCode) {
outGeom = this.reproject.reproject(geom,this.inProj,this.outProj);
} else {
outGeom = geom;
}
var explode = opt.hasOwnProperty('explode') ? opt.explode : false;
var paths = converter[geom.type].call(this,outGeom,this.res,
{x:this.projectedMapExtent[0],y:this.projectedMapExtent[3]},
{explode:explode}
var opt = opt || {};
//var explode = opt.hasOwnProperty('explode') ? opt.explode : false;
var paths = converter[geom.type].call(this,geom,
this.res,
{x:this.mapExtent.left,y:this.mapExtent.top},
opt
);
var svgJsons,svgEles;
if(opt.output && opt.output.toLowerCase() == 'svg') {
svgJsons = paths.map(function(path) {
return pathToSvgJson(path,geom.type,opt.attributes);
return pathToSvgJson(path,geom.type,opt.attributes,opt);
});
svgEles = svgJsons.map(function(json) {
return jsonToSvgElement(json,geom.type);
Expand All @@ -140,11 +75,11 @@ g2svg.prototype.convertGeometry = function(geom,opt) {
var pathToSvgJson = function(path,type,attributes,opt) {
var svg = {};
var forcePath = opt && opt.hasOwnProperty('forcePath') ? opt.forcePath
: false;
if(type == 'Point' || type == 'MultiPoint' && !forcePath) {
: true;
if((type == 'Point' || type == 'MultiPoint') && !forcePath) {
svg['cx'] = path.split(',')[0];
svg['cy'] = path.split(',')[1];
svg['r'] = opt && opt.r ? opt.r : '2';
svg['r'] = opt && opt.r ? opt.r : '1';
} else {
svg = {d: path};
if(type == 'Polygon' || type == 'MultiPolygon') {
Expand All @@ -158,9 +93,9 @@ var pathToSvgJson = function(path,type,attributes,opt) {
};
var jsonToSvgElement = function(json,type,opt) {
var forcePath = opt && opt.hasOwnProperty('forcePath') ? opt.forcePath
: false;
: true;
var ele ='<path';
if(type == 'Point' || type == 'MultiPoint' && !forcePath) {
if((type == 'Point' || type == 'MultiPoint') && !forcePath) {
ele = '<circle';
}
for(var key in json) {
Expand Down
3 changes: 1 addition & 2 deletions src/main.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@ var geojson2svg = function(viewportSize,options) {

if(typeof module !== 'undefined' && module.exports) {
module.exports = geojson2svg;
}
if(window) {
} else if(window !== 'undefined') {
window.geojson2svg = geojson2svg;
}
107 changes: 98 additions & 9 deletions test/test.js
Original file line number Diff line number Diff line change
@@ -1,22 +1,111 @@
'use strict';
var testDataSets = [];
//testDataSets.push(require('./testdata1.js'));
testDataSets.push(require('./testdata2.js'));
var expect = require("chai").expect;
var extend = require('deep-extend');
testDataSets.push(require('./testdata1.js'));
//testDataSets.push(require('./testdata2.js'));
//var expect = require('expect.js'),
var expect = require('chai').expect
,parsePath = require('parse-svg-path')
,jsdom = require('jsdom').jsdom;

/*expect.Assertion.prototype.path = function(path) {
console.log('this: '+JSON.stringify(this.obj));
console.log('path: '+ path.length);
expect(this.obj).to.eql(path);
};*/

describe('geojson2svg', function() {
testDataSets.forEach(function(testData) {
var precision = testData.precision;
describe(testData.desc+ ': .convert()', function() {
var geojson2svg = require('../src/main.js');
var converter = geojson2svg(testData.svgSize,testData.options);
testData.primitives.forEach(function(data) {
it(data.type,function() {
var outSVG = converter.convert(data.json);
//console.log('outSVG: '+ outSVG);
//console.log('expected SVG: '+ data.svg);
expect(outSVG).to.deep.equal(data.svg);
testData.geojsons.forEach(function(data) {
it(data.type+ ' {output: "path",explode: false,r:2}',function() {
var actualPaths = converter.convert(data.geojson,testData.options);
testPath(actualPaths,data.path,data.geojson.type,precision);
});
it(data.type + ' {output: "svg",explode: false,r:2}',function() {
var options = {output:'svg'};
extend(options,testData.options);
var actualSVGs = converter.convert(data.geojson,options);
testSVG(actualSVGs,data.svg,data.geojson.type,precision);
});
});
it('Feature {output: "path",explode: false}', function() {
var actualPaths = converter.convert(testData.feature.geojson,
{output:'path',explode:false});
testPath(actualPaths,testData.feature.path,
testData.feature.geojson.type,
precision);
});
it('Feature {output: "svg",explode: false}', function() {
var actualSVGs = converter.convert(testData.feature.geojson,
{
output:'svg',
explode:false,
attributes: { id: 'id1',style:'stroke: #000066; fill: 3333ff;' }
});
testSVG(actualSVGs,testData.feature.svg,
testData.feature.geojson.geometry.type,
precision);
});
it('FeatureCollection {output: "path",explode: false}', function() {
var actualPaths = converter.convert(testData.featureCollection.geojson,
{output: 'path', explode: false});
expect(actualPaths).to.be.an('array');
var expPaths = testData.featureCollection.path;
expect(actualPaths.length).to.be.equal(expPaths.length);
for(var i=0; i < expPaths.length; i++) {
testPath([actualPaths[i]],[expPaths[i]],
testData.featureCollection.geojson.features[i].geometry.type,precision);
}
});
});
});
});

function testSVG(actualSVGs,expSVGs,type,precision) {
expect(actualSVGs).to.be.an('array');
expect(actualSVGs.length).to.be.equal(expSVGs.length);
var expSVGEle,actSVGEle,expPaths,actPaths;
for(var i=0;i<expSVGs.length; i++) {
expSVGEle = jsdom(expSVGs).firstChild;
actSVGEle = jsdom(actualSVGs).firstChild;
expect(actSVGEle.nodeName).to.be.equal('PATH');
expect(actSVGEle.hasAttribute('d')).to.be.true;
expPaths = expSVGEle.getAttribute('d');
actPaths = actSVGEle.getAttribute('d');
testPath([actPaths],[expPaths],type,precision);
}
}

function testPath(actualPaths,expPaths,type,precision) {
expect(actualPaths).to.be.an('array');
expect(actualPaths.length).to.be.equal(expPaths.length);
var actPathObj,expPathObj,checkCoord = true;
for(var i=0;i<actualPaths.length; i++) {
actPathObj = parsePath(actualPaths[i]);
expPathObj = parsePath(expPaths[i]);
expect(actPathObj).to.be.an('array');
expect(actPathObj.length).to.be.equal(expPathObj.length);
//check each path moves
for(var j=0;j< expPathObj.length; j++) {
expect(actPathObj[j].length).to.equal(expPathObj[j].length);
//compare move command
expect(actPathObj[j][0]).to.equal(expPathObj[j][0]);
//do not check for polygon's last close command
checkCoord = !(j == expPathObj.length -1 && (type == 'Polygon'
|| type == 'MultiPolygon'));
if(checkCoord) {
for(var k=1;k<expPathObj[j].length; k++) {
expect(actPathObj[j][k]).to.be.closeTo(expPathObj[j][k],precision);
}
/*//compare x coordinate
expect(actPathObj[j][1]).to.be.closeTo(expPathObj[j][1],precision);
//compare y coordinate
expect(actPathObj[j][2]).to.be.closeTo(expPathObj[j][2],precision);*/
}
}
}
}
Loading

0 comments on commit 00ef0bf

Please sign in to comment.