0

I have my json file looks like this

{"level" :[
    {"color" : "#FF6600", "Polygon" : [
        {"lon" : 125.8575930951375,"latt": 36.95626849495004},
        {"lon" : 125.8851548404469,"latt": 36.99677151742446},
        {"lon" : 125.9128154107602,"latt": 37.03743133552931},
        {"lon" : 125.9564137105485,"latt": 37.07788492352393},]},
    {"color" : "#FFFF00", "Polygon" : [
        {"lon" : 125.8575930951375,"latt": 36.95626849495004},
        {"lon" : 125.8851548404469,"latt": 36.99677151742446},
        {"lon" : 125.9128154107602,"latt": 37.03743133552931},
        {"lon" : 125.9564137105485,"latt": 37.07788492352393},]},
]}

if i declare a variable for the above json format inside my html, then I manage to manipulate the data with the following code

var dataObj = {"level" :[
    {"color" : "#FF6600", "Polygon" : [
        {"lon" : 125.8575930951375,"latt": 36.95626849495004},
        {"lon" : 125.8851548404469,"latt": 36.99677151742446},
        {"lon" : 125.9128154107602,"latt": 37.03743133552931},
        {"lon" : 125.9564137105485,"latt": 37.07788492352393},]},
    {"color" : "#FFFF00", "Polygon" : [
        {"lon" : 125.8575930951375,"latt": 36.95626849495004},
        {"lon" : 125.8851548404469,"latt": 36.99677151742446},
        {"lon" : 125.9128154107602,"latt": 37.03743133552931},
        {"lon" : 125.9564137105485,"latt": 37.07788492352393},]},
]}

function UseJSON(){

for (i = 0; i < dataObj.level.length; i++)
{
    var polygon = [];
    for (j = 0; j < dataObj.level[i].Polygon.length; j++)
    {
        var point = map.getTransformXY(dataObj.level[i].Polygon[j].lon, dataObj.level[i].Polygon[j].latt,"EPSG:4326","EPSG:900913");
        polygon.push(new OpenLayers.Geometry.Point(point.x, point.y)); 
    }

    var style_polygon = {strokeColor: "#000000", strokeOpacity: 0.7, fillColor: dataObj.level[i].color, fillOpacity: 0.5, strokeWidth: 1};

    var intensityPolygon = new vworld.Polygon(polygon, style_polygon);

    map.vectorLayer.addFeatures([intensityPolygon]);
}   
}

Refer to this previous answer in SO: How to use json in html

I try to modify my code as per below:

function UseJSON(){

$.getJSON('data.json', function(dataObj) {
    for (i = 0; i < dataObj.level.length; i++)
    {
    var polygon = [];
    for (j = 0; j < dataObj.level[i].Polygon.length; j++)
    {
        var point = map.getTransformXY(dataObj.level[i].Polygon[j].lon, dataObj.level[i].Polygon[j].latt,"EPSG:4326","EPSG:900913");
        polygon.push(new OpenLayers.Geometry.Point(point.x, point.y)); 
    }

    var style_polygon = {strokeColor: "#000000", strokeOpacity: 0.7, fillColor: dataObj.level[i].color, fillOpacity: 0.5, strokeWidth: 0.5};

    var intensityPolygon = new vworld.Polygon(polygon, style_polygon);

    map.vectorLayer.addFeatures([intensityPolygon]);
    }
});
}

But it does not seems to work. As it seems does not get the data.json file from local. Any idea?

Thank you

Community
  • 1
  • 1
jhyap
  • 3,423
  • 5
  • 24
  • 46
  • I guess you need to setup a localhost, or check this answer: http://stackoverflow.com/questions/3102819/chrome-disable-same-origin-policy – philipp Feb 06 '14 at 10:06
  • Local in-sense from desktop you're trying to read the file? check `console` it might be *CORS(cross-domain) issue*. A similar problem I too faced, check http://stackoverflow.com/a/19866904/1671639 – Praveen Feb 06 '14 at 10:06
  • I don't see any data manipulation in your code, you are just reading that data, could you clarify what do you means by that? And what is 'getting data.json from local'? I doesn't understand it too. – Danubian Sailor Feb 06 '14 at 11:00
  • I am reading the data and manipulate it inside the UseJSON function. As you can see, I am doing some operations inside the loop while reading the polygon data. 'getting data.json from local' means, I have my data.json file inside the same directory as my index.html. I hope I can read the json file from local directory and do some operations with it. – jhyap Feb 06 '14 at 15:54

0 Answers0