Hello,
I have an existing image map i want to read coordinates of image map using CSV file , How can i read coordniates of image using CSV?
Can you supply language used?
a. MEAN stack: MongoDB, Express.js, AngularJS, Node.js,
b. Ruby, with Ruby on Rails, Python, with Django
c. C#, with ASP .NET MVC
Also:
- sample CSV
- sample script you have tried that does not work
Edit:
Finished formatting 
I’m using html & php. I have coordinates stored in CSV . I want to read the coordinates from CSV rather then hard core or manual writing. Here is the sample code
img src = "image/landmark.jpg" alt="L4" usemap="#L4"/>
< map name = "L4">
< area shape = 'rect' coords = '662,805,676,828' alt = '1'/>
< area shape = 'rect' coords = '662,757,680,776' alt = '2'/>
< area shape = 'rect' coords = '662,706,680,726' alt = '3'/>
< area shape = 'rect' coords = '662,661,680,680' alt = '4'/>
< area shape = 'rect' coords = '612,682,594,658' alt = '5'/>
< area shape = 'rect' coords = '594,703,614,726' alt = '6'/>
< /map>
CSV format -
Landmark x1 y1 x2 y2
1 662 805 676 828
2 662 757 680 776
3 662 706 680 726
4 662 661 680 680
5 612 682 594 658
6 594 703 614 726
[ot]Try enclosing your supplied script and CSV content, starting and ending with three backticks ` or use the editor’s format option </>
[/ot]
Edit:
I forgot to mention the three backticks must be on their own line.
Also it is possible to edit posts (within about an hour) and save having to duplicate the post.
Also it is possible to delete your own posts which may also prevent duplicaiton,
Also best to add an Edit: to clarify the post has been edited.
Thanks John,
I have made changes according to your suggestion.
1 Like
Have you looked at the fgetcsv function ?
In some ways it allows for getting CSV content similar to getting content from a database.
One difference is that the resulting array has numeric keys.
The approach differs a bit too, but the example in the documentation should be enough to give you a good start.
Yes Mittineague i have checked about fgetcsv function. Here i have tried with fgetcsv function & it is printing full coordinate list-
$file = fopen("csv/L4.csv","r");
while(!feof($file)){
$content = fgetcsv($file);
$count = count($content);
for($i=0; $i<$count; $i++){
echo $content[$i]."\t";
}
echo "<br/>";
The above example snippet i have writing coords manually(hard core). I want to read chords value from csv file which i’m not getting.
I’m confused - at the start you say your code is printing the full co-ordinate list, but lower down you say you want to read from a csv file which you’re not getting - but surely that’s exactly what that code does, then output it. I must be missing, can you give a bit more detail as to the exact nature of the problem you have with the code you posted in post #8?
Isn’t it just a case of losing the for/next loop and changing the echo statement to something like
echo "<area shape = 'rect' coords = '" . $content[1] . "," . $content[2] . "," . $content[3] . ",". $content[4] . "' alt = '" . $content[0] . "'/>";Hello droop,
I was trying separately to fetch the CSV data through fgetcsv & i’m able to fetch but the thing is in above html tag where i’m using my map i need to hard core coords here -
< area shape = ‘rect’ coords = ‘594,703,614,726’ alt = ‘6’/>
i don’t want to hard core the coords i want to read coords through csv here and i’m not able to replace coord value to csv value.
Try adding this debug function to help see what is happening:
<?php
//=================================
// DEBUG function
// usage:
// fred($anyVal);
// fred($anyVal, 'display title');
// fred($anyVal, 'diplay title', true);
//=================================
function fred( $val, $title='', $ents=NULL)
{
if( $ents ):
$val = htmlentities($val);
endif;
echo '<pre>';
echo $title;
print_r($val);
echo '<pre>';
echo '<hr>';
}
$test1 = 'this is a test to see if it works';
$test2 = '<img src="image/landmark.jpg" alt="L4" usemap="#L4" />';
fred($test1, '$test1 ==> ');
fred($test2, '$test2 ==> ');
fred($test2, '$test2 ==> ', true);
Output:
$test1 ==> this is a test to see if it works
$test2 ==> L4
$test2 ==> <img src="image/landmark.jpg" alt="L4" usemap="#L4" />
Thanks John,
Here is code -
<div style="text-align:center;" id="location_title">The Hearth Lands</div>
<img id="map1" src="./images/maps/regions/1.png" usemap="#map1" border="0" width="800" height="800" alt="" />
<map name="map1" id="_map1">
<area shape="rect" coords="0,0,50,50" href="" alt="" title="" />
<area shape="rect" coords="50,0,100,50" href="" alt="" title="" />
<area shape="rect" coords="100,0,150,50" href="" alt="" title="" />
<area shape="rect" coords="150,0,200,50" href="" alt="" title="" />
<area shape="rect" coords="200,0,250,50" href="" alt="" title="" />
<area shape="rect" coords="250,0,300,50" href="" alt="" title="" />
<area shape="rect" coords="300,0,350,50" href="" alt="" title="" />
<area shape="rect" coords="350,0,400,50" href="" alt="" title="" />
<area shape="rect" coords="400,0,450,50" href="" alt="" title="" />
<area shape="rect" coords="450,0,500,50" href="" alt="" title="" />
<area shape="rect" coords="500,0,550,50" href="" alt="" title="" />
<area shape="rect" coords="550,0,600,50" href="" alt="" title="" />
<area shape="rect" coords="600,0,650,50" href="" alt="" title="" />
<area shape="rect" coords="650,0,700,50" href="" alt="" title="" />
<area shape="rect" coords="700,0,750,50" href="" alt="" title="" />
<area shape="rect" coords="750,0,800,50" href="" alt="" title="" />
<area shape="rect" coords="0,50,50,100" href="" alt="" title="" />
<area shape="rect" coords="50,50,100,100" href="" alt="" title="" />
<area shape="rect" coords="100,50,150,100" href="" alt="" title="" />
<area shape="rect" coords="150,50,200,100" href="" alt="" title="" />
<area shape="rect" coords="200,50,250,100" href="" alt="" title="" />
<area shape="rect" coords="250,50,300,100" href="" alt="" title="" />
<area shape="rect" coords="300,50,350,100" href="" alt="" title="" />
<area shape="rect" coords="350,50,400,100" href="" alt="" title="" />
<area shape="rect" coords="400,50,450,100" href="" alt="" title="" />
<area shape="rect" coords="450,50,500,100" href="" alt="" title="" />
<area shape="rect" coords="500,50,550,100" href="" alt="" title="" />
<area shape="rect" coords="550,50,600,100" href="" alt="" title="" />
<area shape="rect" coords="600,50,650,100" href="" alt="" title="" />
<area shape="rect" coords="650,50,700,100" href="" alt="" title="" />
<area shape="rect" coords="700,50,750,100" href="" alt="" title="" />
<area shape="rect" coords="750,50,800,100" href="" alt="" title="" />
I want to read this(coords=“750,50,800,100”) coord value from csv.
I fancied a break from my current task
Here we go:
<?php
//=========================================
function fred( $val, $title='', $ents=NULL)
{
if( $ents ):
$val = htmlentities($val);
endif;
echo '<pre>';
echo $title;
print_r($val);
echo '<pre>';
}
# CONTENTS OF map.csv
$fileMapCsv = '
0,0,50,50
50,0,100,50
100,0,150,50
150,0,200,50
200,0,250,50
250,0,300,50
300,0,350,50
350,0,400,50
400,0,450,50
450,0,500,50
500,0,550,50
550,0,600,50
600,0,650,50
650,0,700,50
700,0,750,50
750,0,800,50
0,50,50,100
50,50,100,100
100,50,150,100
150,50,200,100
200,50,250,100
250,50,300,100
300,50,350,100
350,50,400,100
400,50,450,100
450,50,500,100
500,50,550,100
550,50,600,100
600,50,650,100
650,50,700,100
700,50,750,100
750,50,800,100
';
$fcsv = 'map.csv';
$href = 0;
$row = 1;
if (($handle = fopen($fcsv, "r")) !== FALSE)
{
while (($data = fgetcsv($handle, 1000, ",")) !== FALSE)
{
$num = count($data);
$title = substr( uniqid(), 0, 18);
if( $data[0] > 0 )
{
$row++;
$num = '';
for ($c=0; $c < $num; $c++)
{
$num .= $data[$c] .',' ;//. "\n";
}
$x1 = '<area shape="rect" coords="'
. substr($num, 0, -1) .'"'
. ' href="#' .$href++ .'"'
.' alt="2" '
.' title="' .$title .'" />';
fred($x1,'',1);
}
}
fclose($handle);
}
Output:
<area shape="rect" coords="" href="#0" alt="2" title="5847c4df4830d" />
<area shape="rect" coords="" href="#1" alt="2" title="5847c4df48369" />
<area shape="rect" coords="" href="#2" alt="2" title="5847c4df483bb" />
<area shape="rect" coords="" href="#3" alt="2" title="5847c4df4840c" />
<area shape="rect" coords="" href="#4" alt="2" title="5847c4df4845c" />
<area shape="rect" coords="" href="#5" alt="2" title="5847c4df484b5" />
<area shape="rect" coords="" href="#6" alt="2" title="5847c4df48506" />
Edit:
I sincerely hope you study and try to learn about the script.
Please don’t just copy & paste
Thanks John,
Yes i have read the code.
Thanks Much!!
1 Like
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.